Change size of thumbnails images

In some cases, you may need to change the sizes of the thumbnails images for a better display. This article will show you how to do it. In order to imagine easily, please take a look at this example.

The Smart Content Box- Small carousel layout is designed for page layouts which have at least a sidebar. But if you use it for a full-width page (page without sidebar), the SBC shortcode still loads the small size of thumbnail images as default, then the images are blurred. The solution is that we will add a small custom code to increase the image sizes.

 

As you can see, the thumbnail images look sharper.

How to change the size of the images.

1. Increase the dimension
Add this code to themes\truemag-child\functions.php

add_action( 'after_setup_theme', 'wpdocs_theme_setup' );
function wpdocs_theme_setup() {
add_image_size('thumb_180x101',278,157, true); //scb small
}

In this case, thumb_180x101 is the value which is used Smart Content Box- Small Carousel layout. Change that value according to the corresponding layouts. You can check other values below in functions.php file.

add_image_size('thumb_139x89',139,89, true); //widget
add_image_size('thumb_365x235',365,235, true); //blog
add_image_size('thumb_196x126',196,126, true); //cat carousel, related
add_image_size('thumb_520x293',520,293, true); //big carousel 16:9
add_image_size('thumb_260x146',260,146, true); //metro carousel 16:9
add_image_size('thumb_356x200',356,200, true); //metro carousel 16:9 bigger
add_image_size('thumb_370x208',370,208, true); //scb grid 16:9
add_image_size('thumb_180x101',180,101, true); //scb small
add_image_size('thumb_130x73',130,73, true); //mobile
add_image_size('thumb_748x421',748,421, true); //classy big
add_image_size('thumb_72x72',72,72, true); //classy thumb
add_image_size('thumb_358x242',358,242, true); //shop

2. Install and activate this plugin, Go to Tools- Regen. Thumbnails to regenerate the images.
https://wordpress.org/plugins/regenerate-thumbnails/