简体   繁体   中英

Anchor links only working in browser but not in in HTML email (Outlook)

I have an HTML email generated from a Windows application. The template used for this is designed in .aspx page. The email has some links at top of the page which should take the user to a detailed description to the end of the same email. This works fine in the browser but doesn't work in Outlook.

<a href="#Wickr raises $9 mln as Alsop Louie, Juniper Networks invest | Reuters">Wickr raises $9 mln as Alsop Louie, Juniper Networks invest | Reuters</a>

The above anchor tag, when clicked, should go here

<b id="Wickr raises $9 mln as Alsop Louie, Juniper Networks invest | Reuters" class="sectionheadline">Wickr raises $9 mln as Alsop Louie, Juniper Networks invest | Reuters</b>
<br>
in.reuters.com—March 03, 2014
<br>
<br>
&quot;BOSTON, March 3 (Reuters) - Alsop Louie Partners led a $9 million investment in Wickr, a San Francisco-based startup founded by privacy advocates in 2012 that produces a mobile app for sending self-destructing text, photo and video messages. Gilman...<br><br>.

In View source the id in tag and href in tag match, but in an email when hovered over the link the address has '_' instead of spaces, which is why the links are not working.

So you have coded your anchor tags like such:

<a name="test">Wickr raises $9 mln</a>
<a href="#test>Wickr raises $9 mln</a>

And this is still not working? You should also have a look at campaign monitor for supported browsers. I haven't coded emails in a while, but I remember it was always quite a hassle.

I found that placing the tag

<base href="" />

in the head section worked for me (Outlook 2013) with the standard anchor tag. I found this fix on this page CampaignMonitor

I tested the following code in Outlook2007 and Outlook2013. It works.

The anchor tag:

<a href="#Test Link">Test Link</a>

And the Target:

<p><a name="Test Link"></a>Test Link</p>

The id/name attribute is like a variable name, for more cross compatible support it really should not have symbols or spaces in the first place.

Think how that would look in the address bar:

  • webpage.html#Wickr%20raises%20%249%20mln%20as%20Alsop%20Louie%2C%20Juniper%20Networks%20invest%20%7C%20Reuters%20

So I guess the silly answer is not to use spaces... That being said, I've noticed both outlook and winword will edit your hyperlink in different ways depending on the prefix "File:" or "http:". Hopefully that helps.

While they work in just about every browser, support for anchor links is a mixed bag in email clients . Even though that link says Outlook 2007 (2010 and 2013 are the same) support anchor links, their behavior is unreliable at best.

Simplifying the anchor's <a href=""> increases your coverage. Eg changing something like this:

<a href="#Wickr raises $9 mln as Alsop Louie, Juniper Networks invest | Reuters">Wickr raises $9 mln as Alsop Louie, Juniper Networks invest | Reuters</a>

to this:

<a href="#first">Wickr raises $9 mln as Alsop Louie, Juniper Networks invest | Reuters</a>

Email clients might trip over spaces and special characters.

Sample PDF

'<base href="" />' 

Adding the base tag in header and add the name attribute in anchor work for me

Try to always give http at the start of the URL as follows,

<a href="http://www.website.com/"></a>

If not it will not work in outlook. It worked for me. Hope this helps!

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM