Big images quality drop

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hi mychristina. The theme is using the default thumbnail “thumb-large” which is 720x340px. Your site is stretching that image to 1380×652; almost twice the size of the thumbnail. Pixelation would be the expected outcome of that enlargement.

    The displaying size is a bit bigger than the original

    If that’s true then one way to approach it would be to copy the function that creates the theme thumbnails to your child theme:

    function hu_setup() {
	// Enable title tag
	add_theme_support( 'title-tag' );

	// Enable automatic feed links
	// => Adds RSS feed links to <head> for posts and comments.
	add_theme_support( 'automatic-feed-links' );

	// Enable featured image
	add_theme_support( 'post-thumbnails' );

	// Enable post format support
	add_theme_support( 'post-formats', array( 'audio', 'aside', 'chat', 'gallery', 'image', 'link', 'quote', 'status', 'video' ) );

	// Declare WooCommerce support
	add_theme_support( 'woocommerce' );

	// Thumbnail sizes
	add_image_size( 'thumb-small', 160, 160, true );
	add_image_size( 'thumb-standard', 320, 320, true );
	add_image_size( 'thumb-medium', 520, 245, true );
	add_image_size( 'thumb-large', 720, 340, true );

	// Custom menu areas
	register_nav_menus( array(
	  'topbar' => 'Topbar',
	  'header' => 'Header',
	  'footer' => 'Footer',
	) );
}

    Then change the thumb-large size to whatever your image size is, for example:

    add_image_size( 'thumb-large', 1200, 565, true );

    Then install and run this plugin:

    https://www.ads-software.com/plugins/regenerate-thumbnails/

    If your original image is only a bit smaller than 1380×652 you’re still going to get a little pixelation, but not near as much. Ideally the original image should be 1380×652 or larger, and you would set the thumb-large size to be 1380×652. Also note that thumb-large is used in other parts of the theme. In those places, although the image will be downsized to fit the element, your site will be downloading the larger image each time.

    Thread Starter mychristina

    (@mychristina)

    Oh I see. So even if I am using the bigger image, the website will downscale it to 720 and then stretch it? That explains the quality loss.

    Will try your sugestion! My featured images on single posts are always the correct size, so I suppose that loading a large image won’t be a problem other than in pages, right?

    • This reply was modified 8 years, 2 months ago by mychristina.

    If you change the thumb-large to a larger size, that size of the image will be downloaded in each place the theme uses the thumb-large image. That image is then resized to 100% of the content width. The default thumb-large width of 720px is the same size as the content area when you have two sidebars. So, in that case, no resizing takes place. In your case, with the larger size, the image will be downsized to 100% of the content area width.

    Thread Starter mychristina

    (@mychristina)

    Once again, a genious. That did the trick!

    • This reply was modified 8 years, 2 months ago by mychristina.
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Big images quality drop’ is closed to new replies.