Header

This is the global header that appears at the top of your website pages, including your company logo, menu, search icon, etc.:

Act3 Header preview

Table of Contents

Theme settings

Choosing your headers

Currently, there are 6 website headers available in Act3, and 2 navigation-free landing page headers that you can select in the Theme settings > Components > Header:

Act3 Theme settings > Components > Header

Note: All your pages and blogs will use your website header, and all your landing pages will use the landing page header. Although, you can specify if the page should use the website header or the landing page header (see the Page settings section below).

If you want your website header to remain sticky while scrolling, check the Sticky header box:

Act3 Theme Settings > Enable or disable the sticky header

Note: Landing page headers don't have a sticky version available because that may be seen as a distraction and interfere with the conversion process.

Header color scheme

There is also an option to select a Light or a Dark color scheme for your headers:

Act3 Theme Settings > Select header color scheme

Important note: Some modules included in the headers have their own color scheme options, which may override this global setting, so please make sure you select the proper color scheme for your modules as well if they are not correctly rendered for your header's current color scheme.

Page settings

You can use every page template in Act3 for either website pages or landing pages. You only need to check this box on your page to apply your landing page header and footer, or uncheck it to use the default website versions:

Act3 > Page editor > Contents > LP header and footer > Step 1

Act3 > Page editor > Contents > LP header and footer > Step 2

Overlapping header

If your page has a large background at the top and you want your header to overlap that section, you can check this box:

Act3 > Page editor > Contents > Overlapping header > Step 1

Act3 > Page editor > Contents > Overlapping header > Step 2

Note: Overlapping headers don’t have a background color and will always use a Dark color scheme for the overlapping elements.

Global content editor

You can edit the content of a header by clicking it in the page editor, which will open your header in the Global content editor:

Act3 edit header > Step 1

Act3 edit header > Step 2

All three header instances — default, sticky and overlapping — are part of the same header. Only the logo, buttons, and icons are different content, in case you need a white logo version for the overlapping header or some smaller buttons or a simpler, smaller logo in the sticky header. The rest remains the same, with minor color adjustments (e.g., the text is white on the overlapping header).

Here are all the available headers and their options:

Previews

Header 1

Live previews: Static | Overlapping

Act3 - Header 1 Light - Sample

Act3 - Header 1 Dark - Sample

Header 2

Live previews: Static | Overlapping

Act3 - Header 2 Light - Sample

Act3 - Header 2 Dark - Sample

Header 3

Live previews: Static | Overlapping

Act3 - Header 3 Light - Sample

Act3 - Header 3 Dark - Sample

Header 4

Live previews: Static | Overlapping

Act3 - Header 4 Light - Sample

Act3 - Header 4 Dark - Sample

Header 5

Live previews: Static | Overlapping

Act3 - Header 5 Light - Sample

Act3 - Header 5 Dark - Sample

Header 6

Live previews: Static | Overlapping

Act3 - Header 6 Light - Sample

Act3 - Header 6 Dark - Sample

Header LP 1

Live previews: Static | Overlapping

Act3 - Header LP 1 Light - Sample

Act3 - Header LP 1 Dark - Sample

Header LP 2

Live previews: Static | Overlapping

Act3 - Header LP 2 Light - Sample

Act3 - Header LP 2 Dark - Sample