> For the complete documentation index, see [llms.txt](https://help.fluorescent.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.fluorescent.co/cornerstone/header/header.md).

# Header

The **Header** appears at the top of each page so customers can navigate your store with ease. In your theme editor, click the **Header** section to find settings and features.

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><a href="#set-up-main-menu"><strong>Menu links</strong></a></td><td>Set up links, featured link, and hover interaction.</td><td><a href="/pages/wDs2c80NQpl45lK7AFYC#set-up-main-menu">/pages/wDs2c80NQpl45lK7AFYC#set-up-main-menu</a></td></tr><tr><td><a href="/pages/f2D1zAAS9EFxI5D5GhIC"><strong>Layout</strong></a></td><td>Rearrange the store name, search bar, and menus.</td><td><a href="/pages/f2D1zAAS9EFxI5D5GhIC">/pages/f2D1zAAS9EFxI5D5GhIC</a></td></tr><tr><td><a href="/pages/f2D1zAAS9EFxI5D5GhIC#enable-sticky-header"><strong>Style</strong></a></td><td>Customize sticky header, icons, and custom colors.</td><td><a href="/pages/f2D1zAAS9EFxI5D5GhIC#enable-sticky-header">/pages/f2D1zAAS9EFxI5D5GhIC#enable-sticky-header</a></td></tr><tr><td><a href="/pages/ULuq8cOHZtvlE8eLZ7xy"><strong>Logo</strong></a></td><td>Upload logo image with custom width.</td><td><a href="/pages/ULuq8cOHZtvlE8eLZ7xy">/pages/ULuq8cOHZtvlE8eLZ7xy</a></td></tr><tr><td><a href="/pages/scAwyTBe0mSBr7M3btnq"><strong>Mega navigation</strong></a></td><td>Set up multi-column menus with promotional features</td><td><a href="/pages/scAwyTBe0mSBr7M3btnq">/pages/scAwyTBe0mSBr7M3btnq</a></td></tr><tr><td><a href="/pages/uc80HLpmw7oiX9A96rdN"><strong>Transparent header</strong></a></td><td>Make the header background transparent.</td><td><a href="/pages/uc80HLpmw7oiX9A96rdN">/pages/uc80HLpmw7oiX9A96rdN</a></td></tr><tr><td><a href="/pages/l2Yx1EpvXFLfZHcRvr8J"><strong>Search bar</strong></a></td><td>Enable predictive search with filters and quick links.</td><td><a href="/pages/l2Yx1EpvXFLfZHcRvr8J">/pages/l2Yx1EpvXFLfZHcRvr8J</a></td></tr></tbody></table>

## Set up main menu

***

By default, the header menu is set to the **Main menu** found in your Shopify Admin. If you created a separate menu, go to the theme editor (**Customize**) to change the selected menu for your **Header**.

<details>

<summary><mark style="color:blue;"><strong>STEPS</strong></mark></summary>

In your theme editor (**Customize**):

1. Under the **Main menu** section, click **Change** and **Change menu**.

   <img src="/files/1MsOtkB1BULnnvgYnmU2" alt="" width="299">
2. Select a menu from your Shopify admin that you want to use.
3. Select a **Menu interaction mode** to change how dropdown menus open.

   > Select either **Click to open** or **Hover to open**.

</details>

### Enable featured link

***

Highlight a top-level menu item with a custom color. Click the **Header** section and enter the name of the menu link in the **Featured link label** field.

> The mobile featured link is set up in the [Mobile menu section](/cornerstone/header/mobile-menu.md#featured-link).

<figure><img src="/files/qGiVjTeCPveXXmEoIlFC" alt="" width="464"><figcaption><p>Header menu with 'Sale' featured link</p></figcaption></figure>

### Change menu interaction mode

***

Choose how dropdown or mega menus should be opened, either by clicking or hovering over the top-level link.

Click the **Header** section, and set the **Menu interaction mode** to either **Click to open** or **Hover to open**.

## Watch tutorial video

Watch our video for navigation tips for your large-catalog Shopify store.

{% embed url="<https://www.youtube.com/watch?v=kgsFzjSid3k>" %}

***

> **Related links**
>
> [Header](/cornerstone/header/header.md)\
> [Layout and style](/cornerstone/header/header/layout.md)\
> [Logo](/cornerstone/header/header/logo.md)\
> [Mega navigation](/cornerstone/header/header/mega-navigation.md)\
> [Transparent header](/cornerstone/header/header/transparent-header.md)\
> [Mobile menu](/cornerstone/header/mobile-menu.md)\
> [Search bar](/cornerstone/header/search-bar.md)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.fluorescent.co/cornerstone/header/header.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.