<p>Shader Grid is a Three.js and WebGL shader powered infinite image grid with smooth drag interaction, post‑processing effects, and optional lightbox support. It’s fully responsive, touch‑friendly, and designed to run across all major browsers and devices.</p>
<h3>Highlights</h3>
<p><strong>Three.js + WebGL Shaders</strong> – Next‑gen GLSL grid with rich visual effects and GPU performance.</p>
<p><strong>Easy To Configure And Install</strong> – Includes detailed documentation, demo pages, updates, and direct support from the developer – <strong><a href="mailto:tibi@fwdapps.net" rel="nofollow ugc">Tibi @ FWD</a></strong>.</p>
<h3>Main Features</h3>
<ul>
<li><strong>Responsive Layout</strong> – Fully responsive and adaptable regardless of which device or screen size is used.</li>
<li><strong>Desktop & Mobile Optimized</strong> – Optimized for iOS, Android, and desktop browsers.</li>
<li><strong>Lazy Scrolling/Loading</strong> – Initialize only when visible in the page to save resources.</li>
<li><strong>Infinite Drag</strong> – Drag infinitely in all directions with seamless wrapping.</li>
<li><strong>Paralax</strong> – Optional vertical parallax.</li>
<li><strong>Customizable Size</strong> – Adjust image size and spacing as needed.</li>
<li><strong>Caption</strong> – Optional captions styled via CSS.</li>
<li><strong>Dynamic Image Black & White</strong> – Adjustable black and white falloff from the center.</li>
<li><strong>Hover Scale</strong> – Smooth hover scale with custom size.</li>
<li><strong>Scroll Speed Strength</strong> – Fine‑tune drag speed and feel.</li>
<li><strong>Wave Post‑Processing</strong> – Adjustable wave frequency, amplitude, and RGB shift.</li>
<li><strong>Glitch Post‑Processing</strong> – Optional glitch effect.</li>
<li><strong>Bulge Post‑Processing</strong> – Bulge effect with RGB distortion controls.</li>
<li><strong>Ripple Post‑Processing</strong> – Ripple effect with strength and size controls.</li>
<li><strong>Customizable Mouse Distortion</strong> – Flowmap‑based distortion with optional RGB shift.</li>
<li><strong>Lightbox Video/Audio</strong> – Supports <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=7" rel="nofollow ugc">mp3</a>, <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=0" rel="nofollow ugc">mp4</a>, <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=12" rel="nofollow ugc">YouTube</a>, <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=13" rel="nofollow ugc">Vimeo</a>, <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=11" rel="nofollow ugc">HLS</a>, DASH, <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=6" rel="nofollow ugc">Google Drive</a>, Dropbox, and more.</li>
<li><strong>Video Autoplay</strong> – Optional autoplay inside the <a href="https://fwdapps.net/p/sg/demo-2.html#/?rlguid=fwdsg0_&rlmid=0" rel="nofollow ugc">lightbox</a>.</li>
<li><strong>Private Video & Audio</strong> – Password‑protected media support, <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=1" rel="nofollow ugc">example</a>.</li>
<li><strong>Chromecast Support</strong> – Cast compatible streams to TV.</li>
<li><strong>Video Thumbnails Live Preview</strong> – VTT or auto‑generated thumbnails in the lightbox.</li>
<li><strong>Video Subtitle Support</strong> – Subtitle support inside the <a href="https://fwdapps.net/p/sg/demo-1.html#/?rlguid=fwdsg0_&rlmid=0" rel="nofollow ugc">lightbox</a>.</li>
<li><strong>Automatic Content Detection</strong> – <a href="https://fwdapps.net/p/rl/" rel="nofollow ugc">Revolution Lightbox</a> detects media type automatically.</li>
<li><strong>Slideshow Support</strong> – Autoplay for grid items and lightbox.</li>
<li><strong>Drag & Swipe Support</strong> – Touch and drag navigation.</li>
<li><strong>Maximize & Minimize For Images</strong> – Double‑click/tap zoom and maximize controls.</li>
<li><strong>Share Button And Share Window</strong> – Built‑in share window with multiple platforms.</li>
<li><strong>Detailed Documentation</strong> – <a href="https://fwdapps.net/p/sg/javascript-documentation.html" rel="nofollow ugc">JavaScript documentation</a> and <a href="https://fwdapps.net/p/sg/wordpress-documentation.html" rel="nofollow ugc">WordPress documentation</a> included.</li>
</ul>
<h3>Configuration</h3>
<p>After activation, open the plugin settings in the WordPress admin area and create a new grid preset. Then use the shortcode below in any post or page.</p>
<h3>Use Cases</h3>
<ul>
<li>Infinite image grids for hero sections</li>
<li>Portfolio and gallery showcases</li>
<li>Interactive media walls</li>
<li>Product or brand storytelling sections</li>
<li>Immersive landing pages</li>
</ul>
<h3>Links</h3>
<ul>
<li><a href="https://fwdapps.net/p/sg" rel="nofollow ugc">Homepage & Docs</a></li>
<li><a href="https://fwdapps.net/p/sg/#demos" rel="nofollow ugc">Demos</a></li>
<li><a href="https://fwdapps.net/p/sg/javascript-documentation.html" rel="nofollow ugc">JavaScript Documentation</a></li>
<li><a href="https://fwdapps.net/p/sg/wordpress-documentation.html" rel="nofollow ugc">WordPress Documentation</a></li>
<li><a href="https://fwdapps.net/contact" rel="nofollow ugc">Support</a></li>
<li><a href="https://fwdapps.net/p/rl/" rel="nofollow ugc">Revolution Lightbox</a></li>
</ul>
<h3>Shortcode</h3>
<p>Basic example:</p>
<p>[fwdsg preset_name=”Grid preset 1″ gallery_name=”test”]</p>
<h3>Development</h3>
<p>This plugin’s full source code is publicly available for transparency and verification.<br />
Developed and maintained by <a href="https://fwdapps.net" rel="nofollow ugc">FutureWebDesign</a>.</p>
<ul>
<li><a href="https://fwdapps.net/d/js/sg.zip" rel="nofollow ugc">Source code & build tools</a> — includes original uncompiled files and Vite build configuration.</li>
<li>Distributed plugin uses a compiled build generated by Vite for optimal performance.</li>
</ul>


