# Header

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

The header is a content block at the upper part of your website that appears on every page. It usually contains the logo of a store, the main navigation menu, and other elements such as a search bar, shopping cart icon, etc.

The header plays a vital role in branding your site, helping visitors navigate, and displaying your most important pages.&#x20;

You can freely customize your header to suit your business needs by adding your logo image, choosing the main menu, and other addons using **Minimog** theme.

![Header section](/files/uJu5YGqrv5s3KfLQo11g)

<figure><img src="/files/SX65AqudlKxDPLIUfi25" alt=""><figcaption><p><a href="https://apps.shopify.com/xflow?utm_source=foxecom&#x26;utm_medium=help_center_minimog&#x26;utm_campaign=banner">Install XFlow Back In Stock Automation FREE</a></p></figcaption></figure>

## Logo settings

Add a logo in the header to grab visitors' attention and set the tone for your brand. The recommended image size and format is 200x80px .png with a transparent background.&#x20;

{% hint style="success" %}
Steps

1. In the theme editor **(Customize)**, click **Header**
2. Select image under **Logo**
3. **Save**
   {% endhint %}

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

To add SVG logos, kindly upload them in Shopify **Settings** > **Files** and get the URLs.&#x20;

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

Resize the logo image by increasing or decreasing the width on desktop/mobile or when it is sticky.

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

## Design settings

Change the position of the logo and menus based on your preferences.&#x20;

### **1. Logo and menu in 1 line**&#x20;

* Logo in center 1

![](/files/hglPzyYp0Yk7HuO89uX2)

* Logo in center (with 2nd menu)

![](/files/zuBQKUd8gyZuFZupWjS6)

* Logo left

![](/files/eRsmjXqDZC7DmbqLWowc)

### **2. Logo and menu in 2 lines**

* Logo center

![Logo left](/files/XdPD6hk8NSQUQCqTOrjG)

* Logo left

![](/files/TZMk4E2kI0mROaX6k6E5)

Minimog lets you enable a **sticky** header to keep the navigation visible on the scroll. It also enables the **transparent** effect on top of both desktop and mobile.

#### **1. Transparent header with sticky scrolling**

![](/files/LgEAL2CxgSBvI5GTGO60)

#### **2. No transparent header with sticky scrolling**

![](/files/WJZCheOkjtrtIU1VWuo2)

#### 3. Default scrolling

![](/files/HmuWoBmbtEw1D1w6S7Mj)

## Menu settings

This section lets you display your desired menus along with the logo. You can choose your desktop menu and mobile menu separately.<br>

<figure><img src="/files/9xOACmP1pjrQLSsestFI" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
To add, remove, or edit menus in your Shopify store, see [Editing menus](https://docs.minimog.co/getting-started/mega-menu#create-menu).
{% endhint %}

## Add-ons

Add-ons provide extra settings to the header such as search, currency selector, language selector, etc. by enabling the suitable checkboxes.&#x20;

For search, you can either show the full search box or only the search icon.

<figure><img src="/files/267q5hJJZMTwGQxj9BzI" alt="Enable addons your store header"><figcaption></figcaption></figure>

{% hint style="info" %}
Regarding the **currency selector** and **language selector**, you must configure them in Shopify admin for them to show on the front end.&#x20;
{% endhint %}

### How to add more languages to your Shopify store?

{% embed url="<https://youtu.be/BpgZCZW-3g4>" %}

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

1. From your Shopify admin, go to **Settings** > **Languages**.
2. In the Store languages settings, select **Add language**.
3. Choose a language from the drop-down menu, and hit **Next.**
4. Select an active market to add your language to.
5. In the **Unpublished languages**, click Publish beside the language that you want to make available to customers in your store.
6. Click **Save**.
   {% endhint %}

{% hint style="info" %}
If you want to add translations to your store content, then you need to import translations or use an app.
{% endhint %}

### How to add more currencies to your Shopify store?

{% embed url="<https://www.youtube.com/watch?v=RT83LJ-4dMs>" %}

Using multi-currencies to increase sales and expand your business into new markets.

To display a currency selector in your store, check out the following steps:

1. From your Shopify admin, go to **Settings.**
2. Navigate to **Markets** and click **Add market**.

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

3. Click **Add countries/ regions** and select the countries/regions you want.

<figure><img src="/files/3MxIbCCR1jkyalT43c0w" alt=""><figcaption></figcaption></figure>

4. Hit **Save** when you're finished.

{% hint style="info" %}
To sell in multiple currencies, you need to have [Shopify Payments](https://help.shopify.com/en/manual/payments/shopify-payments) enabled in your online store.
{% endhint %}


---

# 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/minimog-theme/pages-global-sections/header.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.
