Masonry Grid layout editor

To find the Masonry Grid module, Please go to “Pages > Add New”, click “BM Content Builder”

When select the source as Portfolio(or Post, WooCommerce Product), please pickup a Category. The “Edit Your Portfolio Layout” will be shown.

Before creating masonry grid, you should create several portfolio(project) items by single portfolios, they should be set with a category.

Click the “Edit Your Portfolio Layout”, the layout editor will be shown, You could drag and drop the each item to create the layout freely.

When select the source as the “Media Library”, please click the “Select Images” to pickup the image from the WordPress Media Library.

Item Spacing: You can set the gird spacing for desktop and mobile separately.

Fit Image into Grid: The images are filled into the grid by default(the images will be cropped). If the “Fit Image into Grid” option is activated, the images will be fit within the grid, the size of the image will be limited in the grid.

Filtercheck more

Image Lazy Load: It is for the page speed. The page will load fast if enable this option.
Notice: There is the same option in some 3rd performance plugins. Please stop the option in the 3rd performance plugin. It will be conflict with ours.

What Thumbnail Does: click the thumbnail to open a single portfolio/post item or open the image in a Lightbox

Open in New Window/Tab: open a single portfolio/post page in new window/tab

nofollow: It is for the network security. If you open the external link(source: media), please enable it.

Tap Once to Open Item on Touch Screen: On the mobile, you will tap twice to open the single portfolio. The 1st tab is for showing the text, like the mouseover on the desktop. The 2nd tab is for opening single portfolio. If you enable the option, it will open portfolio by once tab on the mobile.
Notice: if enable the Lightbox, it will always be opened by once tab.

Item Style: Image and Image + Text

Mouseover Effect:

It supports showing the 2nd featured image and no-effect also.

There is fully video here.

Was this article helpful?

Related Articles