# Gallery Masonry

### 1. Create the page "Gallery Masonry" in sp page builder

The page is built with SP Page Builder, so please make sure this component has been already installed. 

* Go to Admin > Components > SP Page builder > Pages > Add new
* Click to add new row > add new addons > A list of add-ons appear > open the tab "**Jollyany**" on the left, you'll see all Jollyany addons
* This page is used with the following addons: **UK Text, and UK Gallery.** Look for these 2 addons in the list and add them to the page and start configurations.

![](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2FLvxqg5G2DBaDHnep8WLG%2Fjollyany%20addon.jpg?alt=media\&token=cfad521c-38f8-4e3f-b1af-db22bf76c098)

![](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2FUVMkPU30BwxtvkAFAuFH%2Fgallery-sppb.jpg?alt=media\&token=c42ba555-d8bf-493c-81d2-00a68363f2fb)

{% hint style="info" %}

* **UK Text:** edit the addon, enter a title and add its content, as well as configure other options
* **UK Gallery:** edit the addon, click "**Add item**", with each item, you can upload an image, give it a title, link, and so on. **Remember to enable the Masonry effect** -> then click Apply changes
  {% endhint %}

![](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2F46pkhUZSapDY6PPXnuS6%2Fmasonry-option.jpg?alt=media\&token=43cce5ae-1507-45dc-92e6-25f42cb74007)

### 2. Add a new menu item

This step is to add a new menu item for the page "Gallery Masonry" so that it can display properly in the main menu

* Go to **Admin > Menus > Main menu > Add new**
* Menu item type: **SP Page Builder > Pages**
* Select page: **Gallery Masonry**
* Template style: **tz\_alex - default**

![](https://3301969549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2FOxKX0X3FI1nShFUydErf%2Fgallery-menu.jpg?alt=media\&token=c3860c3c-1210-4ba3-8a3c-74f535864c67)

<br>