# Header section

In the Header group, click on the Header section to reveal the section settings.

<figure><img src="/files/2JP4Kaczdf7st87SIttd" alt=""><figcaption></figcaption></figure>

These settings will allow you to change the style of your header section. You can add logos, choose a navigation menu, toggle menu images, and control the search bar.

<table><thead><tr><th width="226.65625">Settings</th><th width="146.388916015625" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Enable sticky header</td><td align="center"><code>checkbox</code></td><td>Makes the header fixed at the top of the screen while scrolling.</td></tr><tr><td>Link hover effect</td><td align="center"><code>select</code></td><td>Choose a hover style for navigation links. Options: <code>Line</code> or <code>Dot</code>.</td></tr><tr><td>Show bottom border</td><td align="center"><code>checkbox</code></td><td>Adds a bottom border to the header.</td></tr><tr><td>Border color</td><td align="center"><code>color</code></td><td>Sets the color of the header’s bottom border (not applied to transparent headers).</td></tr><tr><td>Border opacity</td><td align="center"><code>range</code></td><td>Controls the transparency of the border.</td></tr><tr><td><strong>Logo</strong></td><td align="center"></td><td></td></tr><tr><td>Image</td><td align="center"><code>image_picker</code></td><td>Logo used on scroll and on pages other than the homepage.</td></tr><tr><td>Width</td><td align="center"><code>range</code></td><td>Sets the maximum width of the logo image.</td></tr><tr><td><strong>Navigation</strong></td><td align="center"></td><td></td></tr><tr><td>Main menu</td><td align="center"><code>link_list</code></td><td>Select the primary navigation menu.</td></tr><tr><td>Secondary menu</td><td align="center"><code>link_list</code></td><td>Optional secondary menu (limited to 4 items).</td></tr><tr><td>Show mega menu images</td><td align="center"><code>checkbox</code></td><td>Displays preview images in mega menu for collection/product links.</td></tr><tr><td>Image scaling ratio</td><td align="center"><code>range</code></td><td>Controls the aspect ratio for mega menu images (wide to tall).</td></tr><tr><td>Alignment</td><td align="center"><code>select</code></td><td>Layout of logo, links, and icons. Options: <code>Links | Logo | Icons</code>, <code>Logo | Links(center) | Icons</code>, <code>Logo | Links(right) | Icons</code>.</td></tr><tr><td>Show icons as text</td><td align="center"><code>checkbox</code></td><td>Converts header icons (cart, search) into text links.</td></tr><tr><td><strong>Language selector</strong></td><td align="center"></td><td></td></tr><tr><td>Show language selector</td><td align="center"><code>checkbox</code></td><td>Displays a dropdown to choose store languages.</td></tr><tr><td>Show language code only</td><td align="center"><code>checkbox</code></td><td>If enabled, shows language codes (e.g., 'EN') instead of full names.</td></tr><tr><td><strong>Country/Region selector</strong></td><td align="center"></td><td></td></tr><tr><td>Show country selector</td><td align="center"><code>checkbox</code></td><td>Displays a dropdown to choose countries/regions.</td></tr><tr><td>Show country name</td><td align="center"><code>checkbox</code></td><td>Shows full country names in the selector.</td></tr><tr><td>Show country flag</td><td align="center"><code>checkbox</code></td><td>Displays flags next to country names.</td></tr><tr><td><strong>Highlight link</strong></td><td align="center"></td><td></td></tr><tr><td>Menu item</td><td align="center"><code>text</code></td><td>Name of the menu item you want to highlight (e.g., 'Sale').</td></tr><tr><td>Enable custom badge</td><td align="center"><code>checkbox</code></td><td>Adds a visual badge next to the highlighted menu item.</td></tr><tr><td>Custom badge text</td><td align="center"><code>text</code></td><td>Sets the label inside the badge (e.g., '10% OFF').</td></tr><tr><td>Color</td><td align="center"><code>color</code></td><td>Sets the color of the highlighted menu item or badge.</td></tr><tr><td>Badge text color</td><td align="center"><code>color</code></td><td>Select color applies when the custom badge is enabled.</td></tr><tr><td><strong>Transparent header</strong></td><td align="center"></td><td></td></tr><tr><td>Enable transparent header</td><td align="center"><code>checkbox</code></td><td>Allows header background to be transparent. Useful for hero images.</td></tr><tr><td>Logo</td><td align="center"><code>image_picker</code></td><td>Logo shown on home/collection pages when transparent header is active.</td></tr><tr><td>Increase text transparency</td><td align="center"><code>checkbox</code></td><td>Adds a gradient for better text visibility in transparent header.</td></tr></tbody></table>


---

# Agent Instructions: 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://palo-alto.presidiocreative.com/header/header/header-section.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.
