ZealousWeb

<p>Introducing the “Grid Masonry for Guten blocks” plugin – a powerful tool designed to enhance your content display in the Gutenberg editor. With this plugin, you can effortlessly create visually appealing grids that showcase a mix of images, videos, posts, and custom posts in a stunning masonry-style layout.</p>
<ul>
<li>Present a captivating blend of images, videos in a media grid, and posts and custom posts within the post grid, offering a dynamic and engaging content presentation.</li>
<li>Tailor your grid by choosing the number of columns and rows, giving you full control over the structure and appearance of your content.</li>
<li>Enhance the user experience by enabling a lightbox feature for images and videos. When clicked, media items expand for a larger, more immersive view.</li>
<li>Support for various video formats, including MP4, YouTube, and Vimeo, allowing you to seamlessly integrate diverse multimedia content.</li>
<li>Compatibility of WordPress VIP.</li>
</ul>
<h3>Plugin Requirement</h3>
<p>PHP version : 7.4 and latest<br />
WordPress   : WordPress 5.9 and latest</p>
<h3>OUR OTHER PLUGINS</h3>
<ul>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/abandoned-contact-form-7-pro" rel="nofollow ugc">Abandoned Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/accept-2checkout-payments-using-contact-form-7-pro" rel="nofollow ugc">Accept 2 Checkout Payments Using Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/accept-authorize-net-payments-using-contact-form-7-pro" rel="nofollow ugc">Accept Authorize.NET Payments Using Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/accept-elavon-payments-using-contact-form-7-pro" rel="nofollow ugc">Accept Elavon Payments Using Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/accept-paypal-payments-using-contact-form-7-pro" rel="nofollow ugc">Accept PayPal Payments Using Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/accept-sage-pay-opayo-payments-using-contact-form-7-pro" rel="nofollow ugc">Accept Sagepay(Opayo) Payments Using Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/accept-stripe-payments-using-contact-form-7-pro" rel="nofollow ugc">Accept Stripe Payments Using Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/custom-product-options-woocommerce-pro" rel="nofollow ugc">Custom Product Options WooCommerce Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/generate-pdf-using-contact-form-7-pro" rel="nofollow ugc">Generate PDF Using Contact Form 7 Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/smart-appointment-booking-pro" rel="nofollow ugc">Smart Appointment & Booking Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/smart-showcase-for-google-reviews-pro" rel="nofollow ugc">Smart Showcase for Google Reviews Pro</a></strong></li>
<li><strong><a href="https://store.zealousweb.com/wordpress-plugins/user-registration-using-contact-form-7-pro" rel="nofollow ugc">User Registration Using Contact Form 7 Pro</a></strong></li>
</ul>
<h4>Getting Help With WordPress</h4>
<p>If you have any difficulties while using this Plugin, please feel free to contact us at <strong><a href="https://support.zealousweb.com/portal/en/home" rel="nofollow ugc">Support</a></strong></p>
<p>We also offer custom WordPress extension development and WordPress theme design services to fulfill your e-commerce objectives.</p>
<p>Our professional impassioned WordPress experts provide profound and customer-oriented development of your project within short timeframes.</p>
<p>Thank you for choosing a Plugin developed by <strong><a href="https://www.zealousweb.com" rel="nofollow ugc">ZealousWeb</a></strong>!</p>
<h3>Functionality</h3>
<p>This plugin utilizes third-party libraries to enhance its functionality:</p>
<ul>
<li><strong>Fancybox JS:</strong> https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.umd.js – Use to acieve lightbox functionality for images and videos in popup</li>
<li><strong>Fancybox CSS:</strong> https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.css – Use to acieve lightbox functionality for images and videos in popup</li>
<li><strong>Isotope:</strong> https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js – Use to achive Masonry output for post and media layout</li>
</ul>


Grid Masonry for Guten blocks


It's a wonderful plugin, has features I would have liked the Gallery block to integrate but this works well! The hover image design is not as good as I think it should be but that might be an easy fix if developer wanted to "match design" of wordpress.



i.imgur.com/8zRUHXX(dot)png


Works great!

Create stunning grids with Gutenberg. Display images, videos, and posts in masonry style. Customize columns, rows, lightbox, and more.

Alexander

Pathhan

zish

mohammadhanif

Sharik Khan

fkfaisalkhan007

FARAZFRANK

A WP Life

