> For the complete documentation index, see [llms.txt](https://meowcart.gitbook.io/lilyth-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://meowcart.gitbook.io/lilyth-theme/sections/header.md).

# Header

The header displays on all pages except checkout page in your theme.

The **Header** section contains the following default blocks:

* [Mega menu](#mega-menu)

## Section settings

<table><thead><tr><th width="217">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Separator line</td><td><p>Display a line to visually separate this section from the other sections:</p><ul><li><strong>None</strong></li><li><strong>Top</strong></li><li><strong>Bottom</strong></li><li><strong>Top and bottom</strong></li></ul></td></tr><tr><td>Desktop logo position</td><td><p>Where the logo displays in the header when a customer views the site on a large screen, such as a desktop:</p><ul><li><strong>Top left</strong></li><li><strong>Top center</strong></li><li><strong>Middle left</strong></li><li><strong>Middle center</strong></li></ul></td></tr><tr><td>Mobile logo position</td><td><p>Where the logo displays in the header when a customer views the site on a small screen, such as a mobile:</p><ul><li><strong>Center</strong></li><li><strong>Left</strong></li></ul></td></tr><tr><td>Sticky header</td><td>Redisplays the header when the customer scrolls back up. Disappears when the customer scrolls down.</td></tr><tr><td>Color schema</td><td>A set of colors that you can apply to this section. <a href="https://help.shopify.com/en/manual/online-store/themes/theme-structure/color-scheme">Learn more.</a></td></tr></tbody></table>

## Menu settings

<table><thead><tr><th width="217">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Menu</td><td>The menu to use for your <a href="https://help.shopify.com/en/manual/online-store/menus-and-links/editing-menus">main menu</a>.</td></tr><tr><td>Desktop menu type</td><td><p>Select the desktop menu type on the header:</p><ul><li><strong>Dropdown</strong></li><li><strong>Drawer</strong></li></ul><p>The mega menu is displayed on desktop only and requires the 'Dropdown' option is chosen in 'Desktop menu type' setting.</p><p>(<em>Menu type is automatically optimized for mobile</em>)</p></td></tr></tbody></table>

### Navigation level 1

<table><thead><tr><th width="217">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Text size</td><td><p>Changes the size of the text:</p><ul><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li></ul></td></tr><tr><td>Text style</td><td><p>Changes the style of the text:</p><ul><li><strong>Normal</strong></li><li><strong>Uppercase</strong>: put all characters in uppercase.</li><li><strong>Lowercase</strong>: put all characters in lowercase.</li></ul></td></tr><tr><td>Text thickness</td><td><p>Changes the thickness of the text:</p><ul><li><strong>Thin</strong></li><li><strong>Extra light</strong></li><li><strong>Light</strong></li><li><strong>Regular</strong></li><li><strong>Medium</strong></li><li><strong>Semi bold</strong></li><li><strong>Bold</strong></li><li><strong>Extra bold</strong></li><li><strong>Black</strong></li></ul><p>(<em>The thickness available depend on the font that is currently set</em>)</p></td></tr></tbody></table>

### Navigation level 2

<table><thead><tr><th width="217">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Text size</td><td><p>Changes the size of the text:</p><ul><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li></ul></td></tr><tr><td>Text style</td><td><p>Changes the style of the text:</p><ul><li><strong>Normal</strong></li><li><strong>Uppercase</strong>: put all characters in uppercase.</li><li><strong>Lowercase</strong>: put all characters in lowercase.</li></ul></td></tr><tr><td>Text thickness</td><td><p>Changes the thickness of the text:</p><ul><li><strong>Thin</strong></li><li><strong>Extra light</strong></li><li><strong>Light</strong></li><li><strong>Regular</strong></li><li><strong>Medium</strong></li><li><strong>Semi bold</strong></li><li><strong>Bold</strong></li><li><strong>Extra bold</strong></li><li><strong>Black</strong></li></ul><p>(<em>The thickness available depend on the font that is currently set</em>)</p></td></tr></tbody></table>

### Navigation level 3

<table><thead><tr><th width="217">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Text size</td><td><p>Changes the size of the text:</p><ul><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li></ul></td></tr><tr><td>Text style</td><td><p>Changes the style of the text:</p><ul><li><strong>Normal</strong></li><li><strong>Uppercase</strong>: put all characters in uppercase.</li><li><strong>Lowercase</strong>: put all characters in lowercase.</li></ul></td></tr><tr><td>Text thickness</td><td><p>Changes the thickness of the text:</p><ul><li><strong>Thin</strong></li><li><strong>Extra light</strong></li><li><strong>Light</strong></li><li><strong>Regular</strong></li><li><strong>Medium</strong></li><li><strong>Semi bold</strong></li><li><strong>Bold</strong></li><li><strong>Extra bold</strong></li><li><strong>Black</strong></li></ul><p>(<em>The thickness available depend on the font that is currently set</em>)</p></td></tr></tbody></table>

## Country/region selector settings

<table><thead><tr><th width="250">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Enable country/region selector</td><td>Add a selector where a customer can choose the countries and regions that you've enabled in your payment settings, so that customers can view your product prices in the currency of their choice.</td></tr></tbody></table>

## Language selector settings

<table><thead><tr><th width="217">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Enable language selector</td><td>Add a selector where a customer can choose the countries and regions that you've enabled in your language settings, so that customers can browse your store in the language of their choice.</td></tr></tbody></table>

## Section padding settings

<table><thead><tr><th width="208">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Top padding</td><td>Determine the height of the top inner space of the section. Can be from 0px to 40px, increasing arithmetically of 1px (pixel).</td></tr><tr><td>Bottom padding</td><td>Determine the height of the bottom inner space of the section. Can be from 0px to 40px, increasing arithmetically of 1px (pixel).</td></tr></tbody></table>

## Block settings

### Mega menu block

<table><thead><tr><th width="183">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Menu item</td><td>Here's to type the name of the menu item that you want it to contain the mega-menu. Please note that the name entered in Menu item must match the name of one of the first-level menu items.</td></tr></tbody></table>

#### Promotion banner settings

<table><thead><tr><th width="235">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Show promotion banner</td><td>Choose images that you want to display.</td></tr><tr><td>Collage layout</td><td><p>Change the layout of images:</p><ul><li><strong>Left large block</strong></li><li><strong>Right large block</strong></li></ul></td></tr><tr><td>Image border thickness</td><td>Set the width of an image's four borders. Can be from 0px to 10px, increasing arithmetically of 1 pixel.</td></tr><tr><td>Image border opacity</td><td>Set the opacity level for an image's four borders. Can be from 0% to 100%, increasing arithmetically of 5%. </td></tr><tr><td>Image corner radius</td><td>Set the radius of the image's corners. Can be from 0px to 40px, increasing arithmetically of 1 pixel. </td></tr></tbody></table>

#### Frist promotion banner settings

<table><thead><tr><th width="182">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Upload a image</td><td>Upload an image.</td></tr><tr><td>URL</td><td>Set the link of the image, for example the customer service page.</td></tr></tbody></table>

#### Second promotion banner settings

<table><thead><tr><th width="182">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Upload a image</td><td>Upload an image.</td></tr><tr><td>URL</td><td>Set the link of the image, for example the customer service page.</td></tr></tbody></table>

#### Third promotion banner settings

<table><thead><tr><th width="182">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Upload a image</td><td>Upload an image.</td></tr><tr><td>URL</td><td>Set the link of the image, for example the customer service page.</td></tr></tbody></table>
