• Resolved phil92

    (@phil92)


    Hello Cumminity! ??

    My name is Philipp and i’m a (still learning) web-developer.

    Currently i’m working with WP and Timber. As i stumbled upon responsive images i couldn’t simply ignore to add my custom image sizes to WP.

    As i did so via add_image_size, “Regenerate Thumbnails” obviously noticed my new image size and re-generated the media.

    Code to add image size:

    if(function_exists('add_image_size')) {
    add_image_size( 'slider-cropped', 500, 500, true );
    }

    This one is triggered with the ‘after_theme_setup’-hook and the function is called after the ‘add_theme_support(‘post_thumbnails’)’-function.

    I am working with srcsets, thus i expected my new image src to be appended to my srcset automatically. This actually is not what’s happening.
    As i call my images srcset in my template, only WP standard sizes are shown.
    I’m returning image-arrays from an ACF-Gallery-field.

    As i call the new image size by name,
    ‘{{Image(img).src(‘slider-cropped’)}}’
    respectively, the image is shown. Nevertheless i want WP to add it automatically to my srcset.

    I’d appreciate any help, i’m stuck here for a long long time and read like all posts anywhere on this topic.

    Thanks in advance,
    Philipp

Viewing 2 replies - 1 through 2 (of 2 total)
  • If I remember correctly, ACF out of the box doesn’t support srcset properties for custom image dimensions.

    See this post for workarounds: https://joetower.com/2017/06/understanding-and-extending-wordpress-srcset-functions/

    Thread Starter phil92

    (@phil92)

    Hello George,

    thank you for your answer. ??

    Indeed it does, but the aspect ratio has to be the same as the one from the original src-image, that’s what i found out looking for further information.

    Given that, now that i cropped my image and changed the ratio this way, it won’t be included in the srcset automatically.

    My workaround for this scenario now:
    “Hardcode” those few sizes i have, because they’re still available in my image-object.

    srcset="{{Image(image).src('slider-small')}} 400w, {{Image(image).src('slider-medium')}} 600w, {{Image(image).src('slider-large')}} 900w"

    Really appreciate your will to help. ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Responsive Image srcset not complete’ is closed to new replies.