Skip to main content
All CollectionsOperations Portal
7. Ops Portal View - HTML Control
7. Ops Portal View - HTML Control

Creating a view to display data in an HTML formatted page.

Praise Magidi avatar
Written by Praise Magidi
Updated over 5 months ago

This article will show how to create a view with the Ops Portal HTML control.

Use the information provided by this view to design a good page layout for any data provided to others by posting or email.

The article provides guidance on how to:

For more details on the HTML control, click on the following link:

Creating an Ops Portal HTML View

Open the Operations Portal created earlier, go to the Operations Portal menu and click the plus button to add a new View.

  1. Give the View a name and a meaningful description (description optional).

  2. Click on the Save View button.

Select the Control type

Each Ops Portal view can be configured to use a specific control type. Select the HTML option.

  1. Click on the Control field.

  2. Select the HTML option from the selection list,

Select the Flow

Select the desired flow from the dropdown list or alternatively create a new flow by clicking on the highlighted plus button.

Input Schemas

Define an input form to capture input parameters for the flow. This form will be displayed when the View is opened.

The input form is built in the Designer tab. Click on the button highlighted in the image below to build an input form.

  • The Schema Viewer and Raw Schema tabs are used to view the data only.

  • The Designer tab is used to add input fields to capture the required data.

  • Click on the highlighted plus icon (+) to add data objects.

  • The "string" option is used to select the appropriate data type from the selection list.

  • The Required checkbox is selected to ensure that the value is entered at runtime. The flow will not continue if the value is not entered.

An example of the input form is shown in the image below.

Customize the HTML Template

Create an HTML page with preferred branding to serve a custom page content.

The custom page content can contain any HTML elements, including CSS and JavaScript.

To retrieve data from a source, and display it on the page, extract the data using the field names and their associated value by referencing the record as {{FieldName}} or the parameter as {{parameters.Parametername}} using handlebars.

Apart from all the regular editor options, select the </> button outlined in red in the image below to open the coding mode to paste any direct HTML code, or alternatively, use a designer to create a page layout.

The field names Assignee and Case Name can be obtained from the output of the flow which is displayed as follows:

Options

Select the following options to further define your view output.

Allow File Upload – Allow file upload into flow on the file format being used in the flow.

Return Source – The return source from the flow to use.

  • Auto - Auto detects the appropriate output.

  • Record - Returns the current record processed by the subflow.

  • Output - Returns the output of the Writer Step (if any) in the subflow.

  • Result - Returns the output of the Destination Step (if any) in the subflow.

Execute Automatically Execute the flow automatically when the View is opened if no parameters are required.

Background Theme – Style theme for the background to display.

Custom Flow Button – Configurations for a custom button that overrides the execution button display.

Enable Checkbox – Show the custom button and override the standard one.

Name – The name of the button.

Icon – The icon of the button.

Color – The color of the button.

Popup Message – The message of the confirmation popup.

Hidden checkbox – Hide the view from the Operations Portal when selected.

Once the View's configuration is completed, click the Save View button.

Operations Portal

The view is constructed in the Operations Portal. To access it the Operations Portal, Click on the link below:

Type the Organization name and click on the sign-in button.

1. Select the Ops Portal option from the view list on the left side of the platform.

2. Click the Execute Flow button to render the contents of the HTML.

Flow Request Box

Flow request buttons are used to initiate SyncFlow flows that have been set in a SyncFlow Control Ops View.

The flow requests box will show all flow requests. It is located at the bottom of the page on the right side of the screen as shown in the image below. The flow requests box can be expanded and collapsed or removed using the icons outlined in blue.

The flow requests box will automatically expand when any of the buttons are pressed to show the requests.

Details about how long the flow took to run as well as the status will be shown as shown in the image below.

Ops Portal View Menu Section

To access the menu, click on the username initials located on the top right of the page as shown in the image below.

In addition to showing the user details, the menu has the option to show the flow request buttons if they are closed. There are also options to sign out and access the settings page. The settings page is shown in the image below.

Set the table row height by clicking on the outlined dropdown arrow to select the required pixels. The flow request box automatic expansion is turned off in the settings as well by clicking the on/off button outlined in blue in the above image.


Did this answer your question?