# Travel

### 1. Create new articles

* Please go to **admin > Content > Articles > Add new**
* Create your articles for a travel topic
* Assign your articles to the category "Travel"

![create a Joomla article](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2F4u7PhUV00xlfnhUeFYJE%2Fblog-article.jpg?alt=media\&token=75a25124-9172-410d-a71a-90bd2f8582b6)

### 2. Create menu item "Travel"

* Go to **Admin > Menus > Main menu > Add new**
* Menu item type: **Articles » Category Blog**
* Choose a category: **choose the Travel category**
* Template style: **tz\_newspaper - Default**

![](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2FIgzO6SV7Oh018joC1aXs%2Ftravel-menu.jpg?alt=media\&token=c5be8f76-14d7-4d2e-9fc7-8f773605c5f9)

### **3.** Configure blog layout

Navigate to the **tab "Blog Layout"**, you'll be able to configure options including Leading articles, Intro Article, columns, article order, and others.

* **Leading articles**: the number of featured articles placed on the top of the page
* **Intro Articles**: the number of articles will be displayed on the page
* **Columns**: the number of columns in which articles will be shown

![](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2F1y2CBXxrbB5jKZyF9rJq%2Ftravel-menu4.jpg?alt=media\&token=88320a68-bf36-47a3-9bfa-abab82d0ecae)

### 4. Create module "Travel - Latest Posts"

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

![Module Travel - Latest Posts](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)

### 5. Set up mega menu

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

{% hint style="info" %}
In our demo, the mega menu of Travel menu item was used with the module: Travel - Latest Posts
{% endhint %}

{% 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 the module "Travel - Latest Posts"](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>