# Add custom cards to mega menu

<figure><img src="https://1836495117-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOdebKCa6IK9qfbdvSKj0%2Fuploads%2FDa70TFtxZFiRDa371Hjq%2FFox-BG%20Light%20(13).jpg?alt=media&#x26;token=83afad91-f087-426e-9bab-fc80e3f521a3" alt=""><figcaption></figcaption></figure>

{% embed url="<https://youtu.be/vH1Saf0X_TA>" %}

Make your mega menu more engaging with fully customizable content cards. Use this block to feature seasonal promotions, highlight collections, or create visually rich navigation that goes beyond links.

## How to add Custom cards to the mega menu&#x20;

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

1. In the **Header** section, click **Add block**.
2. Select **Custom cards (Mega menu)**.
3. In the **Menu title** field, type the **exact name** of the menu item this block should appear under.
4. Add images, text, links, and styling for each card.
5. Customize layout, width, and color scheme.
6. Save your changes.
   {% endhint %}

### ⚙️ Block settings

<table><thead><tr><th width="240">Setting</th><th>What it does</th><th data-hidden></th></tr></thead><tbody><tr><td>Menu title</td><td>Determines which main menu item this banner belongs to. It must exactly match the menu title.</td><td></td></tr><tr><td>Container</td><td>Inherit from header or apply independent layout rules.</td><td></td></tr><tr><td>Desktop menu columns</td><td>Set how many columns are shown in the dropdown layout.</td><td></td></tr><tr><td>Width (%)</td><td>Adjust the horizontal space the card section takes in the mega menu.</td><td></td></tr><tr><td>Color scheme</td><td>Choose the background + text color theme for the card</td><td></td></tr><tr><td>Image</td><td>Upload an image that appears on the card.</td><td></td></tr><tr><td>Card content</td><td>To each image, add text content and a button.</td><td></td></tr></tbody></table>

<figure><img src="https://1836495117-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOdebKCa6IK9qfbdvSKj0%2Fuploads%2FIsiOSXwYwFlawk92DFE5%2Fimage.png?alt=media&#x26;token=253c978e-bbe7-49b9-a82d-0840a8f532f4" alt=""><figcaption></figcaption></figure>

### 💡 Pro tips

* This block is perfect for mixing **image + copy + CTA** inside your dropdown.
* You can add **up to 6 custom cards** in one block for a grid-like layout.

> ✅ Want to show multiple products or collections instead? Try **Products list** or **Collections list** blocks.

{% content-ref url="add-products-to-mega-menu" %}
[add-products-to-mega-menu](https://docs.foxecom.com/zest-theme/pages-global-sections/menu/add-products-to-mega-menu)
{% endcontent-ref %}

{% content-ref url="add-collections-to-mega-menu" %}
[add-collections-to-mega-menu](https://docs.foxecom.com/zest-theme/pages-global-sections/menu/add-collections-to-mega-menu)
{% endcontent-ref %}