Do you have a website and you don’t understand why the thumbnails in the gallery or in the WooCommerce product area appear pixelette and fuzzy? In the following guide we will explain how in a few simple steps you everything will work out easily.
Regenerate Thumbnails Installation
If it’s on an existing site with photos uploaded to the system, then the first thing to do is install the Regnerate Thumbnails plugin and activate it. This plugin allows you to re-crop all the images that are in the site into new sizes, of which you will set in the following steps.
Media Setting in WordPress
The built-in WordPress galleries display the thumbnails that are set in the the media settings. Go to Settings > Media > Thumbnails > Usually it is set to 150 * 150 pixels, which is what causes galleries with larger images to be pixelette, so simply just set it to any size you want, for example: 250 * 250 pixels.
WooCommerce Images Settings:
Like WordPress, in WooCommerce there are sizes that can be changed to your needs, note that there should be 3 image sizes changed here:
- Catalogue Images: Displayed in the store page, category and tag pages, and shortcodes
- Single Product Image: The main image displayed in the product page
- Product Thumbnail Images: The images displayed below the the main image in the product page
If these photos are pixelette, simply magnify them.
Re-Cropping Images
Now, after you had set the new sizes, you need to crop all the images that have been uploaded again. For that exactly you installed the Regenerate Thumbnails plugin.
Go to > Tools > Regenerate Thumbnails > and click on the Regenerate All Thumbnails button – now all your images will re-cropped and the new sizes will be adjusted.
That’s it, now all the thumbnails in the site should get the new size you set for them.
Good Luck.