Page Builder Overview

The Page Builder makes it easy to create pages in your app.

Tutorial

Create a new Page

In your app customizer, go to Custom Pages => New Page => Page Builder.

Give your page a title.

Click Add Block, choose a block, fill out the settings as you like. See below for a list of available blocks and settings.

Add to Menu

To add your page to a menu, select the menu in the dropdown. Optionally add an icon, then save.

The page will refresh after saving so you can preview your changes.

Seeing Your Changes

Page Builder pages can be updated remotely, meaning you don't need to rebuild your app to see changes.

To see the changes you made to a page, the app needs to be refreshed. This should happen automatically, but if you are having trouble try refreshing your browser.

To see your changes on an app that is already installed on a device, you need to:

  1. Press "Publish Changes" on the Build and Preview tab
  2. Close and re-open the app on your device

Blocks

See available blocks below, with links to more information about available options.

  • WordPress Post List
  • Single post or page - enter the post type and ID, gets a single item from your site via API.
  • Menu Item Cards - displays any side or tab menu links (skips the first item)
  • Login Toolbar - click to open login modal, works best at the top of the page
  • Title - adds an h2 title
  • Button - an ion-button component. Choose the action: open an app page, external webpage, media player, or login modal.
  • Card - an ion-card component, choose image and text
  • Podcasts/Media - a list of WordPress posts that have media urls. Requires setup, see this article.
  • LearnDash Courses - lists courses, see setup docs here
  • WordPress Post Category List - shows categories. Customize using arguments here.
  • WooCommerce Products - a list of products, customization options
  • WooCommerce Categories - display categories, customization options
  • WooCommerce Slider - display Woo products or categories in a horizontal carousel.
  • Post Slider
  • Custom Content - add any custom HTML (no Ionic tags, Javascript, or interactivity)
  • Push settings - for segmented push notifications
  • Downloads from WordPress - a list of media that has been downloaded from WordPress
  • Language Settings - choose a translation
  • App Camera - upload photos to WordPress. Setup docs.
  • In App Purchase form - setup docs
  • Ad Settings - see this article