# Mega menu

1. To show mega menu layouts, you need to [create multi-level dropdown](https://halosoft.gitbook.io/concept-documentation/header-group/header/dropdown-menu) menu first.
2. From your Shopify admin, go to **Online Store** -> **Themes**.
3. Find the theme that you want to edit, and then click **Customize**.
4. In the **Header** section on the left editor window -> Click **+ Add block**.
5. Select block type is "**Mega Menu**".

<table><thead><tr><th width="264">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Navigation item</td><td>Enter the name of the collection for which you want to apply the mega menu layout into the text box.</td></tr><tr><td>Section width</td><td><p>Select the section width from the dropdown menu:</p><ul><li><strong>Full width</strong></li><li><strong>Page width</strong></li><li><strong>Custom width</strong></li></ul></td></tr><tr><td>Customize width</td><td>Determines the width of the section when you choose the 'Custom width' option. It can range from <strong>1000px</strong> to <strong>1800px</strong>, increasing by <strong>50px</strong> increments</td></tr></tbody></table>

#### Promotional content

<table><thead><tr><th width="264">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Image</td><td>Set up an image</td></tr><tr><td>Heading</td><td>Add text to display as a block heading <br><em><mark style="color:red;">(Leave the field blank to hide the heading)</mark></em></td></tr><tr><td>URL</td><td>The link that you want customers to navigate to if they click the image</td></tr><tr><td>Image overlay opacity on hover</td><td>Determines the image overlay opacity of the block. Can be from 0% to 100%, in 10% arithmetic increments</td></tr><tr><td>Background</td><td>Set the background color for this block</td></tr></tbody></table>