Divi Masonry Gallery provides a brand new gallery module to the Divi Builder. With this plugin, you’ll be able to construct and customise masonry gallery layouts to show photographs to your web page. You’ll filter out photographs by means of classes, allow pagination, open photographs in lightbox presentations, and extra. The plugin additionally comes with design choices permitting you to totally customise the design of the masonry gallery module. On this product spotlight, we’ll check out Divi Masonry Gallery to assist you make a decision if it’s the precise product for you.

Let’s get began!

Putting in Divi Masonry Gallery

To put in Divi Masonry Gallery, navigate to the Plugin web page within the WordPress dashboard and Click on Upload New. Click on Make a selection Report, make a selection the .ZIP plugin document out of your laptop, then click on Set up Now.

As soon as the plugin is put in, click on turn on.

Divi Masonry Gallery

As soon as the plugin is activated, you’re going to see the Divi Masonry Gallery module seem within the Divi Builder. Let’s check out the module settings.

Content material Settings

Lots of the key choices are below the Gallery Settings segment of the content material tab. Right here you’ll be able to upload your photographs and make a selection how they’re displayed within the masonry gallery.

Gallery Settings

That is the masonry gallery within the commonplace gallery mode.

You’ll additionally make a selection minimized gallery mode, the place you’ll be able to set a prohibit to what number of photographs are displayed. The textual content proven at the final symbol can also be custom designed, and you’ll be able to make a selection whether or not the final symbol opens a lightbox or opens a hyperlink.

The choice of columns and the spacing between photographs can also be adjusted. Within the instance pictured right here, I set the gallery to 4 columns and larger the spacing.

Right here you’ll be able to additionally make a selection to have photographs zoom in on hover, load in random order each and every time, and alter the picture dimension.

Symbol Onclick Movements

You’ll set photographs to open in a lightbox, open a specified URL, or do not anything on click on. If the lightbox choice is chosen, you’ll be able to set the background colour and make a selection how the identify is displayed.

Here’s the lightbox at the entrance finish.

Hyperlinks will have to be added so as of the pictures and separated by means of {{hyperlink}}. You’ll additionally set the hyperlink goal.

Classes

Divi Masonry Gallery provides a class box to each and every symbol within the media library. You’ll allow those classes to filter out the gallery photographs.

With the kinds filter out enabled, you’ll be able to make a selection the integrated classes, display or conceal the all classes button, and alter the all classes button textual content.

Pagination

There are various kinds of pagination to make a choice from. Here’s the numbers and subsequent/prev pagination choice. You’ll additionally make a selection a lot more choice, or disable pagination altogether.

You’ll additionally specify the choice of photographs displayed on each and every web page, alter the button textual content, scroll to the highest after pagination, and set a scroll to most sensible offset.

Background

Right here you’ll be able to set the background colour for the masonry gallery module.

Design Settings

Within the design tab, you’ll be able to additional customise the glance of the masonry gallery module.

Overlay

Right here you’ll be able to set an icon or the picture identify/caption to look over the picture on hover and set the overlay background colour. With the overlay icon choice decided on, you’ll be able to make a selection the icon and icon colour.

You’ll customise the font and colours if the overlay identify/caption is chosen. Moreover, you’ll be able to make a selection the overlay content material animation, set the textual content alignment, letter spacing, and textual content shadow.

Symbol

Within the symbol settings, you’ll be able to upload a rounded nook and border on your gallery photographs.

Gallery Clear out

Right here you’ll be able to customise the design of the gallery filter out. You’ll exchange the alignment, background, margin and padding, font, spacing, rounded corners, borders, and field shadows. You’ll additionally exchange each and every of those settings for the energetic filter out button.

Gallery Pagination

The gallery pagination design choices can help you completely customise the glance of the pagination. Just like the gallery filter out settings, you’ll be able to customise the alignment, background, margin and padding, font, spacing, border, and shadow kinds for the energetic and common pagination buttons.

Minimized Gallery Choices

The minimized gallery sort presentations an overlay over the past symbol. Right here, you’ll be able to customise the styling of the overlay. You’ll exchange the background colour, font, alignment, textual content dimension, and textual content shadow.

Different Design Settings

Along with those module-specific design choices, you’ll be able to additionally customise all the sizing, spacing, border, field shadow, filters, develop into, and animation choices.

Divi Masonry Gallery Examples

Instance 1

The primary instance gallery format options 4 columns of pictures. The filters on the most sensible can be utilized to type photographs by means of class, and the pagination buttons can be utilized to view the following web page of pictures.

Instance 2

This format makes use of the minimized gallery format. The final symbol can also be set to open a lightbox or a brand new web page the place the remainder of the gallery photographs are proven.

Instance 3

In the end, the 3rd instance options a standard gallery format with 3 columns. On hover, an overlay seems, showing the picture identify.

Acquire Divi Masonry Gallery

Divi Masonry Gallery is to be had within the Divi Market. It prices $25 for limitless web page utilization and 1 yr of give a boost to and updates. The cost additionally features a 30-day money-back ensure.

Ultimate Ideas

With the Divi Masonry Gallery plugin, you’ll be able to simply create galleries to show photographs of all sizes in an exquisite, interactive, and fully-customizable masonry format. The plugin is feature-rich. You’ll allow class filters, pagination, minimized galleries, symbol hyperlinks, and lightbox popups. With in depth design choices, you’ll be able to customise each and every a part of the masonry gallery module on your liking. If you’re searching for an inventive technique to show photographs to your website online with design choices you’ll be able to customise with Divi, Divi Masonry Gallery is a brilliant choice.

We would really like to listen to from you! Have you ever attempted Divi Masonry Gallery? Tell us what you consider it within the feedback!

The put up Divi Product Highlight: Divi Masonry Gallery gave the impression first on Elegant Themes Blog.

WordPress Maintenance Plans | WordPress Hosting

read more