Pages

Pages enable you to easily craft out contents simply by dragging and dropping the various fields (e.g text, images, videos ) into working area. 'Save' and 'live' with a valid url path sharable on any marketing channels.


On this page:


Setting up a Page


1. Access Pages interface via 'Playbook' > 'Smart Form' > 'Create' 

Screenshot 2021-06-27 at 3.22.03 PM

2. Once within the 'Create' interface, choose a template that you will like to work with.

Screenshot 2021-06-27 at 3.43.59 PM

3. Within the 'Page' interface, just drag and drop various fields. Just make sure 'Page Template Name' is fill up & 'Live' checkbox is ticked. Then hit 'Save' will do.

Screenshot 2021-06-27 at 5.25.31 PM-1

4. You will be redirected back to the 'Pages' main interface. Just click on the link of the newly created page content url and you will be able to view it on your internet browser.

Screenshot 2021-06-27 at 5.34.46 PM-1


Setting up content & working area


1. Drag and drop concept to create content field in working area. Access the 'Content' tab and click on the type required, hold and drag it over to the working area and it's done. 

Screenshot 2021-06-27 at 9.48.21 PM

2. To access the content field on the working area, just need to click on it and the necessary UI / options will appear for you to select and make necessary changes.

Screenshot 2021-06-27 at 9.56.28 PM

3. Base on the default template, the working fields is set to just 1 column, so if there's a need for multiple column setting (Example: To display 2 image side by side) . You will have to access 'Rows' tab and same thing goes, drag and drop the necessary template into the working area and it's done.

Screenshot 2021-06-27 at 9.58.21 PM


Additional Settings

Screenshot 2021-06-27 at 10.08.47 PM

  • Page Template Name : The name of the template for internal reference.
  • Page Title : An header name appearing on the frontend UI of the Webapp. So if there's no need for one, can keep this field empty, refer to screenshot below.
  • Page Slug : The url path of the page. Do take note, the naming convention be something like this https://xxxxx/p/{page slug}. 
  • View by Member Only checkbox : Once this is checked, it meant that this page is no longer accessible by the public, you will have to login as a member prior to view it.
  • Do not stack on mobile : This toggle will need to be 'On' if you want the 2 column content to appear side by side on mobile interface. If this is not 'On', on the mobile display, it will be stacking on top of each other instead.
  • Padding : If you wanted to leave some gap from the top / side panel, you can adjust it over here to achieve the desired result.
  • Border : If you wanted some border element around the text / image field, you can toggle it via this interface.
    Screenshot 2021-06-27 at 10.23.41 PM