For this article, I experimented with a few different gallery and slideshow plugins:
- FooGallery
- GT3 Photo Gallery
- Smart Slider 3
- The Advanced Gallery block from the Kadence Blocks plugin.
- Meow Gallery
I didn’t come up with a definitive “best” plugin, but I can tell you that personally, if I want a simple gallery I tend to choose the Kadence Advanced Gallery block or the Meow Gallery plugin. If I need something with a few more bells and whistles, I’ll go with FooGallery.
Some Alternative Suggestions
Although I chose to use some of the most recommended plugins for this exercise, I’d suggest that you have a look at a few of the alternatives, look for reviews and have a play with them to see how they work. Some plugins to consider include:
Adding Image Galleries with the FooGallery Plugin
I wanted to build a grid of images, each of which was linked to a different page of a website. I used the free FooGallery plugin to make a gallery containing these images, and chose to use a Masonry Image Gallery with the following settings:
- Thumb width = 200
- Masonry Layout = 3 columns
- Gutter Size = Normal
- Thumbnail Link = Custom URL
Clicking on one of the images allowed me to input a caption and the URL that I wanted to link it to.
FooGallery galleries can be added as shortcodes or as blocks.
FooGallery has several different gallery types including a Justified Gallery, Responsive Image Gallery and a Simple Portfolio Gallery.
In the example above, I’d used Custom URL for the Thumbnail Link setting, but I also wanted to try a gallery where the images opened up in a lightbox when clicked. I installed the free FooBox plugin and set Thumbnail Link to Full Size Image (Lightbox), instead of to Custom URL.
Under the Advanced tab of the FooBox settings, I ticked the box to “Exclude FooBox Assets” so that FooBox’s javascript and stylesheet assets would not be loaded on pages where I wasn’t using it. Then as I edited each gallery page, I ticked the option to include FooBox.
A Note About Image Quality
As a general rule, it’s a good idea to keep images as small as possible because loading large images will slow a site down, but they should never be uploaded with a smaller size, in pixels, than the size at which they will be displayed. For example, if an image is 600px wide but it is enlarged to stretch across the full width of the screen then it will look terrible. A minimum of 1920px is generally recommended for full width images.
But it’s not the size in pixels that’s important when it comes to loading time. Images should also be optimised so that they are not too big in terms of kB. Personally, I use photo processing software to save an image at no more than around 250 to 300kB. Sometimes I’ll use an online tool such as Kraken.io or ShortPixel to optimise my photos. A lot of people would say that even 250kB is too big – it’s subjective. The difficulty is that you need to balance “as small as possible” with your desire to display high quality images – particularly if you are a photographer.
If you try to upload an image that is more than 2560px wide or tall then WordPress will scale it down (see https://make.wordpress.org/core/2019/10/09/introducing-handling-of-big-images-in-wordpress-5-3/ ).
When an image is uploaded to WordPress, various smaller versions of it are created. The sizes of the Thumbnail, Medium and Large images are determined in the Dashboard under Settings > Media. Depending on the size of the image that is uploaded, images with sizes of 768px, 1536px and 2048px may also be created to be used with the srcset HTML attribute.
Because most people will need their sites to load quickly, WordPress uses a compression factor of 82%. Sometimes, I don’t want it to do this, and use the Code Snippets plugin to add the filter below which increases this value to 95%.
add_filter('jpeg_quality', function($arg){return 95;});Using a FooGallery Album
One way to link to different galleries is to use FooGallery’s Album feature.
In order to be able to create this album, I needed to activate the FooGallery Albums extension in the Dashboard under FooGallery > Extensions. This enabled me to add a new album and then add my galleries to this album.
Creating the album generated a shortcode which I could copy into a shortcode block on one of my website pages.
Using Smart Slider 3 as an Alternative Way to Display Images
Photographers often use slideshows to display their portfolios. One of the most popular slideshow plugins is Smart Slider 3.
I created a new slider, added some photos and set the slide background image fill to “fit”.
I worked my way through the options, experimenting with different settings until I was happy with the results. Some of the settings I ended up with were as follows:
- Slider Size: width = 970px, height = 700px
- Responsive mode: auto
- Arrows but no bullets
- Thumbnail: width = 180px, height = 120px
- Thumbnail position at the bottom
I feel that I only scratched the surface of what’s possible with Smart Slider 3 but it was enough to give me an idea of what it could do.
A Look at the GT3 Photo Gallery Plugin
I started with the FooGallery plugin for this exercise, as it’s been a favourite of mine for some time. But I was intrigued to see that Melissa Love, of The Design Space, recommended the GT3 Photo Gallery plugin. I decided to duplicate my bird gallery page to see how this plugin compares to FooGallery.
UPDATE: Melissa now recommends Photo Gallery by Supsystic instead.
I used the lite version of the GT3 Photo Gallery plugin to build a gallery.
I found that I quite liked the plugin and felt it had some advantages over FooGallery.
- It was easy to use.
- The lite version of the plugin does have quite a few options, including things such as custom borders and margins, and a choice of rectangular, square or circular images for the GT3 Gallery Grid block .
- It has a simple lightbox built into it, so there is no need for a separate plugin.
- I could specify that I wanted to display full size images.
Although some of the plugin’s options are not available in the lite version, on the whole, I was impressed.
Another Alternative – Kadence Blocks
Kadence Blocks is not primarily a gallery plugin, but one of the blocks that it provides to be used with the WordPress block editor is an Advanced Gallery Block.
The gallery was easy to add, it included a built in lightbox and had quite a few options, including being able to use full sized images and being able to link images to custom URLs.
Meow Gallery
After seeing a recommendation for Meow Gallery in a Facebook group, I gave it a try, along with the Meow Lightbox plugin, and found that I liked it. I have used this plugin on the gallery page of my Standard demo site.
Galleries are created and edited directly within a page, rather than having to be added as shortcodes or blocks.
The free version of Meow Gallery did not seem to offer as much control, or as many options as the free versions of either FooGallery or GT3 Photo Gallery, but could still be a good choice if you are after something straightforward.
Also see “WordPress Portfolios and Gallery Plugin Options” by professional photographer, Martin Bailey, in which he talks about why he uses Meow Gallery and Meow Lightbox.
Conclusions
FooGallery has been a favourite of mine for some time and, when I started this exercise, I expected to find that it was the plugin I would be most likely to recommend. However, having played with the alternatives shown above, I feel that if you just need a simple gallery, then you may prefer GT3, Meow or Kadence Blocks.
The plugins I have discussed offer more options than the core WordPress Gallery block. As a comparison, I added a gallery made with the core block to the gallery page of my Standard demo site. This showed the limitations of this block. Since my photos varied in shape, I had to crop them to avoid large gaps and holes in the gallery. However, if your images are all the same shape and you just want a straightforward way to display them, then the core block may be all you need.
Fabulous collection!
I also found one amazing photo gallery-related WordPress plugin called Portfolio Designer Lite. It’s a user-friendly plugin that offers an easy way to add a portfolio to your WordPress website. It comes with Grid Layout and Masonry Layout to showcase your project’s image gallery.