SOLVED

(Part II) Weird Outlook issues with VML button

Go to solution
Guitarrista82
Level 5

(Part II) Weird Outlook issues with VML button

Here is the second part of my VML button issues saga.

 

We want to primarily use this button as a Call-to-Click button AND be able to track the links.

 

Again, here is what the button should look like:

Guitarrista82_0-1663873526362.png

 

I read the discussions in Community about making C-to-C buttons trackable and did what was instructed by adding the tel:+  to our {{lead.Brand CallTo}} token and unchecking the Include mkt_tok box as shown below:

Guitarrista82_0-1663873994674.png

 

 

<!--[if mso]>
          <a:roundrect xmlns:a="urn:schemas-microsoft-com:vml" 
xmlns:w="urn:schemas-microsoft-com:office:word" href="{{lead.Brand Phone MX - Nationals CallTo}}" target="_blank" style="height:48px; v-text-anchor:middle;width:180px;" arcsize="15%" strokecolor="{{Lead.Brand Primary Color}}" fillcolor="{{Lead.Brand Primary Color}};width: 180;"> <w:anchorlock/>
<center style="color:#ffffff; font-family:'Helvetica', Arial, sans-serif; 
font-size:16px; font-weight: 600;">Call&nbsp;<span style="text-decoration: underline;">{{lead.Brand Phone}}</span></center>
           </a:roundrect>
        <![endif]-->
<div><a href="tel:+{{lead.Brand CallTo}}" target="_blank" style="display: inline-block; mso-hide: all; background-color: {{lead.brand primary color}}; color: #ffffff; border: 1px solid {{Lead.Brand Primary Color}}; border-radius: 8px; line-height: 48px; width: 180px; font-family: 'Helvetica', Arial, sans-serif; font-size: 16px; font-weight: 600; text-align: center; -webkit-text-size-adjust: none; text-decoration: none;">Call&nbsp;<span style="text-decoration: underline;">{{lead.Brand Phone}}</span></a></div>

 

 

However, the following issues arose--again in Outlook--ugggh.

 

In Outlook.Office.com:

 

You can see that this extra text gets added below the button )-:

Guitarrista82_1-1663873684791.png

 

In Outlook Desktop:

I click on the button, but the link is not clickable, i.e., nothing happens.

 

I made a short video below:

 

https://www.awesomescreenshot.com/video/11259155?key=87888e44b4af06663486a6c1748b1101

 

Any help is appreciated.

 

LK

1 ACCEPTED SOLUTION

Accepted Solutions
Dave_Roberts
Level 10

Re: (Part II) Weird Outlook issues with VML button

Hey Laura,

 

It looks like the href="" in the VML code is set to: 

href="{{lead.Brand Phone MX - Nationals CallTo}}"

rather than 

tel:+{{lead.Brand CallTo}}

 

That might be the issue here -- maybe that token isn't set with a value or something?
You might also try dropping the "+" and seeing if that makes any difference for you?

View solution in original post

2 REPLIES 2
Dave_Roberts
Level 10

Re: (Part II) Weird Outlook issues with VML button

Hey Laura,

 

It looks like the href="" in the VML code is set to: 

href="{{lead.Brand Phone MX - Nationals CallTo}}"

rather than 

tel:+{{lead.Brand CallTo}}

 

That might be the issue here -- maybe that token isn't set with a value or something?
You might also try dropping the "+" and seeing if that makes any difference for you?

Guitarrista82
Level 5

Re: (Part II) Weird Outlook issues with VML button

Hi Dave!

 

You nailed it, that was the issue!

 

Thank you so much...It's working great now 😄

 

Best regards,

LK