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

# Available Blocks

The elements you can place inside the mobile header. Add a block to the **Header Top** row and pick its column with the **Position** setting, or add a block to the **Header Bottom** row.

***

## Position

Most top-row blocks share one setting: **Position**. It sets which column of the row the block sits in. See [Header Structure](/helix/header-group/mobile-header/header-structure.md).

***

## Quick Reference

| Block                               | Purpose                                       |
| ----------------------------------- | --------------------------------------------- |
| [Menu toggle](#menu-toggle)         | Opens the mobile navigation drawer            |
| [Logo](#logo)                       | Your store logo                               |
| [Search](#search)                   | Opens the search drawer                       |
| [Cart](#cart)                       | Opens the cart drawer                         |
| [Account](#account)                 | Customer account access                       |
| [Recently Viewed](#recently-viewed) | Opens the browsing history drawer             |
| [Quick Links](#quick-links)         | Inline shortcut links — Bottom row only       |
| [Search Bar](#search-bar)           | Always-visible search input — Bottom row only |

***

## Menu toggle

The hamburger button that opens the mobile navigation drawer. Its only setting is **Position**.

{% hint style="info" %}
The drawer's contents are set in the separate **Mobile menu** section, not on this block.
{% endhint %}

***

## Logo

Your store logo. **Width** is set per block. In transparent header mode, Helix uses the transparent logo from [Logo and Favicon](/helix/theme-settings/logo-and-favicon.md).

***

## Search

Opens the search drawer. Shown as an icon on mobile. Icon size follows the section setting in [Header Styling](/helix/header-group/mobile-header/header-styling.md).

***

## Cart

Opens the cart drawer. Shown as an icon on mobile, with a live item-count badge when the cart has items. Use **Badge type** to set the badge style.

***

## Account

Opens the account panel as a bottom sheet — sign-in for guests, or the customer's account and menu once they are signed in. Shown as an icon on mobile, replaced by the customer's avatar once they sign in.

{% hint style="info" %}
The menu inside the panel is set in [**Theme Settings → Customer account**](/helix/theme-settings/customer-account.md). The block only shows when customer accounts are turned on in **Shopify admin → Settings → Customer accounts**.
{% endhint %}

***

## Recently Viewed

Opens the recently viewed drawer. Shown as an icon on mobile.

**Setup:**

1. Set the **Page link** — the URL of your recently viewed page.

{% hint style="info" %}
For setup instructions, see [How to set up a recently viewed page](/helix/how-to-guides/how-to-set-up-a-recently-viewed-page.md).
{% endhint %}

***

## Quick Links

A row of inline text links for the **Header Bottom** row, used as a secondary strip below the main icon bar.

**Setup:**

1. Select a **Menu** — the navigation menu to show as links.
2. Set **Gap** — the spacing between links.
3. Adjust the typography — **Font**, **Font size**, **Letter spacing**, **Text case**, and **Color**.
4. Optionally highlight one link:
   * **Menu item name** — the exact label of the link to stand out.
   * **Color** — the highlight color for that link.

***

## Search Bar

An always-visible search input for the **Header Bottom** row. Customers can type right away without tapping a search icon first.

**Setup:**

1. Set **Height** — match the header or use a fixed size.
