th23

WordPress has come a long way to be a fully featured content editor system, but the default gallery does not keep up with it. And while there are many plugins with various features, I did not find a small and simple one putting the focus on enlarged images.
<a href="https://photoswipe.com/" rel="nofollow ugc">PhotoSwipe</a> is a great basis and thus core component of my th23 Gallery plugin, which replaces the WordPress default to output galleries into a way containing all key information required while maintaining a simple and easy markup.
th23 Gallery is built with some few goals in mind:
<ul>
<li>Unintrusive way to focus on images</li>
<li>Leveraging PhotoSwipe / Lightbox-like overlay</li>
<li>Navigation between images in all galleries in a post via intuitive swipe, keyboard or mouse activity</li>
<li>Compatibile with modern blocks and legacy shortcodes</li>
<li>Simple markup and styling for thumbnail preview images (polaroid-style)</li>
<li>Plain styling for medium / large preview images allowing for theme based style</li>
<li>Minimized footprint on page loading</li>
</ul>
<h3>Usage</h3>
th23 Gallery works out-of-the-box and does not require any special handling – right after activation all embedded galleries will use PhotoSwipe to enlarge pictures.
Note: Polaroid-style works only on galleries which have set the preview image size to <code>Thumbnail</code>
Note: Previously inserted galleries might require a review to ensure link to media file and preview image size are set to work as expected – especially when also using the plugin on legacy <code>[gallery]</code> shortcodes.

th23 Gallery

Replace standard Wordpress Gallery block and legacy [gallery] shortcode handler, opening galleries using PhotoSwipe

Katsushi Kawamori

<h4>Add the effect of Masonry to image.</h4>
<ul>
<li>Supports block and shortcode.</li>
<li>Add effect to images inserted into WordPress posts, custom posts and pages.</li>
<li>Add effect to the WordPress gallery.</li>
<li>Apply the effect by embedding the shortcode into text field.</li>
<li>Apply the effect by embedding the shortcode into template.</li>
</ul>
<h4>How it works</h4>
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/aB_8p_6pFOE?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>

th23 Gallery vs Simple Masonry Gallery