We are receiving many user requests, notifying us about the blurry image quality on full size sliders and how to fix it. This is not a Gutenslider issue but the reason is WordPress, that generates thumbnail images and serves too low quality images depending on the theme you use. Here, you learn how to fix it.
tl;dr
- Download the Regenerate Thumbnails plugin and execute it.
- Gutenslider will add 4 new image sizes with widths: 1600, 2200,2800, 3400, 4000
- If it does not work add your own image sizes.
Generating Thumbnails
When you upload images to WordPress, many image sizes are generated automatically in order to serve only the quality needed for different screen sizes or use cases. These 4 image sizes are generated automatically:
- Thumbnail size (150 x 150 pixels)
- Medium size (maximum 300 x 300 pixels)
- Large size (maximum 1024 x 1024 pixels)
- Full size (the original size of the uploaded image)
WordPress does this, so you don’t have to keep resizing images manually and to ensure the best image size is selected for different locations on your website.
For example, the image size used in the header of a blog post will be different from the blog post’s thumbnail image.
You see that those image sizes are not suited for large screens as on all screens wider than 1024px the full size image will be served. And not only that, depending on the theme you use, the theme authors can have written code, that tell your WordPress
Changing WordPress Default Image sizes
In addition to the default image sizes, you can also upload your custom image sizes to fit your needs.
Here’s how:
- Go to your WordPress Admin Dashboard
- Click on Settings – Media
- In the Media Settings, adjust the default image settings to fit your preferences
- Click Save Changes to confirm
The other way to do it is by adding the Regenerate Thumbnails plugin. As Gutenslider already adds more image sizes to your page, it will most likely just work after running the plugin, if not, please contact us in the WordPress support forum.
