> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/ella-documentation/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/ella-documentation/header/header-for-desktop/home-28-single-product.md).

# Home 28 - Single Product

<figure><img src="/files/1jz1mQU7EVBtBfNA4tJI" alt=""><figcaption></figcaption></figure>

{% embed url="<https://www.youtube.com/watch?v=9xjykbhDEkc>" %}

To setup Header Home 28 - Single Product, you need to add the **Header Nav - Hamburger Slide-In** section 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 - Hamburger Slide-In** section.

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

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

## Set up a scroll to row anchor (single page menu) on your site

1. From your Shopify admin, go to **Online Store** **->** **Navigation**.
2. Find the menu that you want to edit.

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

3. Select Menu Item and enter the Section ID name.

&#x20; For example: #features

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

4. Find the theme that you want to edit, and then click **Customize**.
5. Select Section and enter an ID name that matches the ID name you just entered for the Menu Item.

&#x20; For example: features

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

Note: <mark style="color:red;">If you include a link after #ID, clicking on the Menu will take you to the page where you attached the link and automatically scroll down to the corresponding section if one exists.</mark>

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

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

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

## Upload Settings For Header

<mark style="color:red;">To set up data for Header Home 28 - Single Product, please follow below instruction:</mark>

1. Click the [file to download](https://halosoft.gitbook.io/ella-documentation/footer/footer-layout/home-27-men-fashion-02#preset-for-header-home-27-men-fashion-02) 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/XCHW6zfg9rOC9zcElc6G" alt=""><figcaption></figcaption></figure>

## Preset for **Header** Home 28 - Single Product

<table><thead><tr><th>Home Page</th><th data-type="files">Json (with .json format)</th></tr></thead><tbody><tr><td><a href="https://new-ella-demo-11.myshopify.com//?fts=0&#x26;preview_theme_id=126090510387"><mark style="color:blue;">Home 28 - Single Product</mark></a></td><td><a href="/files/xUgsETY9UpwxBBvmvZLB">/files/xUgsETY9UpwxBBvmvZLB</a></td></tr></tbody></table>