Shader Grid

Powerful and extremely customizable responsive infinite image/video grid with WebGL shaders and lightbox support.

thewpgeeks

<h4>Image Gallery Plugin for WordPress by Photo Gallery Plus</h4>
<p><strong><a href="https://www.thewpgeeks.com/" rel="nofollow ugc">Photo Gallery Plus</a></strong> is a <strong>WordPress Gallery Plugin</strong> launched in 2017.</p>
<ul>
<li><a href="https://www.thewpgeeks.com/" rel="nofollow ugc">Photo Gallery Plus – Image Gallery Plugin for WordPress</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/" rel="nofollow ugc">Photo Gallery Plus Demos</a></li>
<li><a href="https://www.thewpgeeks.com/documentation/" rel="nofollow ugc">Photo Gallery Plus Documentation</a></li>
</ul>
<p>Photo Gallery Plus is a fully responsive <strong>WordPress Image Gallery Plugin</strong> with super advanced functionality.</p>
<p>It allows you to create beautiful <strong>responsive photo gallery</strong> for your WordPress site in minutes, not hours!</p>
<p>We put in extra effort to ensure that Photo Gallery Plus is the <strong>best responsive image gallery plugin</strong> for WordPress.</p>
<p>It’s great for general use, but powerful enough for the most demanding photographers, visual artists, and imaging professionals.</p>
<p>Your <strong>image gallery</strong> will always look great on all devices (mobile, tablet, laptop, and desktop). Just sit and relax!</p>
<p>Photo Gallery allows you to upload unlimited number of pictures and create as many image galleries as you need.</p>
<h4>LIVE DEMOS FOR IMAGE GALLERY AND PHOTO ALBUMS</h4>
<ul>
<li><a href="https://www.thewpgeeks.com/frontend-demos/" rel="nofollow ugc">Photo Gallery Plus Demos</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-title-description-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lightboxes-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Lightboxes</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-pagination-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Pagination</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lazy-load-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Lazy Load</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-filters-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Filters</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-order-by-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Order By</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-search-box-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Search Box</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-watermark-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Watermark</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-animation-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Animation Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-special-effects-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Thumbnail Layout with Special Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-title-description-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lightboxes-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Lightboxes</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-pagination-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Pagination</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lazy-load-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Lazy Load</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-filters-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Filters</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-order-by-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Order By</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-search-box-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Search Box</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-watermark-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Watermark</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-animation-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Animation Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-special-effects-masonry-layout/" rel="nofollow ugc">Image Gallery in Masonry Layout with Special Effects</a></li>
<li><a href="https://thewpgeeks.com/frontend-demos/individual-images-with-title-description-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lazy-load-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout with Lazy Load</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-filters-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout with Filters</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-order-by-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout with Order By</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-search-box-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout with Search Box</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-watermark-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout with Watermark</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-animation-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout with Animation Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-special-effects-slideshow-layout/" rel="nofollow ugc">Image Gallery in Slide Show Layout with Special Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-title-description-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lazy-load-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout with Lazy Load</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-filters-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout with Filters</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-order-by-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout with Order By</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-search-box-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout with Search Box</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-watermark-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout with Watermark</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-animation-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout with Animation Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-special-effects-image-browser-layout/" rel="nofollow ugc">Image Gallery in Image Browser Layout with Special Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-title-description-justified-grid-layout/" rel="nofollow ugc">Image Gallery in Justified Grid Layout</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lightboxes-justified-grid-layout/" rel="nofollow ugc">Image Gallery in Justified Grid Layout with Lightboxes</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-pagination-justified-grid-layout/" rel="nofollow ugc">Image Gallery in Justified Grid Layout with Pagination</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lazy-load-justified-layout/" rel="nofollow ugc">Image Gallery in Justified Grid with Lazy Load</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-filters-justified-layout/" rel="nofollow ugc">Image Gallery in Justified Grid with Filters</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-order-by-justified-layout/" rel="nofollow ugc">Image Gallery in Justified Grid with Order By</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-search-box-justified-layout/" rel="nofollow ugc">Image Gallery in Justified Grid with Search Box</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-watermark-justified-grid-layout/" rel="nofollow ugc">Image Gallery in Justified Grid Layout with Watermark</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-animation-justified-grid-layout/" rel="nofollow ugc">Image Gallery in Justified Grid Layout with Animation Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-special-effects-justified-grid-layout/" rel="nofollow ugc">Image Gallery in Justified Grid Layout with Special Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-title-description-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style Layout</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lightboxes-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style Layout with Lightboxes</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-pagination-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style Layout with Pagination</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-lazy-load-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style with Lazy Load</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-filters-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style with Filters</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-order-by-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style with Order By</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-search-box-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style with Search Box</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-watermark-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style Layout with Watermark</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-animation-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style Layout with Animation Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/individual-images-with-special-effects-blog-style-layout/" rel="nofollow ugc">Image Gallery in Blog Style Layout with Special Effects</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/compact-album-with-title-description-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Compact Album Layout</a></li>
<li><a href="https://www.thewpgeeks.com/frontend-demos/extended-album-with-title-description-thumbnail-layout/" rel="nofollow ugc">Image Gallery in Extended Album Layout</a></li>
</ul>
<h4>Photo Gallery Plus Standard Edition Features</h4>
<ul>
<li>100% Responsive Photo Gallery Plugin.</li>
<li>Create & Manage unlimited amount of image galleries on your wordpress site.</li>
<li>Upload unlimited amount of photos/images in your gallery.</li>
<li>Images uploaded are stored in a separate directory to avoid mess up with wp-uploads.</li>
<li>Photo Metadata is fetched from each image and populates to Title, Description, Alt Text Fields too.</li>
<li>Photo Metadata is retrieved as per IPTC Standard mentioned <a href="https://iptc.org/standards/photo-metadata/photo-metadata/" rel="nofollow ugc">here</a></li>
<li>Add Gallery Title and Gallery Description to each of your galleries.</li>
<li>Add Image Title, Image Description, Alt Text to each of your images in your photo gallery. </li>
<li>Possibility to exclude images from displaying in a particular gallery.</li>
<li>Add Single Gallery to your page or post using a shortcode.</li>
<li>Add a caption to each photo in the album.</li>
<li>Change the size of album cover thumbnails and photos in the album. </li>
<li>Choose a number of pictures to display in one row in the gallery album. </li>
<li>View pictures as a slide show and in a full size.</li>
<li>3 different Widgets: Display a single album, create a list of album links, display latest/random media</li>
<li>User-friendly AJAX admin</li>
<li>Upload different types of media</li>
</ul>
<h4>WordPress Image Gallery Step by Step Guide</h4>
<h4>Step 1: Installing the Photo Gallery Plugin</h4>
<h4>Minimum requirements.</h4>
<ul>
<li>WordPress 3.1+</li>
<li>PHP 5.x</li>
<li>MySQL 5.x</li>
</ul>
<h4>Using The WordPress Dashboard</h4>
<ol>
<li>Navigate to the ‘Add New’ in the Plugins Dashboard</li>
<li>Search for ‘Photo Gallery Plus’</li>
<li>Click ‘Install Now’</li>
<li>Activate the Plugin on the Plugin dashboard</li>
</ol>
<h4>Uploading in WordPress Dashboard</h4>
<ol>
<li>Navigate to the ‘Add New’ in the Plugins Dashboard</li>
<li>Navigate to the ‘Upload’ area</li>
<li>Select <code>photo-gallery-plus.zip</code> from your computer</li>
<li>Click ‘Install Now’</li>
<li>Activate the Plugin in the Plugin dashboard</li>
</ol>
<h4>Using FTP</h4>
<ol>
<li>Download <code>photo-gallery-plus.zip</code></li>
<li>Extract the <code>photo-gallery-plus</code> directory to your computer</li>
<li>Upload the <code>photo-gallery-plus</code> directory to the <code>/wp-content/plugins/</code> directory</li>
<li>Activate the Plugin in the Plugin’s dashboard</li>
</ol>
<p>** For Mac Users</p>
<ol>
<li>Go to your Downloads folder and locate the folder with the Plugin.</li>
<li>Right-click on the folder and select Compress. </li>
<li>Now you have a newly created .zip file which can be installed as described here.</li>
</ol>


Photo Gallery Plus – Image Gallery Plugin for WordPress

Thank you wordpress.org for giving us a chance to host our plugin on your repository.

This is one of the Best Photo Gallery Plugin for WordPress.

All the Best,

Thanks

The WP Geeks

Disclaimer: We are the developers of this plugin.

Best Photo Gallery Plugin on WordPress

Photo Gallery Plugin can be used to create a gallery widget, media gallery, image gallery, portfolio gallery and photo albums.

Shader Grid vs Photo Gallery Plus – Image Gallery Plugin for WordPress