Page Editor: Widgets

Widgets add both functionality and aesthetics to Pages. This article provides detailed information about the settings & properties of each widget in the order they appear in the Page Editor.

The Widget Settings panel can be opened for any widget by clicking on the pencil (Edit) icon on the right side of the component after it is added to a Page.

Form Widget (pencil (Edit) icon highlighted).

Form Widget

The Form Widget adds a link to a form in your app, providing app users with access to the application’s forms directly from a Page. After adding this widget to a page, clicking the ‘+ create’ button on the widget card opens a new blank form.

SettingDescription
Form to UseWhen first adding the widget to a page, you select the form the widget links to. The ‘Form to Use’ section simply displays the Form selected/linked.
Custom Card TitleEnabling this option allows you to edit the Card Title. By default, the Card Title is the name of the Form it is linked to.
Custom Card DescriptionEnabling this option allows you to enter a custom description which will display below the Card Title.
Show Records TotalWhen this option is enabled, the total number of records for the associated form will display on the bottom left corner of the widget.
Show IconOptionally display an Icon to the left of the Card Title. You may select the Icon and the Color.
Icon SizeThe display size of the Icon.

Label Widget

The Label Widget allows you to add and display formatted text, tables, images and links on your Page.

SettingDescription
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and under the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
BackgroundEnabling this option allows you to change the background color of the Label.

Status Widget

The Status Widget allows you to display the number of records in specified stages of a form’s workflow. When first adding the widget to a page, a dialog box will appear where you must select the reference form, and then you may select which stages to display.

SettingDescription
Form to LoadWhen first adding the widget to a page you choose the reference form. The ‘Form to Load’ section simply displays the Form selected/linked.
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and under the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
Form Stages to TrackThe workflow stages to track with the widget. The 6-dots icon on the right of each stage can be used to change the display order of the stages.
Number of Stages Per RowSet the number of stage cards to show in a single row. This option is influenced by the column layout it is placed in. For example, if this widget is placed in a 4-column layout, the maximum number of Stages Per Row is 2.
Enable link to a viewEnabling this option will allow users to click on a stage in the widget and be redirected to a specified view. The view will be temporarily filtered to only show records that are in the stage the user clicks.
FiltersOptionally filter the widget to only display records which meet the specified criteria.
SettingDescription
Layout TypeThe visual style of the widget.
Show Status IconOptionally display the stage icons in the widget. This option is only available for the ‘Card’ layout type. Stage icons are chosen during stage creation (in the Workflow Editor).

View Widget

The View Widget allows you to embed one of your application views on a Page. Within the page, the view maintains its visual appearance and most of its settings. However, if the view has the ‘Preview Pane’ setting enabled, the embedded view will not open records in a preview pane (instead, it will redirect to viewing the record).

SettingDescription
View (View to Load)When first adding the widget to a page you choose the reference View. The ‘View to Load’ section simply displays the View selected/linked.
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and under the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
Show DeleteWhether or not to display the ‘Delete’ button in the embedded view. If this option is not enabled, users will not be able to delete records directly from the embedded view. Permission settings still apply, meaning that if the ‘Delete’ button is enabled, members of a role that does not have permission to delete records will still not be able to delete records.
Show CreateAdds a ‘+’ icon to the top of the widget which redirects to the form associated with the view, allowing users to create a new record. Permission settings still apply.

Pie Chart Widget

The Pie Chart Widget allows you to display form data in a Pie or Donut Chart style report. When adding this widget to a page, you must select the Form and the field on that Form that you want to report on.

SettingDescription
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and under the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
Form to LaunchWhen first adding the widget to a page you choose the reference form. The ‘Form to Launch’ section simply displays the Form selected/linked.
FiltersOptionally filter the widget to only display records which meet the specified criteria.
SettingDescription
Group LabelWhen first adding the widget to a page you choose the reference field on the Form. The Group Label section simply displays the field selected/linked.
Chart Display TypeChoose the visual style of the widget.
Chart Display SizeThe display size of the widget on the Page.
Chart Label StyleOptionally display the sum or percentage of records in each grouping. For example, if you select the ‘Status’ field of a form and set the label style to ‘Number’, the widget will display the total number of records in each ‘Status’.
Show LegendOptionally display the Chart legend. For example, if you select the ‘Status’ field of a form, the legend will display the ‘Status’ names next to their associated color.
Legend PositionWhere on the widget to display the legend.
Legend Font SizeThe font size of the legend.
Use point styleChanges the legend icons from a rectangle shape to a circle (or point) shape.

Bar Chart Widget

