Do you want to add a beautiful gallery to your WordPress site? But haven't figured out where to start and how to do it? Well, this is the right place for you. Even if you are a beginner, you don't have to worry at all. Cause we're going to guide you through on how to create Dynamic Gallery with Elementor.
Why use Dynamic Gallery?
Dynamic Gallery is a great way to showcase your contents in style. With Essential Addons for Elementor, you can create a Dynamic Gallery as it comes with beautiful layouts and easily style-able contents. The best part of this element is the capability of generating galleries from any custom contents.
Another intriguing feature of Dynamic Gallery is the popup option. As soon as you click on a picture, the popup is nicely displayed in your screen.
Moreover, there's no limit to the number of gallery items you can use and you don't have to stuck with a specific type of content. To keep your gallery neat & clean, you can add the Load More Button which will trigger to show more gallery items.
Styling the Dynamic Gallery is very easy & flexible, even for the beginners. You can modify the background, color, padding, icon and many more stylings option to make the gallery impressive for the viewers.
- Beautiful Layouts
- Supports Custom Post type & Pages
- Gallery Popup
- Load More Button
- Ease of Styling
Activate Dynamic Gallery
The first thing you have to do is to search for Dynamic Gallery element from Elementor dashboard.
Once you are able to find it, simply just drag the widget and it would be activated.
Configure Dynamic Gallery Settings
After the EA Dynamic Gallery is activated, you will see Dynamic Gallery Settings option under the Content section.
You can set your preferred Animation Duration as well as the number of columns you want to see in your gallery. With the help of the drop-down menu, you can increase or decrease the number of columns and change the Item & Hover style.
Zoom & Link Icons are easily changeable as per your preference as well.
Choose a Layout
Most importantly, from the settings option, you can choose any of these two Layout Styles: Grid and Masonry.
First of all, let's talk about the “Grid” style since it's the default layout of Dynamic Gallery. Besides, Grid Item height is easily resizable. As a result, it gives you the flexibility to modify the thumbnail to any sizes.
You can also switch from Hovered item style to Cards. The difference between the two is that the latter one shows the content title and description.
If you don't feel comfortable with the Grid style layout, you have the option to change the layout to Masonry. Masonry layout lets you balance out your layout if the height of the gallery items is different.
Since the Masonry doesn't have any fixed height rows, your gallery items will look very fitting with each other.
Set up your Filterable Query
You can use your custom content as a source for your gallery. The Dynamic Gallery will automatically generate the galleries of the source you have selected. The source can be any of these three: Post, Pages & Manual Selection.
For the purpose of this article, Posts are gonna be used as the Source. You will then have the option to filter your gallery by either Author, Categories or Tags. If you don't choose any of these mentioned, only the default “All” tab is going to be used.
The categories or tags you choose will be used to filter your gallery. From the drop-down menu, you can also increase or decrease the number of posts per page and offset.
On the other hand, if you want to leave out certain authors, categories or tags, you can simply put its name in the “Exclude” field as well. Moreover, you will also have the freedom to order your gallery images by ascending or descending.
Show Popup Gallery
Under the Popup Settings, simply turn on the “Show Popup” toggle to show the popup gallery. That's how easy it is! You can also choose a style for your Popup which can be either Media or a Button.
Add Load More Button
If your plan is to showcase tons of gallery images, then you can simply add the Load More Button to the gallery. You can also modify the Alignment and Button top space of the Load More Button.
Style all the Features
Under the “Style” tab, you can easily add styling to your Items, Item Captions, Control & Load More Button. You can also change the Background Color, Border Type, Color, Border Radius, Typography, Icon Size and many more from this section.
Overall, the whole Style section is done in such a way that anyone can easily navigate and add styling to their contents.
To wrap this up, by following these mentioned steps you can easily create a nice Dynamic Gallery with Elementor on your website.
To get the live experience of Dynamic Gallery, you can also check our Demo and play around with it.
So, why don't you get started? Let us know if you have any questions in the Comments section.