Adding attributes to a linked SVG icon

I am working through a compliance report and it was noted that all SVGs should have aria-hidden="true" added to the attributes.

I attempted to do this using the bricks/element/render_attributes filter but it appears that this is only applied to the link and not the SVG itself. According to this thread, this functionality was updated in 1.7 so that attributes are applied to the link instead of the SVG. Is there no way to add attributes to a linked SVG other than unlinking and creating a linked block container?

2 Likes

Hey,

Did you manage to solve this? Im also wanting this.

I ended up adding the attribute manually in the icon element. If you have svgs that you cannot access, you can use the following JS:

document.addEventListener("DOMContentLoaded", function(){
    let svgs = document.querySelectorAll('.brxe-logo svg,.brxe-block a svg,.brxe-button svg');
    svgs.forEach((svg) => svg.setAttribute('aria-hidden','true'));
});