The Bar Chart Widget allows you to display datasets in a bar or line style report. When adding this widget to Page, you must select the Form to reference and the ‘Label Field,’ i.e., the field that will serve as the Chart’s X-axis.

SettingDescription
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and under the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
Form to LaunchWhen first adding the widget to a page you choose the reference form. The ‘Form to Launch’ section simply displays the Form selected/linked.

The ‘Chart Data‘ section is where you choose which dataset(s) to display on the Chart. Datasets are based on your Form fields. There are two datasets in the image above: one based on the ‘Status’ system field, and another based on a ‘Number Field.’

For Number and Currency fields, you must choose the ‘Aggregate operation‘ you wish to perform on the dataset. You may also customize the display color for the dataset, and add any additional filtering.

SettingDescription
Group LabelDisplays the ‘Label Field’ (X-axis) selected when first adding the widget to the page. This cannot be changed once selected.
Order LabelsThe order to display the chart labels (X-axis labels).
Chart Display TypeThere are two Chart styles for this widget: Bar, and Line.
Stack BarsIf the Bar style report is selected, this option will stack the datasets on top of one another instead of next to each other.
Chart OrientationOrients the Chart vertically or horizontally.
Chart Display SizeControls the display size of the widget.

For the Legend Style‘ section, see here.

Metric Widget

The Metric Widget displays a metric report of your data. When adding this widget to Page, you must select the Form to reference and the Field from that form that you want to report on.

SettingDescription
Form to LaunchWhen first adding the widget to a page you choose the reference form. The ‘Form to Launch’ section simply displays the Form selected/linked. This cannot be changed once selected.
Group LabelDisplays the Field selected when first adding the widget to the page (i.e., the Field being reported on). This cannot be changed once selected.
Group OperationThe operation to apply to the Field data. By default, the widget uses the record count. Other operations use calculations.
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and under the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
Number of Cards Per RowSet the number of cards to show in a single row. This option is influenced by the Column Layout. For example, if this widget is placed in a 4-column layout, the maximum number of Cards Per Row is 2.
SettingDescription
FiltersOptionally filter the widget to only display records which meet the specified criteria.
LayoutChoose the visual style of the widget.

SLA Table Widget

The SLA Table Widget displays SLA data from your app. The widget can be filtered to display specific SLAs.

SettingDescription
Card TitleOptionally add a custom title to the widget. The title will display above the widget.
Card DescriptionOptionally add a custom description to the widget. The description will display above the widget and under the title (if enabled).

The ‘Filters’ section is used to filter the SLA Table. The settings you configure here will determine the initial state of the table. However, you can easily modify these filters in-app directly from the widget header bar (see image below).

‘From,’ ‘To,’ ‘Forms,’ and ‘Slas’ can be used to filter the table in-app.
SettingDescription
FormattingThe Formatting section lets you add custom conditional formatting to the widget. When enabled, the ‘+ Add Formatting’ button will appear where you can add any number of conditional formatting rules.
NameA name for the formatting rule.
ColumnWhich column will receive the formatting.
OperatorThe condition to apply to the value.
ValueThe value to check the condition against.
ColorThe color of the text if the condition is met.
BackgroundThe cell background color if the condition is met.

YouTube Player Widget

The YouTube Player Widget lets you embed a YouTube video on your Page. When adding this widget to Page, a dialog box will appear where you must add the URL link to the YouTube video.

SettingDescription
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and below the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
Youtube Video URLThe URL of the YouTube video.
Start time of videoSet the start time of the video (in seconds) when it is first played. Users will still be able to seek any timestamp within the video.
End time of videoSet the end time of the video (in seconds) when it is first played. The video will end when it reaches this timestamp. Users will still be able to replay the video and seek any timestamp within the video.

iFrame Widget

The iFrame (inline frame) Widget is used to embed and display a web page on your app Page. When adding this widget to Page, a dialog box will appear where you must add the URL link to the web page.

SettingDescription
Show Widget TitleOptionally display a custom title above the widget. After enabling this option, a text box will appear where you can enter a title.
Show Widget DescriptionOptionally display a custom description above the widget and under the title (if enabled). After enabling this option, a text box will appear where you can enter a description.
Iframe URLThe URL of the web page you want to display.
Iframe SizeThe display size of the embedded web page.
Iframe BorderOptionally add a border around the embedded web page. After enabling this option you can choose the Border Width (in pixels) and Color.
Allow JavascriptToggle to allow the iFrame to run scripts.
Updated on August 23, 2023

Was this article helpful?

Related Articles