# Custom content

![image](https://docs-assets.foxecom.app/megamog-theme/image_Y1lNXXu0.png)

For customers to have a better understanding of the store, you can utilize this **Custom content** section to achieve the requirements.

<Hint type="success">

Steps

1. In the theme editor (**Customize**), click **Add section**
2. Locate **Custom content**
3. **Save**

</Hint>

## Section settings

### 1. Section header

Use the provided fields to add a suitable heading/subheading/description. Leave any of them blank if you do not want to display them. You can also adjust the text alignment here as Left/Center.

![image](https://docs-assets.foxecom.app/megamog-theme/image_j1iri0fX.png)

Select the container type and the color style for this section.

![image](https://docs-assets.foxecom.app/megamog-theme/image_P1U7PLME.png)

### 2. Column gap settings

Change space and the gap between each column in desktop and mobile view.

![image](https://docs-assets.foxecom.app/megamog-theme/image_amRU1bQ6.png)

## Block settings

There are several blocks that can be added based on the requirements.

Some blocks are similar as they have appeared in theme sections such as countdown timer, product form (featured product), image cards, etc. Each of them will have its own settings.

![image](https://docs-assets.foxecom.app/megamog-theme/image_xQPHrfe6.png)

### Image and Text blocks

![image](https://docs-assets.foxecom.app/megamog-theme/image_oEQj0ZZA.png)

<Tabs>
<Tab title="Text block">

Use the provided text fields to add a suitable heading/subheading/description. Leave any of the fields blank if you do not want to display them. Control container width, text color/size, and alignment.

<div data-full-width="true">![image](https://docs-assets.foxecom.app/megamog-theme/image_Derm6qSP.png)</div>

![image](https://docs-assets.foxecom.app/megamog-theme/image_f1rzjZAA.png)

</Tab>

<Tab title="Image block">

In this block, you easily add images and change the width and the alignment of the container.

![image](https://docs-assets.foxecom.app/megamog-theme/Screenshot_1_YNFJirq3.png)

</Tab>
</Tabs>

### Lookbook items and Product bundles blocks

![](https://docs-assets.foxecom.app/megamog-theme/Screen%20Shot%202021-11-17%20at%2023.01.51_Rtyct2sK.png)

<Tabs>
<Tab title="Product bundles">

Use the provided text fields to add a suitable heading/subheading. Leave any of the fields blank if you do not want to display them. Control container width and add the products that you want to include in the bundles.

![image](https://docs-assets.foxecom.app/megamog-theme/image_A1GYLQQG.png)

</Tab>

<Tab title="Lookbook items">

For tagging products on the item image, you must add the chosen products. They can be easily adjusted by using the offset percentage.

![image](https://docs-assets.foxecom.app/megamog-theme/Screenshot_1_Wg6uFEXr.png)

</Tab>
</Tabs>

### Product and Product form blocks

![](https://docs-assets.foxecom.app/megamog-theme/Screen%20Shot%202021-11-18%20at%2020.25.51_xC6kBCsp.png)

<Tabs>
<Tab title="Product">

Add a product that merchants want to display for the block. Adjust the container width and alignment.

![image](https://docs-assets.foxecom.app/megamog-theme/image_3RjUtnpa.png)

</Tab>

<Tab title="Product form">

Add a product that merchants want to display for the block. Adjust the container width and alignment.

Enable/disable elements such as product price, vendor, cart button, etc.&#x20;

![image](https://docs-assets.foxecom.app/megamog-theme/image_kalkyJcM.png)

</Tab>
</Tabs>

### Article and Newsletter form blocks

![](https://docs-assets.foxecom.app/megamog-theme/Screen%20Shot%202021-11-18%20at%2020.33.58_AG8zZBML.png)

<Tabs>
<Tab title="Article">

Add an article that you want to display for the block. Adjust container width, alignment.

![image](https://docs-assets.foxecom.app/megamog-theme/image_XsBQkUW9.png)

</Tab>

<Tab title="Newsletter form">

Use the provided text fields to add a suitable heading/description as well as the email placeholder and button label. Leave any of them blank if you do not want to display them. Control form style and container width.

![image](https://docs-assets.foxecom.app/megamog-theme/image_30GKwNWU.png)

</Tab>
</Tabs>

### Video and Social profiles blocks

![](https://docs-assets.foxecom.app/megamog-theme/Screen%20Shot%202021-11-18%20at%2020.53.09_r8dCwVWz.png)

<Tabs>
<Tab title="Video block">

Add a Youtube video link and adjust its ratio. Video image cover can be left blank if yous want to use the video thumbnail.

Use the provided text field to add a suitable heading and change its color and size. Can leave it blank if merchants do not want to display it.

Modify the video button style, size, and video width. Additionally, the video can be played in loop and autoplay when customers visit the site.

![image](https://docs-assets.foxecom.app/megamog-theme/image_H5N0bnc6.png)

</Tab>

<Tab title="Social profiles">

Use the provided text fields to add a suitable heading/description. Leave any of the fields blank if you do not want to display them. Control the container width.

![image](https://docs-assets.foxecom.app/megamog-theme/image_xAZrsXj0.png)

</Tab>
</Tabs>

### Image card and Countdown timer blocks

![](https://docs-assets.foxecom.app/megamog-theme/Screen%20Shot%202021-11-18%20at%2020.58.07_9PZKcBpt.png)

<Tabs>
<Tab title="Image card">

Use the provided text fields to add a suitable heading/subheading/description. Leave any of the fields blanks if you do not want to display them.

Adjust the container width, content position, etc.

<div>![image](https://docs-assets.foxecom.app/megamog-theme/image_8wrQ6Nyp.png) ![image](https://docs-assets.foxecom.app/megamog-theme/1_NbvYYg7u.png)</div>

Add a call-to-action button to direct customers to the product detail page. Add a **Label** then choose a **Button style** and adjust the **Button size.**

![image](https://docs-assets.foxecom.app/megamog-theme/image_KyrJAiqw.png)

</Tab>

<Tab title="Countdown timer">

Adjust the container width, alignment, and end time of the timer.

![image](https://docs-assets.foxecom.app/megamog-theme/image_awCVJMTg.png)

Add a call-to-action button to direct customers to the product detail page. Add a **Label** then choose a **Button style** and adjust the **Button size.**

![image](https://docs-assets.foxecom.app/megamog-theme/image_dnywJoWu.png)

</Tab>
</Tabs>

### Custom HTML block

You can check the example below on how to display the HTML correctly.

![](https://docs-assets.foxecom.app/megamog-theme/image%20(2)_HOdn0toB.png)