The Grid Gallery allows you to display a number of pictures in a symmetrical grid or offset masonry view. Grid Galleries are a great way to showcase your products, portfolio or services. Limecube allow users to embed pictures on grid galleries or ‘pop - up’ as bigger images if they are clicked on.
Adding a grid gallery
Steps to add a Grid Gallery to your page:
Select the page on which you’d like to add the grid gallery to.
Click on the ‘+Add Element’ Icon on the Page's Header Bar.
Drag and Drop the Grid icon (under Gallery) onto the area of the page that you want it to appear in.
Click on the Settings Icon.
Create a new Grid Gallery by adding the pictures you want through the file manager displayed.
Click on the settings tab to edit gallery display settings.
You have now added a grid gallery to your page.
Grid gallery settings
The title of your Gallery. Used for your admin purposes only.
images per row
With this setting, the gallery will automatically calculate the width of each image to fit the space where it is inserted.
Isotope serves multiple functions:
Turning this function on provides a nice shuffle effect with your images on page load
It allows the change of layout with the next function, 'masonry'
It allows for tags which are used for filtering
Masonry will only appear if 'Isotope' is turned on.
Image galleries are usually built using different types of images with varying dimensions. It can be challenging to create a set of images with the same dimensions, without losing parts of the image. Because of this, Masonry layouts are a great choice for creating galleries using images with varied dimensions.
When you choose the square image setting, it will crop your image within the thumbnail to give your gallery perfectly square images. If you have the popup image showing it will still retain its correct proportions.
Sets the image height. This is disabled if you select Masonry.
Popup large image
This setting turns on popping up larger images when clicking on the thumb image. Where images are larger than full screen they will adjust to fit the screen.
This setting controls the different space between gallery images.
Creating a masonry layout gallery
A masonry gallery is also based on grid layout, but unlike fixed grid layouts, images do not have fixed heights. This layout choice provides a nice and interesting variation on the standard grid layout.
Changing the order of images
Images can be moved around using drag n drop in the settings interface. Once applied the layout will automatically change in both the admin area as well as the front end of your site.
Tags can be added to each image to provide a filtering of your category based on the associated tags.
Tags will only display on your gallery if 'Isotope' has been selected on your settings
There are 2 steps to use tags.
1. Creating tags
Tags can be created by:
Open your gallery settings
Navigating to the icon in the top right corner tab with the 4 squares.
Click 'add new tag'
Repeat that until you have all required tags
2. Applying tags
Open your gallery in edit mode
Click on the pen icon in the middle of your image thumb
Scroll down till you see 'tags'
Select the tags you want to use (multiple tags can be selected by clicking on each)
You'll now see the filters at the top of your gallery.
If no tags have been applied to any images, these filters will not show.
Deleting a grid galley from a page
Select the page from which you would like to delete the Grid Gallery from.
Hover your mouse on top of the Grid Gallery.
Select the bin icon to delete the Grid Gallery from your page.
You have now deleted the Grid Gallery from your page.