Thumbnail Fill

For most of your galleries, where you have a set thumbnail dimension, your thumbnails will use the gallery images to fill the available space. This means that your images will be cropped to fit the thumbnail. If, however, you want to show the entire image in the thumbnail then you can do so by changing the Thumbnail Fill setting.

This will usually mean that your image won’t fill the entire thumbnail, leaving empty spaces on the sides. To improve the appearance of this, we’ve given you the option of filling this space with a color.

This will give you a gallery that looks something like this:

thumbnail fill example

Using Thumbnail Fill

To implement this, you’ll first need to set this up in the FooGallery Settings. Go to FooGallery > Images > Background Fill and enable this option. You can then set the default color (or use Auto or Transparent).

Now go to the Advanced tab in your gallery settings. Under Thumbnail Cropping, select Background Fill (No crop). You will now have 4 options for the background color:

  • Inherit: this will inherit the color set in Settings > Images > Background Fill Color.
  • Auto: the color is selected based on the image.
  • Transparent: the color is transparent.
  • Custom: selecting this will open a color picker from which you can set the background color for that gallery.

Once you have chosen a color, update the gallery to reflect your changes.

Background fill with color

This feature is available for  FooGallery PRO Expert and FooGallery PRO Commerce.