> For the complete documentation index, see [llms.txt](https://foxecom.gitbook.io/minimog-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://foxecom.gitbook.io/minimog-theme/pages-global-sections/footer.md).

# Footer

<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>

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

![](/files/nbl8a4mmZwmWKSmEBtoX)

## What is Footer? <a href="#what-is-footer" id="what-is-footer"></a>

The footer is the section of content at the bottom of a web page. The footer menu typically contains quick links to your homepage, about us page, blogs page, contact page, policy page, etc.&#x20;

A great website footer will help visitors navigate your site, leading to a greater eCommerce experience.

## How to add the Footer section to your Shopify store

You can freely customize the footer section to suit your business needs, such as adding a footer menu, a newsletter, and other blocks.

{% hint style="success" %}
Steps

1. In the theme editor **(Customize)**, click **Footer**
2. Locate and add suitable blocks
3. **Save**
   {% endhint %}

## How to edit the Footer section

### Section settings

#### General

Select the **Color scheme** for the section.&#x20;

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

{% hint style="info" %}
Set up your Color schemes anytime in the Theme settings > [Colors](/minimog-theme/theme-settings/colors-and-color-schemes.md).
{% endhint %}

Set the **Layout** for your footer:

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

{% tabs %}
{% tab title="Layout 1" %}

<figure><img src="/files/dqwQn3L4NqUxKbPrvm0G" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Layout 2" %}

<figure><img src="/files/T2Y4GCHrGrDLgqo2MQuw" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Layout 3" %}

<figure><img src="/files/tIaxBN1EbNXk1HpOlmSX" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

You can choose your **Container type** for the collection list as:

* Default
* Full width
* Use container box

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

Enable or disable **Block bordered** to add borders around footer blocks.

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

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

Enter your **Copyright text**. *Example: © MINIMOG \[year]*

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

{% hint style="info" %}
A copyright notice informs the public that the work is protected by copyright. To know more about copyright, see [Copyright](https://help.shopify.com/en/manual/your-account/copyright-and-trademark#about-copyright).

**Note**: The `[year]` variable automatically displays the current year.
{% endhint %}

#### Addons

Similar to the header section, this element provides extra information for the footer such as social media icons, language selector, etc. by ticking/unticking the corresponding checkboxes.

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

* **Social media icons**: To display icons for any social media platforms that you've entered a profile link for in your Theme settings > [Store contact](/minimog-theme/theme-settings/store-contact.md).
* **Country/region selector**: Display a country selector for stores using Shopify Markets.
* **Currency selector**: Allow customers to switch currencies. [Watch tutorial](https://foxecom.link/TsDtIw)
* **Language selector**: Allow customers to switch languages. [Watch tutorial](https://foxecom.link/eBEvt2)

#### Follow on Shop&#xD;

Follow on Shop allows customers to follow your store on the [Shop app](https://help.shopify.com/en/manual/online-sales-channels/shop).&#x20;

Customers who follow your store can receive personalized recommendations and notifications about your products, creating a more personalized shopping experience for your customers.

Follow on Shop button is available on **Minimog version 3.5.0 and above** (see [Changelog](https://help.foxecom.com/changelog/minimog?utm_source=foxecom\&utm_medium=help_center_minimog_footer\&utm_campaign=anchor_text\&utm_term=changelog#version-3.5.0)).

<figure><img src="/files/8zarLNRY31yfMe7Bh36n" alt=""><figcaption></figcaption></figure>

To enable the Follow on Shop button, you must have the [Shop channel](https://help.shopify.com/en/manual/online-sales-channels/shop/setup) installed, and [Shop Pay activated](https://help.shopify.com/en/manual/payments/shop-pay#activate-shop-pay) on your store.

#### Payment methods

Providing various purchasing methods makes checkout easier for your customers and enhances your brand perception.

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

Enable **Show payment icons** to display accepted payment methods.

<figure><img src="/files/0O9Cd81n1dAdhn8URRab" alt=""><figcaption></figcaption></figure>

You can also upload a custom **Payment icons by image** instead of using Shopify payment icons.

Adjust the **Image width (px)** to control the display size of the payment image.

{% hint style="info" %}
The payment methods here reflect the settings configured in [Payments](https://help.shopify.com/en/manual/payments?ref=out-of-the-sandbox). **Only payment options accepted through** **Shopify Payments** will automatically display their icons when enabled.

[Read How to Show Payment icons on the Footer](/minimog-theme/faqs/generic/show-payment-icons-on-the-footer.md)
{% endhint %}

#### Footer bottom

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

Select the **Color scheme** for the footer bottom area.

Choose a **Menu** to display at the bottom of the footer.

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

Enable **Show menu item divider** to display separators between footer menu items.

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

### Block settings

The Footer section supports the following block types (You can add up to 5 blocks):

* [Menu](#menu)
* [Newsletter](#newsletter)
* [Spacing](#spacing)
* [About](#about)
* [Custom content](#custom-content)
* [Custom HTML](#custom-html)

You can combine multiple block types to build a flexible footer layout.

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

#### Common block settings

The following settings are available for most Footer blocks.

**Container width**

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

Adjust the width occupied by the block within the footer layout.

This helps balance spacing and alignment between footer columns.

**Mobile settings**

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

* **Order first**: Display the block before other footer blocks on mobile devices.
* **Enable accordion**: Collapse the block into an accordion on mobile devices to save space and improve usability.
* **Open by default**: Keep the accordion expanded when the page loads.

#### Menu

The Menu block displays navigation links inside the footer.

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

{% hint style="info" %}

* Display the existing menu you created in **Shopify admin** > **Content** > **Menus.** To create menus, see [Menu](https://docs.minimog.co/getting-started/mega-menu#create-menu).
* Only the **1st-level** menu items are displayed.
  {% endhint %}

Select the **Footer menu** you want to display.

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

Enter a custom **Heading** or leave it blank to automatically use the selected menu title.

Choose the **Heading size**:

* Heading xs
* Heading sm
* Heading md
* Heading lg
* Heading xl
* Heading 2xl

Choose the **Heading font**:

* Heading font
* Body font

Select the **Heading font weight**.

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

#### About

The About block helps customers learn more about your business.

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

**Content settings**

Enter a **Title** for the block.

Choose the **Heading size**:

* Heading xs
* Heading sm
* Heading md
* Heading lg
* Heading xl
* Heading 2xl

Choose the **Heading font**:

* Heading font
* Body font

Select the **Heading font weight**.

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

Add content using the **Description** rich text editor. This area can be used to describe your business, share your story, or provide helpful information for customers.

Choose the description **Text size**:

* Small
* Base size
* Large
* Extra large
* Default

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

**Contact information**

Enable or disable the following options:

* **Show email**: Display your store email address.
* **Show phone number**: Display your store phone number.
* **Show social icons**: Display social media icons configured in your store contact settings.

<figure><img src="/files/4SnMtPu8hcWE8UJcSXw3" alt=""><figcaption></figcaption></figure>

This makes it easy for customers to connect with your brand across different platforms.

{% hint style="info" %}
To add or update store contact information, go to **Theme settings** > [Store contact](/minimog-theme/theme-settings/store-contact.md).
{% endhint %}

#### Newsletter

The Newsletter block helps you collect email subscribers directly from the footer, making it easier to grow your audience and stay connected with customers.

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

Enter a **Title** and optional **Description** to encourage visitors to subscribe.

Choose the **Heading size**:

* Heading xs
* Heading sm
* Heading md
* Heading lg
* Heading xl
* Heading 2xl

Choose the **Heading font**:

* Heading font
* Body font

Select the **Heading font weight**.

Customize the **Email placeholder** text displayed inside the email input field.

<div><figure><img src="/files/4VIQMax54XioAYADmCDI" alt=""><figcaption></figcaption></figure> <figure><img src="/files/1JjUvY9M9Gv58QXmhq01" alt=""><figcaption></figcaption></figure></div>

Enable **Show icon input** to display an email icon inside the input field.

<div><figure><img src="/files/PZrz1Vr6nAgSejDE20gv" alt=""><figcaption></figcaption></figure> <figure><img src="/files/pNP3B5pLIkos17597aQT" alt=""><figcaption></figcaption></figure></div>

Customize the **Button label**. Leave the button label blank to display an icon-only submit button.

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

{% tabs %}
{% tab title="Button with label" %}

<figure><img src="/files/D2TdNtsAxvQjkfZJJiDM" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Button without label" %}

<figure><img src="/files/2yCy2KaXZ0KYZWIskXZr" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

**Button position**: Choose where the subscribe button appears:

* Same line input field
* Under input field

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

{% tabs %}
{% tab title="Same line input field" %}

<figure><img src="/files/zscG6wlg50Ej4LqsVSKw" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Under input field" %}

<figure><img src="/files/bcj5xaaze0M85dcQ4u5J" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

{% hint style="info" %}
Button position option only works with bordered form style.
{% endhint %}

Choose the **Button style** of the subscribe button:

* Primary button
* Secondary button
* Plain button

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

**Form style**: Choose the newsletter form appearance:

* Bordered
* Minimal

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

{% tabs %}
{% tab title="Bordered style" %}

<figure><img src="/files/ir7yz9z12Mb3Tbof5XZu" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Minimal style" %}

<figure><img src="/files/byrwmDBJRPNmVFrmoVgt" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

**Show social link**: Enable this option to display your store's social media icons below the newsletter form.

<div><figure><img src="/files/lD7dQEjOY3QMuYvumNIV" alt=""><figcaption></figcaption></figure> <figure><img src="/files/a7b9CtSpbeleLpOQFFW6" alt=""><figcaption></figcaption></figure></div>

{% hint style="info" %}
Social media links are managed in: **Theme settings** > [Store contact](/minimog-theme/theme-settings/store-contact.md).
{% endhint %}

**Show "Terms & conditions" checkbox**: Enable this option to require customers to accept your terms and conditions before subscribing.

<div><figure><img src="/files/MPpXTy6yQlXYNZL2BvEW" alt=""><figcaption></figcaption></figure> <figure><img src="/files/yPAk2czJBaBNrWfqbKk7" alt=""><figcaption></figcaption></figure></div>

{% hint style="info" %}
"Terms & conditions" checkbox are managed in: **Theme settings** > [GDPR settings](/minimog-theme/theme-settings/gdpr-settings.md).
{% endhint %}

#### Custom content

The Custom content block allows you to display additional content alongside other footer blocks.

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

**Image settings**

Upload an **Image** for the content block.

Adjust the **Image max-width (px)** to control the display size of the image.

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

**Content settings**

Enter a **Title**.

Choose the **Heading size**:

* Heading xs
* Heading sm
* Heading md
* Heading lg
* Heading xl
* Heading 2xl

Choose the **Heading font**:

* Heading font
* Body font

Select the **Heading font weight**.

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

Add **Content** using the rich text editor and choose the suitable **Text size**:

* Small
* Base size
* Large
* Extra large
* Default

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

#### Spacing

The Spacing block adds empty space between footer columns.

<figure><img src="/files/604ujjtIFyX3mNDZLoN3" alt=""><figcaption></figcaption></figure>

**Container width**: Adjust the amount of spacing added between neighboring blocks.

Larger values create wider gaps between footer columns and help distribute content more evenly across the footer.

#### Custom HTML

The Custom HTML block allows you to add custom code and third-party integrations directly inside the footer.

Enter a **Title**.

Choose the **Heading size**:

* Heading xs
* Heading sm
* Heading md
* Heading lg
* Heading xl
* Heading 2xl

Choose the **Heading font**:

* Heading font
* Body font

Select the **Heading font weight**.

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

Add your custom code inside the **HTML** field.

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

{% hint style="info" %}
Liquid code is supported.
{% endhint %}
