[maxbuzz]

Hi,

Does the gallery apply transformations on the thumbnail images?
They look quite fuzzy in the thumbnails, though the full image looks fine.

[WP Travel]

If your image appears to be blurred and pixelated then you can define the minimum size of the thumbnail as 600×600 px or try increasing the dimensions ( width and height ) of your Thumbnail size by going to Admin Panel > Setting > Media.

Also please regenerate your thumbnail after changing the image size by using the plugin given below for the best result:

https://wordpress.org/plugins/regenerate-thumbnails/

[maxbuzz]

Hi,

My current setting is 150×150, what the gallery shows is 350×350.
Instead of increasing the thumbnail size I would prefer toning it down to about 250×250.
So is there a way I can prevent gallery from upsizing the thumbnails?

Is there a way I can increase the number of columns also?

[Support Team]

Hello @maxbuzz,

To resolve the issue, please add below given CSS by going to Admin Panel > Appearance > Customize > Additional CSS.

#gallery .item img {
    width: 250px;
}

Hope this helps.

Let us know if you have any issue further.

Thank you.

[maxbuzz]

Hi,

That didnt make any difference. Thumbnails still 350×350

[Support Team]

Hello @maxbuzz,

Once try adding below given CSS by replacing that we have provided.

#gallery .item img {
    width: 250px!important;
}

If this does not work then go to Admin Panel > Setting > Media > Thumbnail and update the thumbnail size to your desired one and save the setting.

https://prnt.sc/oazl4i

Then regenerate the thumbnail using the plugin mentioned above.

Hope this helps.

Let us know if that works or not?

Thank you.

[maxbuzz]

Nope, no change..

[Support Team]

Hello @maxbuzz,

If these steps are not working then we need your site URL so that we can inspect the issue further and help you.

So, please provide your site URL.

Hoping to hear from you soon.

Thank you.

[maxbuzz]

This is not yet on a public url, so please do suggest some other solution.
Thanks

[wensolutions]

Hello @maxbuzz,

Since we could not replicate the issue, we are unable to help you with this.

So once your site is live, kindly let us know and we will help you further.

Thank you.

[maxbuzz]

Can I use any other gallery in place of this one?

[maxbuzz]

Hi,

Once try adding below given CSS by replacing that we have provided.

#gallery .item img {
width: 250px!important;
}
If this does not work then go to Admin Panel > Setting > Media > Thumbnail and update the thumbnail size to your desired one and save the setting.

https://prnt.sc/oazl4i

Then regenerate the thumbnail using the plugin mentioned above.

Hope this helps.

Let us know if that works or not?

This will not work as the size of 365×215 is hardcoded in the function add_image_sizes, and nowhere defined in CSS.
So what happening is whatever size the thumbnail has been created this is upscaling to display as gallery thumbnail. As its upscaling the images are losing their clarity and making the page look poor.

Please move the size definition to CSS or look at some other way to ensure that thumbnails look good.

[Support Team]

Hello @maxbuzz,

We will definitely make the enhancement in the thumbnail size.

As for the solution, the size can be modified using the filter available in the plguin.

So you can add below given code in your child theme’s functions.php file.

function wp_travel_thumbnail_size($sizes){
 
 $sizes['width'] = 250;
 $sizes['height'] = 250;
 return $sizes;

}

add_filter('wp_travel_image_size','wp_travel_thumbnail_size');

function wp_travel_gallery_image_size( $image_size ) {
	return 'wp_travel_thumbnail';
}
add_filter('wp_travel_gallery_image','wp_travel_gallery_image_size');

Hope this helps.

Thank you.

[maxbuzz]

Hi,

Many thanks for providing this. Here is my experience with adding that to the child theme.

1. I changed the thumbnails to 250×250 as that’s what I had put in the functions.php and regenerated the thumbnails.
The thumbnails were now rectangular and not square and therefore cropped. But I was happy that at least they were sharp. This is how it looked
https://tinyurl.com/y4mxt32t

and the 1st image in the gallery.
https://tinyurl.com/y3l4cn8z
Note there is no noticeable deterioration in the thumbnail

2. I got more greedy and changed the thumbnail size to 300×300 and regenerated the thumbnails. To my shock and dismay, it was now back to the original state.
changing back to any other size now seems to have no effect.
I have viewed this on different computers, clearing the cache, etc but there has been no effect.

You can now see that the thumbnail is large (365 px) and quality is poor
https://tinyurl.com/yy98cny3
as compared to the image in gallery https://tinyurl.com/y3l4cn8z

The thumbnails that are affected are in “post filter section” of frontpage
https://tinyurl.com/yyskjmt2

and ‘featured trips’ section of frontpage
https://tinyurl.com/y34c59f9

apart from the gallery in ‘trip’ as described above.

Apart from that other thumbnails seem to be ok

My understanding is that whatever you define in function.php is getting overruled by some settings that define thumbnail sizes based on display size (large, medium, small..)
Irrespective of what you set in functions.php the thumbnail size is 365px when the display is wide, as window size decreases the thumbnail size reduces to 280px until the number of thumbnails displayed in the window switches to 1 and the width becomes 450px.
So the solution would probably have to address this.

[Support Team]

Hello @maxbuzz,

Also, after adding the code make sure to regenerate all the images using the thumbnail regenerating plugin.

This should resolve the issue.

Also, your site setting environment seems to generate quite a bit issue so this might be one of them as only changing the thumbnail size should work fine.

Thank you.

[Author]

Posts