Avoid naming components with common values. Header and footer modules cannot have components with the same Property ID. Otherwise, neither display in Express View. It's a best practice to differentiate components with a descriptive name—for example, dwHeaderOutput.
Connecting a Header Module to an Application
Now that you have a header module, connect it to your application.
To connect a header at the Application level:
1.
Navigate to the application that contains your header module.
2.
At the top of the page, click ···(options).
3.
Select Settings.
4.
From the Header Module drop-down, enter or select the header module.
5.
Click Save & Close.
Previewing a Header Module
It's important to note that all modules you plan to have navigate to using your header module must exist in the same application. Otherwise, you'll receive a 403 error.
To preview the header module at the Application level:
1.
Navigate to the application that contains your header module.
2.
At the top of the page, click ···(options).
3.
Select Preview. The application displays on a new page with the header module present at the top.
To successfully preview your header module, you must preview it at the Application level. Otherwise, you must manipulate the browser URL to consider any redirects. The URL looks like the following: https://www.{your-environment}.io/app/{appPath}#/display/{{moduleId}}/{{submissionId}}/{{moduleId}}.
Disconnecting a Header Module
If you decide you do not want a header in your application anymore, you can remove it.
To disconnect a header at the Application level:
1.
Navigate to the application that contains your header module.
2.
At the top of the page, click ···(options).
3.
Select Settings.
4.
From the Header Module drop-down, click the X next to the Header Module’s name.
You'll need to create a header module before connecting it to your application. The best way to achieve this task is to add your header module to the Library. After adding your module to the Library, you can share it with all other applications in your environment.
If you plan to create a header, be mindful when naming components. Both the header and footer modules cannot have components with the same Property ID. Otherwise, neither display in Express View. It's a best practice to differentiate components with a descriptive name—for example, dwHeaderOutput.
1.
At the top right of the Unqork Designer Platform, click the Library ▾ drop-down.
2.
Select Library Elements.
3.
Click + Create New.
4.
In the Module Name field, enter a name for your header module.
To make it easier to locate your header later, begin your module name with Header. For example, Header: Acme Corp.
5.
Click Create.
From here, open the module and customize your header. Here are the following supported components:
Now that you have a header, connect it to your application.
To connect a header module to your application:
1.
Navigate to your workspace and locate your application tile.
2.
Click the ellipsis (···) button.
3.
Select Settings.
4.
From the Header Module drop-down, enter or select a header module.
5.
Click Save.
Previewing a Header Module
It's important to note that all modules you plan to have navigate to using your header module must exist in the same application. Otherwise, you'll receive a 403 error. The following image shows you how to preview a module at the application level:
To successfully preview your header module, you must preview it at the Application level. Otherwise, you must manipulate the browser URL to consider any redirects. The URL looks like the following: https://www.{your-environment}.io/app/{appPath}#/display/{moduleId}/{submissionId}/{moduleId}.
Disconnecting a Header Module
If you decide you do not want a header in your application anymore, you can remove it.
To remove a header module from an application:
1.
Navigate to your workspace and locate your application.
2.
Click the ellipsis (···) button.
3.
Select Settings.
4.
From the Header Module drop-down, click the X next to the Header Module’s name.
Button and 
Hidden components.
Columns, 
Field Group, HTML Element, and Panel components.
Decisions, 
Initializer, and Plug-In components.
Settings
