Responsive images with srcset

  • Resolved gjdenhertog

    (@gjdenhertog)


    8 years, 9 months ago

    Since 4.4 WordPress automatically generates responsive images for all img elements using srcset (announcement). This results in images which are not generated statically. Could you build support for these in the next update?

    For now I’ve created my own workaround by altering “class-simply-static-url-extractor.php” on line 164:

    $extracted_urls = explode(',', $extracted_url);
$absolute_extracted_url = $this->add_to_extracted_urls( $extracted_urls[0] );
$element->setAttribute( $attribute_name, $absolute_extracted_url );

    Instead of

    $absolute_extracted_url = $this->add_to_extracted_urls( $extracted_url );
$element->setAttribute( $attribute_name, $absolute_extracted_url );

    https://www.ads-software.com/plugins/simply-static/

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

  • Hi gjdenhertog,

    Yes! Support for srcset is coming soon. I’m glad you’ve found a workaround in the interim!

    Hi gjdenhertog,

    Version 1.2.3 (just released) includes support for the srcset attribute. Try it out and let me know if you run into any issues.

    Best,
    Scott

    Thread Starter gjdenhertog

    (@gjdenhertog)

    Hi Scott,

    It works like a charm, thanks for the quick solution!

    Best,
    Joachim

    Hi Scott,

    I tested out the responsive srcset and found that Simply Static only generate “Large” size image. Below is the example;

    WordPress generated (all sizes down to small thumbnail size 300×300)

    <img class="alignnone wp-image-17 size-large" alt="ebay-1" width="840" height="840"
src="https://localhost/wpstatic/wp-content/uploads/2016/05/ebay-1-1024x1024.jpg"
srcset="https://localhost/wpstatic/wp-content/uploads/2016/05/ebay-1-1024x1024.jpg 1024w,
https://localhost/wpstatic/wp-content/uploads/2016/05/ebay-1-300x300.jpg 300w,
https://localhost/wpstatic/wp-content/uploads/2016/05/ebay-1-720x720.jpg 720w,
https://localhost/wpstatic/wp-content/uploads/2016/05/ebay-1-1200x1200.jpg 1200w,
https://localhost/wpstatic/wp-content/uploads/2016/05/ebay-1.jpg 1240w"
sizes="(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px">

    Simply Static Generated

    <img class="alignnone wp-image-17 size-large" alt="ebay-1" width="840" height="840"
src="https://localhost/wpstatic/static/wp-content/uploads/2016/05/ebay-1-1024x1024.jpg"
srcset="https://localhost/wpstatic/static/wp-content/uploads/2016/05/ebay-1.jpg"
sizes="(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px">

    Both were using same Default Twenty Sixteen theme on WordPress 4.5.2

    Hi jonathlee,

    Thanks for reporting this issue. We’ll have it fixed with the next version of Simply Static, which will be released later this week.

    Best,
    Scott

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Responsive images with srcset’ is closed to new replies.