> For the complete documentation index, see [llms.txt](https://staylime.com/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://staylime.com/docs/avante-themes/global-sections/header-and-navigation/mobile-header.md).

# Mobile Header

A separate header section designed specifically for mobile screens. Unlike many themes that simply shrink the desktop header, Avante gives you full control over the mobile navigation — its own logo, layout, and set of elements.

<figure><img src="/files/A6mAxktKuwSTIti8cmDb" alt=""><figcaption></figcaption></figure>

***

### How to find

**Theme Editor → Header group → Mobile Header**

Mobile Header is independent from the desktop [Header](/docs/avante-themes/global-sections/header-and-navigation/header.md). Changes to one do not affect the other.

***

### Logo

The Mobile Header has its own Logo block. By default it uses the same image as the desktop header, but you can set a different logo height to better fit the smaller screen.

You can also switch the logo to **text mode** — useful if your image logo doesn't scale well on mobile.

<figure><img src="/files/FNKSGcjehujE8SWLV8dj" alt=""><figcaption></figcaption></figure>

***

### Miscellaneous

Controls the icons and elements displayed in the mobile header bar — search, account, cart, and burger menu. The key setting worth noting:

**Reverse order** — flips the position of elements in the header. If your burger menu is on the left and cart on the right by default, enabling this swaps them. Handy for matching the layout conventions your audience expects.

<figure><img src="/files/vDVW2d0XzGAfFc9SH1ul" alt=""><figcaption></figcaption></figure>

***

### Buttons

You can add up to two custom buttons directly in the mobile header — for example, a "Call us" or "Book now" link. Each button supports an icon, label, link, and style (solid, outlined, or text link).

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

{% hint style="success" icon="sparkles" %}
**Tip:** On mobile, screen space is limited. Use a single button with an icon and no label for a clean look — for example, a phone icon linking to `tel:+1234567890`.
{% endhint %}

***

### Sticky header

Same options as the desktop header:

| Option           | Behavior                                     |
| ---------------- | -------------------------------------------- |
| Disabled         | Header scrolls away with the page            |
| On scroll to top | Header reappears when the visitor scrolls up |
| Always           | Header stays pinned at the top               |

**On scroll to top** is the recommended option for mobile — it keeps the header accessible without permanently taking up screen space.

<figure><img src="/files/6b1Qozj2aO15DnFckF2b" alt=""><figcaption></figcaption></figure>

***

#### Related

* [Header](/docs/avante-themes/global-sections/header-and-navigation/header.md) — desktop navigation bar
* [Menu Drawer](/docs/avante-themes/global-sections/header-and-navigation/menu-drawer.md) — slide-out mobile menu (opens from the burger icon)
* [Appearance settings](/docs/avante-themes/theme-settings/appearance.md) — navigation layout options


---

# 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, and the optional `goal` query parameter:

```
GET https://staylime.com/docs/avante-themes/global-sections/header-and-navigation/mobile-header.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.