Page editor

Learn how you can tailor the Page’s design to your needs

After adding a Page, you can manually change all the details of its currently applied template and add various elements for better customer experience.

In the Page editor, customization occurs in the following categories:

• Visual
• General
• Elements
• Projects

Accessing the editor

Steps

1. In the configuration panel, go to Pages.
2. Click the pen icon next to the desired Page.

   

Result

Page editor is accessed. You can now see the currently applied template.

Warning

If you click Back or close the browser tab without publishing the Page, all the changes will be lost.

Visual

Visual category lets you change the active template and configure colors of both sections along with fonts and headers.

Below you can see a Page with highlighted components and their names so that it’s easier to find your way around the editor.

1. Main section
2. Navigation section
3. Primary font
4. Secondary font
5. Main section link
6. Header
7. Page name
8. Selected element

Steps

1. Set the colors of the Main section using the color picker, HEX code, or RGB codes.

   

   Tip

   Use the minus icon to turn off the configuration of individual colors. That way they will automatically match the background color to create the best possible composition. You can always configure them manually by clicking the plus icon.

   

2. Turn on the toggle if you want the request type icons to be visible on the Page.

   

3. Set the colors of the Navigation section using the color picker, HEX code, or RGB codes.

Result

The visual layer is configured, you can now proceed to edit the General settings.

General

In the General category, you can change the name of the Page which is visible on the configuration panel. In order to do so, click on the text field and start typing.

You can now proceed to adding Elements to your Page.

Elements

With Elements you can insert additional information that will be displayed on your Page. Each Element is unique to each Page and can be configured only in the Page editor.

Currently, there are five configurable Elements:

• Logo/Home link
• Searcher
• Header
• Announcement banner
• Footer

Logo/Home link

Steps

1. Click on the pen icon to expand the Logo/Home link panel.

   

2. Choose the text of the link with up to 48 characters. Alternatively you can upload an image using drag and drop or by browsing files.
   Note

   Supported formats are JPG, JPEG, PNG, HEIC.

3. Choose the target of the link.
4. Click Save.

   

Result

Logo and Home link are configured.

Searcher

Steps

1. Click on the pen icon to expand the Searcher panel.

   

2. Turn on the toggle if you want to add a search bar to your Page.

3. Optionally, you can create a custom Placeholder text to be visible in the search bar.

4. Set the colors of the search bar using the color picker, HEX code, or RGB codes.

5. Click Save.

   

Result

Your search bar is configured.

Header

Steps

1. Click on the pen icon to expand the Header panel.

   

2. Turn off the toggle if you want to hide the header from the Page.
3. Change the text of the header.
4. Click Save.

   

Result

Header is configured.

Announcement banner

Steps

1. Click on the pen icon to expand the Announcement banner panel.

   

2. Turn on the toggle to display the announcement banner.
3. Choose the colors of the font, background, and border.
   Note

   Default colors of the announcement banner are inherited from the Navigation section colors.

4. Enter the text of the banner. You can format it using the Rich text editor.
5. Upload an image.
   Note

   • Maximum dimensions are 32x32 pixels.
   • Supported formats are JPG, JPEG, PNG, HEIC.
6. Click Save.

   

Result

Announcement banner is added.

Footer

Steps

1. Click on the pen icon to expand the Footer panel.

   

2. Turn on the toggle to display the footer.
3. Choose the colors of the font and background.
   Note

   Default colors of the footer are inherited from the Main section colors.

4. Enter the text of the banner. You can format it using the Rich text editor.

   

Result

Footer is added. You can now proceed to adding more service projects to your Page.

Projects

You can add more service projects to the Page that will be displayed in the Navigation section along with their request types groups.

Steps

1. Click on the field to expand a drop-down list.
2. Select as many projects as you want or delete the existing ones.

   

   Note

   Types of supported projects are:

   • Team-managed
   • Service
   • Classic

Result

Projects are added.

Publishing

Once you’ve configured your Page, you can now publish it and make it available for customers. In order to do so, click Publish in the bottom right corner.

Click Save as new if you want to save your design as a new template. Alternatively, click Publish to make the design exclusive to the current Page.

The Page is now published.