How to make Besley style & Grid Gallery add-on work in pair

Thanks to the release of a new awesome add-on - Grid Gallery which brings TZ Portfolio+ users a chance to display their portfolio gallery in a glamorous look. Our team have also recently updated all TZ Portfolio+ styles to make them completely compatible with this add-on. So this article today is to instruct you how to display Besley style in Grid Gallery. 

I. One-click installation

1. Install Besley style

• Go to Admin > Components > TZ Portfolio Plus > Styles
• Click button "Install" > Navigate Besley style > Click button "Install Now"
• Finally, a green message appears "Installation of the Style was successful".

2. Install Grid Gallery add-on

• Go to Admin > Components > TZ Portfolio Plus > Styles
• Click button "Install" > Navigate Grid Gallery style > Click button "Install Now"
• Finally, a green message appears "Installation of the Add-on was successful".​

II. Configurations

1. Configure Grid Gallery add-on 

• After having done installation, the add-on surely appears in Add-on Manager
• Go to Admin > Components > TZ Portfolio Plus > Add-ons >Click on Media Type - Grid Gallery
• In tab "Add-on": select light-box options
• In tab "Front-end options": choose "grid style" option, as well as adjust width and height of grid images

2. Configure Besley layout builder 

After having done installing the Besley style, Besley - default has already appeared in Layout manager

• Go to Admin > Components > TZ Portfolio Plus > Layouts > "Besley - default"
• Manage layout rows and columns like the way you want
• Configure background hover color and text color

III. Prepare portfolio articles

• Go to Admin > Components > TZ Portfolio Plus > Article > Add "New"
• Enter your own content and configure options (Article View Options) on the right side
• Choose media type ( Image / Image gallery / Video / Grid Gallery ..) and Style ( besley - Default)

​IV. Add new menu item

• Go to Admin > Menus > Main Menu > Add New
• Menu item type: TZ Portfolio Plus » Portfolio 
• TZ Portfolio Plus Layout: Choose "besley - Default"
• Go to tab "Basic options" and configure

Let's have a look at how beautifully Besley style matches with Grid Gallery on our demo.

V. Sum Up 

​After all, congratulations! you have already got a perfect portfolio page using Besley style and display with grid gallery. I hope this article will be helpful for all of you not only with Besley style, but also applying to others. If you have any difficulties in following this guideline, feel free to contact us, and we're willing to help anytime.