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

# Collection banner builder

{% hint style="info" %}
**Add section -> Collection banner builder**
{% endhint %}

{% hint style="warning" %}
**IMPORTANT!** This section required saving changes by pressing the “Save” button in order to view customizations on a collection page.
{% endhint %}

 This content can be added several times and in different content blocks: “Promo box (banner)”, and “Custom HTML”. 

## Banner Builder

 In this section, you can configure the general settings regarding the banner displayed on the collection page. These settings can be applied to each collection. The **“Section type”** allows decide if to display a banner in the product grid or to replace products with sub-collections:

{% tabs %}
{% tab title="Replace products grid" %}
![](/files/O0ORoTNTsWBsTE9CCZla)
{% endtab %}

{% tab title="Insert to product grid" %}
![](/files/vY2Ov8Hlp1ERBRMGLIYO)
{% endtab %}
{% endtabs %}

### **“**Insert to product grid**”** settings

 These settings will be applied only for version **“Insert to product grid”**. In this block, you can decide if to display banners on different grids of products in a row: 1 in a row, 2 in a row, 3 in a row, 4 in a row, 6 in a row, or list:

![](/files/3fzDDENRLfMDlgOfC1O5)

### Column Settings

 In the **“Size of the columns”**, you can choose how many items should be displayed in one row by choosing the proper option from the dropdown list. The option **“Size of the columns on mobile”** allows you to set the number of items in the row on mobile: “1 item in the row” or “2 items in the row”. In the dropdown list of **“Margins for the columns”**, you can choose the type of margins for the columns.