Off Canvas sidebar is empty

Blog | TZ Portfolio

TZ Portfolio Tutorials, info, Discussions and much more...
2 minutes reading time (453 words)

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

How-to-make-Besley-style-and-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".​

Install Besley style 

​Install Grid Gallery

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

Configure Grid Gallery add-on

Configure Grid Gallery add-on

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
Configure layout builder

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
Add new menu
Configure basic options

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. 

×
Stay Informed

When you subscribe to the blog, we will send you an e-mail when there are new updates on the site so you wouldn't miss them.

Related Posts

 

Login