Home Forums Basel support forum Served Scale Images

Served Scale Images

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #49521

    eroweglana
    Participant

    Hi, I’m having a issue with serving scaled images on pagespeed testers.

    I need to have it set so that all Product Images/ Product Category images are set to Medium (258x 258) and all thumbnails (ie. in widgets) are set to 150 x 150 in order to Serve scaled Images properly on my site in order to get the best pagespeed rating possible.

    Media Settings:
    Thumbnail Size: Max Width: 150 Max Height: 150
    Medium Size: Max Width: 258 Max Height: 258
    Large size: Max Width: 500 Max Height: 500

    I set above settings and the ran Regenerate Thumbnails plug-in. I selected medium size as 258 x 258 as the featured products on homepage are set to this size. I have since noticed after running GTmetrix tests that images on other pages are served as many different sizes (detailed below).
    I could change medium settings to 263×263 to suit medium product images and regenerate thumbnails but then Featured products on homepage would fail speed test.

    Basically I need served image size to be the same across the site.

    Issue arises with following:

    Featured Categories section on homepage (6 items, 6 Columns, Masonary layout, Space between categories: 2 ) Served Image Size: 225 x 225

    Product Category Pages 4 items across. Served image size: 263 x 263
    GTmetrix message: “F060053-Glana-Alu-Safe-Machine-Dishwash-Detergent-20L-1000×1000.jpg is resized in HTML or CSS from 1000×1000 to 263×263. Serving a scaled image could save 75.7KiB (93% reduction).)”

    Image has since been resized using WP Smush Pro from 1000×1000 to 500×500, but above GTmetrix message states image was resized from 1000×1000. Why could this be?

    Individual product Page:

    Main Product Image: size served 404×404 yet Product page image size set to Medium in settings.
    Products side widget: thumbnail images served at either 50×50 or 60×60
    Related products: served image size: 263×263

    Can you please advise?

    Regards
    Eugene

    #49624

    Hello,

    WooCommerce has removed the option to set image sizes from the recent versions. If we force image sizes by CSS code they would not be adaptive and may be deformed. Our theme does not influence the WooCommerce functions and options, at the same time our theme provides the possibility to unify images. So, navigate to Appearance > Customize > WooCommerce > Product Images > configure by your needs as shown here: http://prntscr.com/ixlgke

    As for images optimization, setting images sizes for thumbnails and other would not improve your score in page speed testing. For this purpose, you need optimize images. You can optimize images in two ways: http://optimizilla.com/ upload your images and get them optimized for free; another way to find WordPress image optimizing plugin.

    Best Regards

Tagged: , ,

Viewing 2 posts - 1 through 2 (of 2 total)