> 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/eclipse/header/header.md).

# Header

Section

The **Header** appears at the top of every page with a menu with icons for search and the cart.

<figure><img src="https://3688473072-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHUe2h5JnXOGnUNdkJwav%2Fuploads%2F3vECwrmcJL2HuM7eNDFb%2Fheader.png?alt=media&amp;token=ef3f7f70-48df-4246-abe4-65626f7cd84a" alt=""><figcaption></figcaption></figure>

## Set up header menu

***

By default, the header menu uses the **Main menu** from your Shopify Admin.

To edit this menu, go to **Content > Menus** in your admin. You can also create a new menu and select that as your header menu in the theme editor.

<table data-card-size="large" 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><mark style="color:blue;"><strong>Mega menu</strong></mark></td><td>Display links in a multi-column dropdown menu.</td><td><a href="/eclipse/header/header/mega-menu.md">Mega menu</a></td></tr></tbody></table>

## Change layout and style

***

Click the **Header** section to customize its appearance.

<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><mark style="color:blue;"><strong>Color scheme</strong></mark></td><td>Choose a color scheme.</td><td><a href="/eclipse/header/header/layout-and-style.md#choose-color-scheme">Layout and style</a></td></tr><tr><td><mark style="color:blue;"><strong>Layout</strong></mark></td><td>Rearrange the elements of the header.</td><td><a href="/eclipse/header/header/layout-and-style.md#choose-header-layout">Layout and style</a></td></tr><tr><td><mark style="color:blue;"><strong>Logo</strong></mark></td><td>Replace the store name with an image.</td><td><a href="/eclipse/header/header/logo.md">Logo</a></td></tr><tr><td><mark style="color:blue;"><strong>Transparent header</strong></mark></td><td>Make the header background transparent.</td><td><a href="/eclipse/header/header/transparent-header.md">Transparent header</a></td></tr><tr><td><mark style="color:blue;"><strong>Sticky header</strong></mark></td><td>Fix the header to the top of the screen.</td><td><a href="/eclipse/header/header/layout-and-style.md#enable-sticky-header">Layout and style</a></td></tr><tr><td><mark style="color:blue;"><strong>Cart icon</strong></mark></td><td>Change the icon for the cart.</td><td><a href="/eclipse/header/header/layout-and-style.md#change-cart-icon">Layout and style</a></td></tr></tbody></table>

## Show language and country selectors

***

<table data-card-size="large" 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><mark style="color:blue;"><strong>Language selector</strong></mark></td><td>Allow visitors to view your store in another language that you've added.</td><td><a href="/eclipse/header/header/language-and-currency.md#show-language-selector">Language and Currency</a></td></tr><tr><td><mark style="color:blue;"><strong>Country selector</strong></mark></td><td>Allow visitors to select their preferred region and currency.</td><td><a href="/eclipse/header/header/language-and-currency.md#show-country-selector">Language and Currency</a></td></tr></tbody></table>