1. Home
  2. Docs
  3. Content Elements
  4. Filterable Gallery

Filterable Gallery

How to Configure and Style EA Filterable Gallery

EA Filterable Gallery is going to help you design & display a beautiful gallery layout for your custom contents with ease.

Table of Contents:

  1. How to Activate Filterable Gallery
  2. How to Configure the Content Settings
    2.1. Settings
    2.2. Filterable Controls
    2.3. Gallery Items
    2.4. Load More Button
  3. How to Style the Data Table
    3.1. General Style
    3.2. Others
  4. Final Outcome

1. How to Activate Filterable Gallery

To use this Essential Addons element, find the ‘EA Filterable Gallery‘ element from the Search option under the ‘ELEMENTS’ tab. Simply just Drag the ‘EA Filterable Gallery’ into the ‘Drag widget here’ section.

Filterable Gallery
After you are successfully done with this step, this is how the element is going to look like:

Filterable Gallery

2.  How to Configure the Content Settings

Under the ‘Content’ tab, you will find the ‘Settings’ option.

2.1. Settings

Use the drop-down menu to select Caption Style, Layout, Number of columns, Hover Style for the element.

Filterable Gallery

Simply use the drop-down menu to change the ‘Lightbox Icon’ and ‘Link Icon’ as per your preference.

Filterable Gallery

2.2. Filterable Controls

You can either Disable or Enable Filter, change the ‘Gallery All Label’ and Add/ Edit/ Copy/ Delete List Items.

Filterable Gallery

2.3. Gallery Items

You can individually edit the Gallery Items in your gallery. Pick an existing image from the media library or upload a new one. Insert the keyword you want the item to respond to. Type in the keyword in the Control Name field. You can also change the Item Name and Content from here.

Filterable Gallery

You can also Enable/Disable Gallery Lightbox and Gallery Link button. If the Gallery Link button is enabled, provide a link in the URL box and select your preferred redirection option.

Filterable Gallery

Click to See Live Demo

2.4. Load More Button

By enabling the ‘Load More Button’ option, you can set ‘Images Per Page’ and change the Button Texts, Size & Alignment.

Filterable Gallery

3. How to Style Filterable Gallery

Move on to the ‘Style’ tab to style all the elements of Filterable Gallery.

3.1.  General Style

From ‘General Style’ section, you are able to change the ‘Background Color’ of Filterable Gallery. If you want, you can even add a ‘Border Type’ and then modify its styling as well. You can even add ‘Box Shadow’ as well.

Filterable Gallery

3.2. Others

Filterable Gallery Style tab gives you the opportunity to modify the appearance of the whole gallery as per your wish. You will have the flexibility to add styling to the Control, Item, Icons & Load More Button.

Besides, you are able to add styling to hover view for Item and Video items as well. Moreover, you can change the Typography of the contents as well.

Filterable Gallery

4. Final Outcome

By following the basic steps and a bit more modifying, you can style your Filterable Gallery content as per your preference.

Filterable Gallery

This is how you can showcase an amazing image/video gallery using EA Filterable Gallery.

Getting stuck? Feel to Contact Our Support for further assistance.

Get Started Now

Tags , , , , ,

How can we help?