--- title: "Header and footer" slug: "header-and-footer" updated: 2024-10-07T15:40:33Z published: 2024-10-07T15:40:33Z canonical: "docs.zilliant.com/header-and-footer" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.zilliant.com/llms.txt > Use this file to discover all available pages before exploring further. # Header and footer If you have the Commerce System Administrator [role](/v1/docs/user-roles), eCommerce allows you to manage [header](/v1/docs/header-and-footer#header) and [footer](/v1/docs/header-and-footer#footer) settings. To access these settings: 1. From the top navigation bar, select your account. 2. From the dropdown menu, select **Commerce Administration**. 3. From the left navigation area, select **Global Settings**. ## Header A *header* is the top navigation bar of the eCommerce application. The header consists of: - **A corporate logo**—Also functions as a link to eCommerce’s landing page. - **Navigation links** - **Language Settings**—Appears as a globe icon and allows you to manage which language the eCommerce application displays. - **User Profile Information**—Appears as a profile icon or a custom profile image. Select it to view a dropdown menu of account options. Depending on your user permissions, you can access eCommerce application settings here. eCommerce provides the following default navigation links: - **All**—All items which are visible in eCommerce and have classification values as Consumables, Spare Parts, or Products. - **Products**—All items which are visible in eCommerce and have classification values as Products. The purpose of this link is to show all machines (KMATs or material variants). Users can browse these machines and see related consumables, or use the visual product finder to find other products and spare parts. Should the inquiry process be enabled, users can also configure and submit inquiries, and request quotations. - **Consumables**—All items which are visible in eCommerce and have classification values as Consumables. - **Spare Parts**—All items which are visible in eCommerce and have classification values as Spare Parts. - **Equipment**—All items registered as Equipment. The purpose of this link is to show all registered products installed. Users can browse these equipment and see related consumables, or use the visual product finder to find other products and spare parts. To manage the header, go to **Header** in your **Global Settings**. From here, eCommerce allows you to customize the following settings: - [Label and order](/v1/docs/header-and-footer#label-and-order) - [Product categories and material groups](/v1/docs/header-and-footer#product-categories-and-material-groups) - [External navigation links](/v1/docs/header-and-footer#external-navigation-links) ### Label and order To manage a navigation link’s label, select the language icon to the right of the link. Fill out the desired language fields and select **Update**. For localization of other eCommerce elements, read [Localization](/v1/docs/localization-1). To change a navigation link’s order, select the hamburger icon to the left of the link and drag it to the desired order. ### Product categories and material groups eCommerce allows you to further refine the parameters for navigation links. For products, consumables, and spare parts, assigning specific product categories or material groups to them provides users with a more focused browsing experience of the product catalog. To manage a navigation link’s dropdown options: 1. Select Details. 2. Select **Product Category** or **Material Group** from the dropdown menu as desired. Note If you change a navigation link’s dropdown option type, eCommerce will discard selections for the previous type. 3. Select **Add**. 4. Turn on the category switch to allow it, then select **Save**. If you don’t manage a navigation link’s dropdown options, selecting a navigation link will instead display the entire product hierarchy with relevant product filters. Note that product visibility within product categories and material groups is still subject to individual product settings. For more details, read [Product visibility](/v1/docs/product-visibility). ### External navigation links To add an external navigation link: 1. From the top navigation area, select **Add**. 2. Select Details. eCommerce allows external navigation links to lead users to one of the following options: - A URL inside the current browser tab, or in a new browser tab. - A new page with an embedded application. To lead users to a URL: 1. In the **URL** field, enter a URL. 2. Turn on or off the **Open in New Browser Tab** switch. To lead users to a new page with an embedded external application: 1. Go to Zilliant CPQ. 2. From the left navigation area, select **Administration**. Note You must have the Commerce System Administrator [role](/v1/docs/user-roles) to access this menu item. 3. From the top navigation bar, select **Destination Configuration**. Tip If you don't see a menu item in Zilliant CPQ’s top navigation bar, select Open dropdown menu at the right end of the navigation bar, or select the left and right arrows to move through the navigation bar. 4. Select one or more destinations. 5. Go to **Global Settings** in eCommerce, then **Header**. 6. Select Details for the desired external navigation link. 7. Turn on the **Enable iFrame** switch. 8. Select a destination from the dropdown menu. 9. Select an alignment from the **Mode** dropdown menu. 10. The selected mode fills in the **Dimensions (pixels)** fields by default. Adjust them as needed. Enter and maintain the following additional properties: | Property | Description | | --- | --- | | isIFrame | Possible values are **True** or **False**. Required to define that a destination is to be used for embedding iFrames. | | active | Possible values are **True** or **False**. Determines whether or not a destination appears as a dropdown option in eCommerce when managing an external navigation link. If set to **True**, the destination will appear. | | directURL | Possible values are **True** or **False**. Determines whether or not eCommerce needs an external call to determine the final URL. If set to **True**, the URL will be opened directly. If set to **False**, it is expected that the URL returns an actual URL which is opened. | | *Any other property* | The URL may contain additional parameters to be passed which can be defined using the following pattern: `https://acme.com/trial-signup?param1={firstParam}&param2={secondParam}` Replace `{firstParam}` and `{secondParam}` with the escape sequence. | ## Footer A *footer* is the bottom navigation bar of the eCommerce application. The footer consists of: - Address information - Contact information - Social media links - Additional links To manage the footer, go to **Footer** in your **Global Settings**. From here, eCommerce allows you to customize the following settings: - To manage a link’s label, select the language icon to the right of the link. Fill out the desired language fields and select **Update**. For localization of other eCommerce elements, read [Localization](/v1/docs/localization-1). - To change a link’s order, select the hamburger icon to the left of the link and drag it to the desired order. - To make a link in the **Additional Links** section to open in the current browser tab instead of a new browser tab, turn on the **Open in Current Tab** switch. ![](https://cdn.document360.io/24f960e8-3c1c-4c18-a2c6-83b6ae4aab84/Images/Glossary/Details.png?sv=2026-02-06&spr=https&st=2026-11-10T17%3A05%3A09Z&se=2026-11-10T18%3A05%3A09Z&sr=c&sp=r&sig=aDnJykXVHl4TM8rSUwAVwSHQnQvCIC0QlIEqZmmLDxk%3D) Details ![CPQ-icon_down](https://cdn.document360.io/24f960e8-3c1c-4c18-a2c6-83b6ae4aab84/Images/Documentation/CPQ-icon_down.png?sv=2026-02-06&spr=https&st=2026-11-10T17%3A05%3A09Z&se=2026-11-10T18%3A05%3A09Z&sr=c&sp=r&sig=aDnJykXVHl4TM8rSUwAVwSHQnQvCIC0QlIEqZmmLDxk%3D) Open dropdown menu