> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/halo-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://halosoft.gitbook.io/halo-docs/header/header-for-desktop/home-01-fashion-01.md).

# Home 01 – Fashion 01

<figure><img src="/files/T4Q3xFC2lsMeRwUAhLER" alt=""><figcaption><p><a href="https://demo-default.myshopify.com/?_ab=0&#x26;_fd=0&#x26;_sc=1&#x26;preview_theme_id=120419549320"><mark style="color:red;"><strong>Home 01 – Fashion 01</strong></mark></a></p></figcaption></figure>

To setup Header <mark style="color:red;">**Home 01 – Fashion 01**</mark>, you need to add the **Header Nav – Multi-Site** sections to the **HEADER GROUP**.

1. From your Shopify admin, go to **Online Store** **->** **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. At the **HEADER GROUP ->** click **+** **Add section**.
4. Search and select **Header Nav – Multi-Site** section.

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

## **Upload Settings For Header**

<mark style="color:red;">To set up data for Header Home 01 – Fashion 01, please follow below instruction:</mark>

1. Click the [file to download](https://halosoft.gitbook.io/halo-docs/header/header-for-desktop/home-01-fashion-01#preset-for-header-home-01-fashion-01) the corresponding *"`json`"* of the layout you want to open the data on a new tab.
2. **SELECT ALL** and **COPY.**
3. From your Shopify admin, go to **Themes** **->** **Actions** **->** **Edit Code.**
4. Find folder **Sections** **->** Open file **header-group.json** **->** **SELECT ALL** and **DELETE** then **PASTE** the copied preset from the external file.

<figure><img src="/files/7XcytY2Dt5nl1q2CVKDM" alt=""><figcaption></figcaption></figure>

## Preset for **Header** Home 01 – Fashion 01

<table><thead><tr><th width="464">Home Page</th><th data-type="files">Json (with .json format)</th></tr></thead><tbody><tr><td><a href="https://demo-default.myshopify.com/?_ab=0&#x26;_fd=0&#x26;_sc=1&#x26;preview_theme_id=120419549320">Home 01 - Fashion 01</a></td><td><a href="/files/tiL9CtJiNHoSL7Q5O1aZ">/files/tiL9CtJiNHoSL7Q5O1aZ</a></td></tr></tbody></table>

## Menu Tab

{% hint style="info" %}
You can show menu tabs: Women, Men, Beauty like on theme demo by using **Menu Tab**.
{% endhint %}

![](/files/EzuIESPWVl41NntTGTiE)

Each tab will have settings for Logo, Texts, Link. For the link, you will create [Landing pages](/halo-docs/page/landing-page.md) with below instructions and add link for the corresponding tabs.

![](/files/RQLFeM75sspiDSlVN7lv)

{% hint style="info" %}
The first tab "Women" is Homepage, you don't need to choose link for this tab, the other tabs are [Landing pages](/halo-docs/page/landing-page.md) and will link to the page you created.

With this header, there are 2 steps to set up:

* Create Landing page
* Set up different menu for each Landing Page
  {% endhint %}

## How to set up different navigation/menu for tabs?

1. From your Shopify admin, go to **Navigation.**
2. Click **Add menu** to create a menu you want to use for menu tab.
3. Go to the landing page you created to activate menu.

![](/files/Gl66NiRXcToABNhsr9jO)

![](/files/xDXh8WklklpL2qcHJbpW)

![](/files/bKOYGzR6CK9sx479m3rY)

{% hint style="info" %}
URL and Handle of Landing pages must be the same as the handle that you created in the navigation above.
{% endhint %}

![](/files/ezKvShIETa3mIXsYH0Zf)

## How to setup announcement bar for Home 01 - Fashion 01?

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

1. From your Shopify admin, go to **Online Store** -> **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Click **Add section** and choose "**Announcement Bar**".

```
<span class="text">HALO SALE 2023</span>
<span class="text">25,000 PRODUCTS</span>
<span class="text">ENDS 30/3</span>
<span class="text-code">MAX 90% OFF</span>
```
