Envira Gallery Blog

Digital Photography Tips, Tutorials and Resources

Change the Default Thumbnail Size

How to Change the Default Thumbnail Size for Your Image Gallery

by Waseem Abbas on May 29, 2017

Do you want to change the size for thumbnails of your image gallery? You may know that thumbnails are generated on the basis of proportion according to the size of the image. With the help of an image gallery plugin like Envira Gallery, you can change the default settings easily. In this tutorial, we will share how to change the default thumbnail size for your image gallery.

Having multiple photos in your image gallery with different thumbnail sizes and proportions is normal. However, sometimes you need to fix a size for all the photos. We recommend you to use Envira Gallery plugin. Envira Gallery has amazing features to fulfill all your requirements for an image gallery.

To change the default thumbnail size for your image gallery, you’ll need to follow these 4 steps:

  • Step 1. Install and activate Envira Gallery plugin at your site
  • Step 2. Create an image gallery using Envira
  • Step 3. Go to the config settings & select the image size
  • Step 4. Publish the image gallery in WordPress

By the end of this tutorial, you’ll be able to change the default thumbnail size for your image gallery that will look like as shown in this image below:

Change the Default Thumbnail Size

Ready to get started? Let’s go!

Step 1: Install and Activate Envira Gallery Plugin at Your Site

First thing that you need to do is to install and activate Envira Gallery plugin on your WordPress site.

Envira Gallery

You can learn more on how to install and activate Envira in WordPress.

Step 2: Create an Image Gallery Using Envira

After activating the plugin, you need to go to Envira Gallery ยป Add New to create a new image gallery.

Lets start by adding the title, and add photos to the Native Envira Gallery section.

Vintage Old Style Thumbnails

You should also check out our guide on how to create an image gallery with thumbnails in WordPress.

Step 3: Go to the Config Settings & Select the Image Size

Once you have added the photos, go ahead to the Config tab. You need to scroll down to Image Size and select your size in the dropdown.

Image Size

This will fix the image size for thumbnails. However, you need to make sure that Automatic Layout: Row Height has set in proportion for your image size.

As we select Medium 300×300 for Image Size, so we need to set the Row Height to 300. Otherwise, Image Size won’t effect the thumbnails.

Row Height

Image Size and Automatic Layout: Row Height will work proportionally, so you need to change the figures every time you change the image size to see the output.

Upon changing the settings, you can hit the Publish button.

Step 4: Publish the Image Gallery in WordPress

When the image gallery is published, you’ll notice a new Envira Gallery Code widget under the Publish widget. You need to copy the shortcode from this widget.

Copy Shortcode

Now go to the Pages/Posts ยป Add New or edit an existing page/post in your WordPress backend. In the visual editor, you need to paste the shortcode.

Add Shortcode

Make sure to Publish the page/post.

You can visit your site to see the fixed thumbnail sizes for your image gallery that will look like as shown in this image below:

Change the Default Thumbnail Size

That’s all. We hope this tutorial has helped you to learn how to change the default thumbnail size for your image gallery. You may also want to check out our guide on how to stop WordPress from generating image sizes & the ultimate guide to email marketing for beginners.

If you like this tutorial, then please follow us on Facebook and Twitter for more free WordPress guides, tips and resources.

Comments

  1. This only works if you set your gallery to automatic. What happens if you want a grid gallery and want it to be 3 columns wide with all the images the same height?

  2. This doesn’t quite do what I’m looking for. Is there a way to set the gallery to create thumbnails that are proportional to the image rather than cropped? I’d like small versions of the image if possible.

    1. Hi Nick ๐Ÿ™‚ The only way to guarantee an exact width and height for all images would be to use either cropping (recommended) or CSS. Now if you use CSS – your images could appear stretched or pixelated and this is why we recommend cropping. All images that aren’t cropping are proportionally resized based on the columns set (or Row Height). So the height is set to auto so the images remain responsive. The only other way to get that would be to make sure the images uploaded are exactly the same width and height (using a photoshop template for example). If you have any other concerns or trouble, please feel free to reach out to support!

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.