CTA Anchor Link being dropped in Safari

SOLVE
prileyINFORMS
Participant

I've placed a link CTA with an anchor ID  to scroll down the page on an external page. In Chrome and Firefox, the anchor ID is pulled through, the page is reloaded, and the page scrolls down to the anchor ID. In Safari, however, the anchor ID is not being pulled through with the CTA. Any idea on what to do for this?

 

URL: http://meetings2.informs.org/wordpress/2019international/submit/

CTA: Need some tips on submitting?

Anchor ID: #tips

 

I realize CTAs are not currently designed with anchor ID use in mind but I have to agree with the users in this forum post that it would be very useful to have. 

CTA
1 Accepted solution

Accepted Solutions
Ben_M
Solution
Key Advisor

Admittedly I do not use a ton of CTAs, but the reason anchor tags don't work based on the code is the anchor link is stored within data variable on the link ( cta_dest_link="http://meetings2.informs.org/wordpress/2019international/submit#tips" ). Because this is not the "href" value where the redirect is happening the page reloads and redirects.

 

In further examining the code, the anchor is actually utilizing a data attribute likely tied to a script (data-anchor) instead of the HTML standard anchor which would be id="anchor" as this the valid way to write an anchor link in HTML utilizing the DOM element. My thought is that the new page load isn't triggering the data-* attributes on the new page load. Try adding id="tips" to that "div" element where you have the data-anchor code and see if that helps Safari.

 

If that doesn't work, can I ask if you are using anything in Hubspot based on this CTA action, or is it just to see how many people click? If it is just to see how many people click and you have Google Analytics or another analytics platform tied into these pages, you could use Event based tracking to see how often a link is clicked on a page.

View solution in original post

2 Replies 2
Ben_M
Solution
Key Advisor

Admittedly I do not use a ton of CTAs, but the reason anchor tags don't work based on the code is the anchor link is stored within data variable on the link ( cta_dest_link="http://meetings2.informs.org/wordpress/2019international/submit#tips" ). Because this is not the "href" value where the redirect is happening the page reloads and redirects.

 

In further examining the code, the anchor is actually utilizing a data attribute likely tied to a script (data-anchor) instead of the HTML standard anchor which would be id="anchor" as this the valid way to write an anchor link in HTML utilizing the DOM element. My thought is that the new page load isn't triggering the data-* attributes on the new page load. Try adding id="tips" to that "div" element where you have the data-anchor code and see if that helps Safari.

 

If that doesn't work, can I ask if you are using anything in Hubspot based on this CTA action, or is it just to see how many people click? If it is just to see how many people click and you have Google Analytics or another analytics platform tied into these pages, you could use Event based tracking to see how often a link is clicked on a page.

View solution in original post

prileyINFORMS
Participant

Good thought on just using Google Analytics. That is likely much simpler to implement for this. Thanks!

0 Upvotes