> For the complete documentation index, see [llms.txt](https://vshop.gitbook.io/vshop/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://vshop.gitbook.io/vshop/header-group/header/block-header/block-multi-column.md).

# Block: Multi Column

Creates a mega menu layout with multiple columns, banners, and product links — ideal for stores with large product categories.

**General**

* **Custom width sub menu** – Set a custom width (in pixels) for the dropdown menu. Leave blank to make it full width.
* **Heading** – The title of the main menu item (e.g., *Shop*).

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2Fz5tDSfCMLQuSQmChAxXH%2Fimage.png?alt=media&amp;token=67442c1b-e7d9-429b-99e4-4d61aa21b35c" alt=""><figcaption></figcaption></figure>

**Add menu**

* **Add menu** – Choose a Shopify menu to display as subcategories.
* **Width col** – Set the number of columns for the sub-menu (e.g., *2*).

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2Fs57Yo2q3gvEpNCSkx9yj%2Fimage.png?alt=media&amp;token=5670dc35-8fa2-47c6-a6d9-fb8df46da27d" alt=""><figcaption></figcaption></figure>

***

**Config banner**

Add promotional banners to your mega menu.

* **Image ratio** – Select how images are displayed (*Custom ratio* recommended).
* **Custom ratio** – Define your own aspect ratio (e.g., *21:9*).
* **Button label** – Enter the banner button text (e.g., *Shop now*).
* **Button open in** – Choose to open in *Current tab* or *New tab*.
* **Button type** – Select button style (*Primary* or *Secondary*).

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2FjjlZZDEreeteORjxfZ7N%2Fimage.png?alt=media&amp;token=ea9674d5-565c-429a-b866-c31faa0a3b0e" alt=""><figcaption></figcaption></figure>

***

**Banner images**

* **Image 1**
  * Upload an image.
  * **Link banner 1** – Add a URL or page link (e.g., *Men*).
  * **Button label 1** – Text for the first banner button.
* **Image 2**
  * Upload an image.
  * **Link banner 2** – Add a URL or page link (e.g., *New Arrivals*).
  * **Button label 2** – Text for the second banner button.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2FJN9MDq4fOIXXKv7Pv8DY%2Fimage.png?alt=media&amp;token=28463415-8311-477b-bf8d-e7b694fc093d" alt=""><figcaption></figcaption></figure>

***

**Product list**

* **Product list** – Select a specific product collection to feature in the menu.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2FCASREAGn4Z2AUJBCbuD0%2Fimage.png?alt=media&amp;token=0659076e-ad76-4b3a-aa9b-751ac6038a26" alt=""><figcaption></figcaption></figure>

***

💡 **Tips:**

* Use high-quality images for banner sections to improve engagement.
* Keep menu columns balanced (avoid more than 4).
* Ideal for displaying top categories, sale products, or seasonal promotions.