# Mobile navigation bar 

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

The Mobile navigation bar section is a fixed navigation menu that remains visible at the bottom of the mobile screen as the users scroll up/down.&#x20;

A navigation bar helps your users navigate through your website with ease on limited mobile screens. It is different from the sticky header that appears on the top.

In this article, we will show you how to set up a Mobile navigation bar section.

{% hint style="info" %}
The **Mobile navigation bar** feature is available on :sparkles: **Sleek version 1.4.0 and above** :sparkles:&#x20;

See [Changelog](https://help.foxecom.com/changelog/sleek#version-1.4.0).
{% endhint %}

## How to access the Mobile navigation bar section settings

{% hint style="success" %}
**Steps**:

1. In the theme editor **(Customize)**, click **Mobile navigation bar**.
2. Edit the settings.
3. **Save** the settings.
   {% endhint %}

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

## How to edit the Mobile navigation bar section

### Section settings

Check the **Enable mobile sticky bar** box to show the sticky navigation bar on mobile to let customers shopping easier by ensuring it remains visible as users scroll through the page.

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

The **Show button label** is checked, making the label text (like "Home" or "Cart") visible below each icon for better clarity.

<div><figure><img src="/files/fsxHQXwqQukOD7ZE73V8" alt=""><figcaption></figcaption></figure> <figure><img src="/files/2CQcgILO2XUxAF36eguN" alt=""><figcaption></figcaption></figure></div>

<div><figure><img src="/files/n1XU2NVHGXKr9ZTHQpRP" alt=""><figcaption></figcaption></figure> <figure><img src="/files/STBkZa9H4tM6bdIr56Le" alt=""><figcaption></figcaption></figure></div>

### Block settings

This section has 4 pre-built blocks: **Home**, **Products**, **Search**, and **Cart** (each can only be added once).&#x20;

You can add a maximum of 6 blocks, including 2 **Custom link** blocks.

Moreover, you have the flexibility to show or hide individual blocks based on your store's specific objectives.

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

* **Home**: Get back to the home page (You can change the label text for this block).

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

* **Search**: Open the search drawer and let customers search for products (You can change the label text for this block).

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

* **Cart**: Open the cart drawer and let customers check the items they have added or check out (You can change the label text for this block).

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

* **Products**: Redirect customers to the specific collection page (You can change the label text for this block).

{% hint style="info" %}
If there is no collection selected, the button will be linked to "All" collection.
{% endhint %}

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

* **Custom link**: Redirect customers to an attached link page as desired.

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

In the custom link block, you can edit three elements:

1. **Title:** Fill in the title of the section you want to add to the mobile navigation menu (this will be shown as the button label).
2. **Link:** Paste a link or choose the section you want to add to the mobile navigation menu.
3. **Icon:** Choose your favorite icon.

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

<figure><img src="/files/vh4MElTuwzy6TYDBjnrd" alt=""><figcaption><p><a href="https://foxecom.com/products/foxify-shopify-app?utm_source=HelpCenter&#x26;utm_medium=banner&#x26;utm_campaign=customer+success">Try Foxify free now</a></p></figcaption></figure>


---

# 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://docs.foxecom.com/sleek-theme/pages-global-sections/mobile-navigation-bar.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.