A header is the section at the top of your site – usually your logo, navigation, and sometimes a CTA. A footer sits at the bottom, holding things like contact details, social links, or copyright info. Together, they frame every page and keep navigation consistent site-wide.

In Kirki, you can turn any section into a header or footer Component. Once set, it appears automatically at the top or bottom of every page – no need to place it manually each time.

Why Use Components for Headers & Footers

Manually adding and updating a header or footer on every page gets repetitive fast, and it’s easy for things to fall out of sync – like an outdated nav link or an old phone number.

A Component is a reusable piece of your site that stays in sync everywhere it’s used. Turn a section into a Component, set it as a Header or Footer (a special type of Component) once, and it appears automatically everywhere. Edit it, and the update reflects across your whole site instantly.

Learn more about Components.

Create a Header

1. Right-click the section you want to use as your header, either on the canvas or in the Layers panel, and select Create Component.

2. In the Create New Component dialog, enter a name for your Component and click Create.

3. From the left sidebar, go to the Pages panel and switch to the Assets tab.

4. Click the ellipsis (…) icon beside your new Component, hover over Set As, and select Header.

Your Component is now set as the site-wide header and will appear at the top of every page. 

Tip: Manually added the section elsewhere before? You can delete that copy now – the Header Component will show up there automatically.

Create a Footer

1. Right-click the section you want to use as your footer, either on the canvas or in the Layers panel, and select Create Component.

2. In the Create New Component dialog, enter a name for your Component and click Create.

3. From the left sidebar, go to the Pages panel and switch to the Assets tab.

4. Click the ellipsis (…) icon beside your new Component, hover over Set As, and select Footer.

Your Component is now set as the site-wide footer and will appear at the bottom of every page.

Unset a Header or Footer

You can unset a header or footer in two ways:

From the Layers Panel

1. From the Layers panel, click the ellipsis (…) icon next to your Header or Footer.

2. Select Unset as Header or Unset as Footer.

From the Components Section

1. From the left sidebar, go to the Pages panel and switch to the Assets tab.

2. From the Components section, click the ellipsis (…) icon next to your Header or Footer.

3. Select Unset as Header or Unset as Footer.

Disable a Header or Footer for a Specific Page

Need to hide your header or footer on just one page, without removing it site-wide?

1. From the Layers panel, click the ellipsis (…) icon beside your Header or Footer.

2. Select Disable for This Page.

Your Header or Footer will be hidden on the current page only, and will continue to appear on every other page as usual.