Page Builder
Studio Users add Components to pages to create their digital experience design.
Lumavate offers two versions of Page Builder, version 6 and version 5. Version 6 of Page Builder removes the ability to add custom javascript to apps. To keep custom javascript in an app, only use version 5 of Page Builder. All new apps created will default to using version 6 of Page Builder.
Configuring Page Builder
Jump to a Section:
Overview
| Property Name | Instructions |
|---|---|
| Name | Enter the name of your page. |
| Page Type | Select from the dropdown: Normal or Home Each digital experience will have just one Home Page Type. The Home page is where the App Manifest is configured. Upon selecting Home Page Type the Manifest properties will appear. |
| Manifest Properties | App Manifest: The web app manifest provides information about a web application in a JSON text file, necessary for the web app to be downloaded and be presented to the user similarly to a native mobile app (e.g., be installed on the home screen of a device, providing users with quicker access, and a richer experience). Within Lumavate, a web app manifest is configured at the Page level, under Page Settings. Studio Users set the Page Type to Home to reveal the web app manifest properties. Name: This name will appear in a web browser Short Name: This name will appear on a mobile device Background Color: Defines the expected background color for the web application. Theme Color: Defines the default theme color for an application. This sometimes affects how the application is displayed by the OS (e.g., on Android's task switcher, the theme color surrounds the application). Splash Screen Icon: The icon that is seen on the tab of a web browser. Favicon: The icon that is seen on a mobile device. |
| Meta Description | Provide a short description of the page content to assist with organic search. |
| SEO Index | Toggle on to make the page indexable for organic search. |
Layout
| Property Name | Instructions |
|---|---|
| Background Color | Set the color of the background of the page. |
| Display Header | Toggle on to display the Header set up in the Branding section of the digital experience. Toggle off to hide the Header on this Page. |
| Display Footer | Toggle on to display the Footer set up in the Branding section of the digital experience. Toggle off to hide the Footer on this Page. |
| Display FAB | Toggle on to display the FAB set up in the Branding section of the digital experience. Toggle off to hide the FAB on this Page. |
| Display Tracking Cookie | Toggle on to enable the Tracking Cookie set up in the Branding section of the digital experience. Toggle off to disable the Tracking Cookie. |
| Display Background Image | Toggle on to display the background image selected in the next property. |
| Background Image | Upload an Image or select Content from Images to display as the page background image. |
| Page Padding (px) | Sets how much space will appear on the top, bottom, left, and right of the page. |
Data Connection
| Property Name | Instructions |
|---|---|
| Add Data Connection (button) | Use this button to add as many data connections as required. |
| Data Connection Properties | Data Source: Select from dropdown options. A secondary field will appear based on this selection.
URL Parameter: Default set to 'did' Column Match: Default set to 'id' Test Record: Enter a record id to visualize how the page design will appear with live data. |
Advanced
- To access the Advanced section of Page Builder and the Javascript Editor Studio Users must be on the 5.1.12 of Page Builder. Learn more about Managing Versions.
- The Javascript of your app is housed in this section. By clicking on the JAVASCRIPT button you can open the script and add in your own code where it reads: "Please place your code beneath this comment".
Security
The dropdown allows Studio users to configure a Page's security. There are three options:
- <None> - This is the default for all Pages. It allows all app users to see the Page and its content.
- All logged in users - This will require app users to login to the app before they can see the Page content. Login must be configured using either SAML SSO or Email Authentication.
- Specific user group(s) - This limits access of the Page to a defined set of users based on Email Authentication.
- No Auth Redirect - Studio Users can set an existing Page or external link where users sign in.
- Specific Group(s) - Options are pulled from Email List(s) or Email Pattern(s) set up in the Email Authentication Feature.