1

I have an issue where the src attribute suddenly is missing from img tags when using the built in Responsive Image in SXA 1.9 on Sitecore 9.2. However the alt, srcset and sizes attribute works as expected.

Debugging the code shows the src attribute being added to the HtmlImage in CreateResponsiveImage in the RenderVariantField pipeline.

Creating a clone of the Pipeline allows me to add other attributes to the HtmlImage and they also get rendered without a problem.

That makes me believe that there is something removing the src tag later on in the rendering of the page, but I can't figure out what. Any ideas?

Edit: Issue has been reproduced in a blank Sitecore environment. It happens when a Responsive Image is added as a child to a Section in a Rendering Variant. Then the src attribute is missing. Pictured below is two responsive images, one of which is wrapped in a Section.

enter image description here

Improve this question
1
  • I'm experiencing this same problem on the last version of SXA 9.3, if the responsive image is placed inside a section/scriban the src attribute is stripped from img, there are any fix available or a specific reason to this behavior? Otherwise i will be forced to change all rendering variants that use responsive image field because in IE11 the images are not shown without src.
    – Tiago
    Jan 9, 2020 at 12:52

1 Answer 1

Reset to default
1

The src attribute of an <img> tag generated by Responsive Image variant item stores the media item URL (generated using GetMediaUrl() method of BaseMediaManager). So the Field name field needs to point to a field of type Image on your item:

enter image description here

That media URL can be modified when you will full the Default size. In such a case, the media URL will have additional w parameter. Looks like it works fine:

enter image description here

Improve this answer
4
  • Yes, that is the case. However same url that is used for src is used to buildup the srcset sizes, and there the url is shown. Also when debugging I can see a correct src is set on the HtmlImage, but then when outputed on the page the src attribute is missing.
    – webbson
    Oct 1, 2019 at 5:05
  • @webbson Do you have any custom logic?
    – Dawid Rutkowski
    Oct 1, 2019 at 6:45
  • No we don't have. However I have been able to reproduce the issue in a blank install now and pinpointed the issue. When a Responsive Image is placed as a child to a Section the src attribute is stripped from it.
    – webbson
    Oct 1, 2019 at 13:03
  • I remember something in our backlog recently. There is a change it is already solved in the latest code.
    – Dawid Rutkowski
    Oct 1, 2019 at 13:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.