Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: Why does Shopify alter my custom HTML and CSS target attributes?

Why does Shopify alter my custom HTML and CSS for new window links?

fuegoyhumo
Tourist
9 0 1

I am using the Dawn theme up to date and have written custom HTML and CSS on one of my pages.

 

I simply wanted my buttons to open in a new window so I added the attribute "target=_blank". After saving, shopify automatically added this

 

data-sanitized-

 

to my target attribute (see below) rendering it useless and my links still opening in the same tab. It also removed the rel="noopener noreferrer" attribute I had added after target="_blank" for good measure.

 

<div class="rich-text_buttons"><a data-sanitized-target="_blank" href="https://goo.gl/maps/SehrJSk6ECbtDvXN8" class="button button--primary" style="color: rgb(var(--color-button-text));">Google Maps Link</a></div>

 

Why is this happening and how do I get shopify to stop?

Replies 6 (6)

jdshaw
Visitor
1 0 0

Same thing is happening to me. Must be a glitch with shopify. It's actually adding "data-sanitized-" to a lot of things. This is causing some things to break (example: target="_blank") and others still work as they should.

 

Upon save this is a snip of our code:

 

<!-- Button trigger modal --> <button type="button" class="storieslink font-weight-normal" data-toggle="modal" data-sanitized-data-toggle="modal" data-target="#alyssabio" data-sanitized-data-target="#alyssabio"> Read Bio </button> <!-- Modal -->
<div class="modal fade" id="alyssabio" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" data-sanitized-aria-labelledby="exampleModalLabel" aria-hidden="true" data-sanitized-aria-hidden="true">

AHuser
Tourist
3 0 8

Same thing here. All my codes are infected with "data-sanitized-" which is affecting the behaviour of my attributes (especially the target attribute)! No matter how much I clear the code, this reappears every time I save my page. Hoping that Shopify fixes this soon...

TothDigital
Shopify Partner
22 1 7

Same issue here

paulatemijay
Shopify Partner
1 0 0

I'm not sure if you were able to solve it on your own, but I found that adding rel="noopener" after target="_blank" worked for the links on the page I was trying to keep from being data-sanitized.

nuwud
Shopify Partner
24 1 4

I had this issue and it turned out to be a missing quotation mark in an earlier part of my script.

Kindest Regards,
Nuwud

nurfz
Tourist
6 1 1

I just asked the Shopify support. It's intended and they don't want to change the behavior:

 


Thank you for your patience! I have reviewed this with the team and as it turns out, Shopify does sanitize certain HTML attributes, including "target="_blank", for security reasons to minimize potential risks such as phishing attacks. Unfortunately, there is no direct solution for this within the Shopify platform. If you need a link to open in a new tab, you could suggest users to right-click the link and select "Open link in new tab" as an alternative.