Working with galleries different layouts

In this article we are going to take a look into galleries layouts and different ways to present them in your website.

Here we assume you already have some albums and you posted some images to each one of them. If you have trouble doing that please refer to our video tutorial about adding photos to galleries.

Topics we are going to cover:

1- Add gallery album to menu and post to menu

2- Set gallery layout

3- Show album in a page using Visual Composer element

4-Show list of albums in page using Visual Composer element

Ok let’s do it.

1- Add gallery album to menu:

We must add gallery plugin to menus so we can add links to album pages.

Please go to Admin panel->appearance->menus and follow the screen shot:



If you select the owwwlab Gallery as well you can add link to each single images as well.


2-Set gallery layout

Now we have our album page and we want to change it’s layout. Each album can have two layouts which you can set in Album settings.

Please go to Gallery->Albums and click on one of your albums and follow the screenshot:



3- Show album in a page using Visual Composer element

In step two we had one way to show our albums, the other way is creating a page and include gallery inside it.

I have created a page, let’s call it “Fashion Gallery”.

Click on “backend editor ” of Visual Composer and then “Add element”  :



As you can see we have those layouts here again “Grid” or “Horizontal”. Let’s add an album with Grid layout. Click in “Gallery Grid”:



Just enter the slug of your album. The slug is by default same as album name unless you set it something else.  As you can see there are some other setting which you can customize the output.

The last step is setting the page template. Here we need to set page template as “Dark Fullwidth Page”  and just publish the page.

4-Show list of albums in page using Visual Composer element

You can also add list of albums using “Gallery Albums” elements. If you use these element all of published albums will be listed in the page.