I’d need to be able to examine the actual page to be able to be more confident in my answer.
The image size settings control the size of the image which is sent from your webserver to the user’s browser. The browser then resizes the image to fit the space on the page. The space size is set by your theme’s stylesheet and any plugins. It looks like the browser is stretching the image to fit the space, hence blurring it.
So, the starting point is to use the browser’s inspector to find out what size the image is being displayed at, then set the same size in settings. You don’t need to be exact, just close. Do this for each of the three use cases. Finally regenerate thumbnails.
Thread Starter
jeanzz
(@jeanzz)
hi. i have tried to inspect it, but still not really sure where is the thumbnail size located at, as shown here >> https://pasteboard.co/GINx3qq.png
Could you help to look into it again to see how to rectify please? the actual link is here >> http://www.mod.sg/product/butterfly-sky/
-
This reply was modified 8 years, 8 months ago by
jeanzz.
Yes, the thumbnails are being displayed by your theme at 122px square and it looks like your thumbnail setting is 45px square. So the images are being stretched from 45px to 122px which is a lot and they will be blurred. So set the thumbnail size to 122px square and run the regenerate thumbnails tool.
Thread Starter
jeanzz
(@jeanzz)
i suppose if i set it to 122px, the thumbnails will look bigger which its not very appealing. alternatively, is it possible to set the theme thumbnail to be displayed at 45px square ?
Setting the size in settings won’t change the final size because this is set by the browser. However, sending a better image to the browser will make them look better.
45px will be too tiny to make out.
Thread Starter
jeanzz
(@jeanzz)
understood lorro. problem solved. appreciate your help! 🙂