Solved

Change web_view link colour in custom html template

  • 1 June 2023
  • 2 replies
  • 491 views
C
Rank
Badge +2

Hi there,

I would like to change the colour of the web_view link from blue to white on my custom html template. Is it possible to do this in Klaviyo’s editor? 

My code is below. Any help would be great! Thank you!

 <table cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">                                
                                <tr>                                  
                                  <td align="right" style="padding:0;Margin:0">                                    
                                    <p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:roboto, 'helvetica neue', helvetica, arial, sans-serif;line-height:17px;color:#ffffff;font-size:11px">
                                      {% web_view %}
                                    </p>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                        </table>

icon

Best answer by retention 1 June 2023, 02:28

View original

2 replies

retention
Rank
Userlevel 7
Badge +58

Hi @Cathy_Sydney - welcome to the community!

It should be possible to change the link color, the easiest way to do this is “globally” from the general Style section of your template. You can set that here in the “Styles” tab under Links → Text Color.

If you want to change the color the link of the web_view separately then the colors of links elsewhere in the template, you can try using the {% web_view_link%} variable instead of the {% web_view %}. 

This code just gives the URL so you can then use it in your own HTML with greater inline styling control like this:

This is a fancy <a href="{% web_view_link %}" >web view</a>  link.


From here, you can edit the color the Link using the editor tools or your own HTML code.  Just note, some email clients will ignore link color settings (and use the email client’s preferred color) so it can vary.  

Hope this helps!

 

Joseph Hsieh // retentioncommerce.com // twitter: @retention
C
Rank
Badge +2

Hi Joseph,

Thank you so much for the response!

I tried to insert this code: 

<a href="{% web_view_link %}" style="color:rgb(255,255,255);">View in Browser</a> 

which did work to create a white link, however, when I ran a test send campaign to small seed list, the mail wasn’t able to be delivered. Either the mail clients or domains blocked it. Everything on the Klaviyo end seemed fine though. When I reverted back to the original {%web_view%} link the mailing was delivered fine, however back to the blue link.

I’m using custom html that I’ve been provided with, which blindsides me a bit. 

Maybe I’ve made a mistake in how I set up the link colour in the html style? I’m not a coder so am really “winging it” and probably haven’t done this correctly :)

Thanks again, I really appreciate the help!

Cathy

Reply


Most helpful members this week

Terms & ConditionsCookie settings

Links & Resources

Platforms

Partners

Useful Things

About

  • Terms and Privacy
    © 2024 Klaviyo All rights reserved. Klaviyo and the Klaviyo logo are trademarks or registered trademarks of Klaviyo, Inc. or its affiliates.