> For the complete documentation index, see [llms.txt](https://docs.jollyany.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.jollyany.co/templates/express/mega-menu.md).

# Mega Menu

You can add modules or sub-menus to each mega menu section of each menu item. 

### 1. Create a module

* Please go to **System > Manage > Site Module > Add New**
* Module type: **SP Page Builder or others**
* Create a new section and add the Jollyany addon **"UK Articles"**
* Configure UI Articles add-on, you're supposed to choose a resource (Joomla articles), choose a category and set the limit option (the number of articles you want to display)

![Create a module for mega menu](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2F9au378fexlWnzwMOOWA3%2Fmodule-travel-latest-posts.jpg?alt=media\&token=697f6fea-59c4-4ae3-8138-1ff61b345aa1)

### 2. Set up a mega menu

Go to Admin > Menus > Main Menu > Edit a menu item > Navigate to **the tab "Astroid Menu Options"**

* Enable Mega Menu
* Set width: 980px
* Drop-down: Container

In the mega menu options, click to add a new row > Select a grid layout > Select a module

If there are sub-menus under the parent menu items, you can also drag them to the mega menu easily. 

{% tabs %}
{% tab title="Enable Mega Menu" %}
![Enable Mega Menu](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2F69K1gZRUEwGb28teBtpB%2Ftravel-menu2.jpg?alt=media\&token=c0d2ed2d-6a68-4227-bc0c-809696d792fd)
{% endtab %}

{% tab title="Select a module" %}
![Choose a layout for the mega menu](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2FNeGfBNvbcFwvvUNOXKyo%2Flifestyle-menu3.jpg?alt=media\&token=9b2a84a8-1a89-4916-b311-1470cc6ae8e9) ![Select a module](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2FA0H4RTqb8ZvAhw94dbVA%2Ftravel-menu3.jpg?alt=media\&token=d4cdf765-1e96-4394-9854-a61ca3e4291f)
{% endtab %}
{% endtabs %}

<br>