<p>Image Gallery helps you create stunning photo galleries on your WordPress site without any coding. Whether you run a portfolio, photography blog, or business website, this plugin lets you showcase your images in organized, visually appealing layouts.</p>
<p><strong>View Free Demo:</strong> <strong><a href="https://awplife.com/demo/image-gallery-free-wordpress-plugin/" rel="nofollow ugc">Image Gallery</a></strong> | <strong>View Pro Demo:</strong> <strong><a href="https://awplife.com/demo/image-gallery-premium/" rel="nofollow ugc">Image Gallery Premium</a></strong><br />
<strong>More About Pro:</strong> <strong><a href="https://awplife.com/wordpress-plugins/image-gallery-premium/" rel="nofollow ugc">Image Gallery Premium Details</a></strong> | <strong>Where To Buy:</strong> <strong><a href="https://awplife.com/wordpress-plugins/image-gallery-premium/" rel="nofollow ugc">Buy Pro Version</a></strong></p>
<p>With grid and masonry options, your galleries adapt to any screen size automatically. The built-in lightbox opens images in a sleek overlay, giving visitors a focused viewing experience. You can add unlimited images to each gallery and create as many galleries as your site needs.</p>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/dNou6i8d-l4?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&start=9&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<h4>How It Works</h4>
<p>Setting up a gallery takes just a few steps:</p>
<ol>
<li>Go to New Image Gallery menu in your dashboard</li>
<li>Click Add Image Gallery</li>
<li>Upload or select images from your media library</li>
<li>Configure layout settings (grid, masonry, columns)</li>
<li>Copy the shortcode and paste it into any post or page</li>
</ol>
<p>The shortcode format is simple: <code>[IMG-Gal id=X]</code> where X is your gallery ID.</p>
<h4>Gallery Layouts</h4>
<ul>
<li><strong>Grid Gallery</strong> – Images display in uniform rows and columns</li>
<li><strong>Masonry Gallery</strong> – Images stack naturally based on their dimensions</li>
<li><strong>Widget Gallery</strong> – Show galleries in sidebar areas</li>
<li><strong>Lightbox Preview</strong> – Opens full-size images in an overlay</li>
</ul>
<h4>Column Options</h4>
<p>Choose from 2 to 6 columns to control how many images appear per row. The layout adjusts automatically on mobile devices for a smooth browsing experience.</p>
<h4>Free Version Features</h4>
<ul>
<li>Unlimited image galleries</li>
<li>Grid and masonry layouts</li>
<li>LD Lightbox for image preview</li>
<li>Responsive design for all devices</li>
<li>2 to 6 column layouts</li>
<li>Image title display option</li>
<li>Shortcode for posts and pages</li>
<li>Widget support for sidebars</li>
<li>Drag and drop image ordering</li>
<li>Image alt text for accessibility</li>
<li>Custom spacing and borders</li>
</ul>
<h4>Pro Version Features</h4>
<p>Upgrade to the Pro version for additional capabilities:</p>
<ul>
<li>All free features included</li>
<li>6 lightbox styles (BlueImp, PopTrox, Viewer, LD, and more)</li>
<li>30 hover effects for image thumbnails</li>
<li>2D transition animations</li>
<li>Link gallery – add custom URLs to images</li>
<li>Advanced sorting (ascending, descending, shuffle)</li>
<li>Load more button for large galleries</li>
<li>Custom CSS for further styling</li>
<li>Thumbnail size and quality controls</li>
<li>Priority email support</li>
</ul>
<h4>More Pro Version Demos</h4>
<ul>
<li><a href="https://awplife.com/demo/image-gallery-premium/image-gallery-premium/" rel="nofollow ugc">Premium Gallery</a></li>
<li><a href="https://awplife.com/demo/image-gallery-premium/masonry-gallery-2/" rel="nofollow ugc">Masonry Layout</a></li>
<li><a href="https://awplife.com/demo/image-gallery-premium/blue-imp-light-box-gallery/" rel="nofollow ugc">BlueImp Lightbox</a></li>
<li><a href="https://awplife.com/demo/image-gallery-premium/pop-trox-light-box-gallery/" rel="nofollow ugc">PopTrox Lightbox</a></li>
<li><a href="https://awplife.com/demo/image-gallery-premium/viewer-light-box-gallery/" rel="nofollow ugc">Viewer Lightbox</a></li>
<li><a href="https://awplife.com/demo/image-gallery-premium/hide-image-spacing/" rel="nofollow ugc">No Spacing Layout</a></li>
</ul>


Image Gallery

Create responsive image galleries with lightbox, grid & masonry layouts. Easy shortcode display for posts and pages.

Grid Masonry for Guten blocks vs Image Gallery