Documentation - Header Module

-

REQUIREMENTS

Before creating this module it is important to make sure you have everything you need:

1. UTM DATASET: If you will include a CTA, you must first create a Utm Dataset to reference it in the corresponding field. Please follow [ this link ] to find more info about how to create it.
2. COUNTDOWN: If the content of this module is going to change depending on a countdown you must first create it. In [ this link ] you can find more information about how to do it.

-

LAYOUTS

1. Navbar & Sidebar with countdown and items.
   In this we can add a header and complete menu.
2. Navbar & Topbar with countdown and items. Same as the previous layout but with a change of structure. In this we can add a header and complete menu.
3. Navbar with language selector.
   Here we can only add the Logo. The language selector will be updated dynamically if the page is added in more languages.

Find below an example of a Header Module:

LOGO

Here you can add the IMAGE of the landing page logo and its corresponding ALT text.

-

TICKETS

In this section you can edit the all related to the CTA:

• ENABLE CTA: Shows or hide the button.
• SALES and WAITLIST info:
  If no countdown is active or if the countdown ends this fields will be active:
• • SALES TEXT
  • SALES_PLAN_ID
    But, if there is an active countdown these fields will be active:
  • COUNTDOWN TEXT
  • WAITLIST_PLAN_ID
• REFERENCED COUNTDOWN: Select the countdown, created previously , you wish to work with.
• REFERENCED UTM DATASET: Assign the corresponding UTM Dataset, created previously .
  -

MENU NAV ITEMS

Existen dos tipos de Nav Items:

• ITEM: Es un link de Header normal con los fields que explicamos más abajo.
• DROPDOWN ITEM: Parent item where you can add inside other items to categorise.

Here you can add the menu links. For each one you can edit:

• TITLE: The text of the link.
• URL: It is important to add "#" if it goes to an internal section of the landing and "/" if it goes to an internal page.
• TARGET BLANK: if it is enabled, the link will open in another tab.
• VISIBLE IN MOBILE: if it is enabled, the item will be visible on mobile.

The Header as such works exactly the same, but the difference is the internal structure and certain styles, especially how the Dropdown Items are displayed.

Another notable difference is how the mobile menu works:

(see the fixed navbar layout in the page that you are right now)

Options in this layout:

-

LOGO

As same as the previous layout, here you can add the IMAGE of the landing page logo and its corresponding ALT text.

-

LANGUAGE

Depending on the languages/pages you have created, the language selector will be displayed on the right. If there is only one language, the selector will no be displayed.