Lost styling on all CTAs across entire website

SOLVE
Crystal_Hopper
Guide

I saw an issue on one page where a CTA (that should have the primary button style) shows with Alt Text and a broken image icon. Then noticed all CTAs across the whole site look like this. I've put in a ticket to support. But seriously, what causes this and how do I fix it?

 

The CTAs appear fine in Internet Explorer, but are "broken" in Edge and Chrome. Here's a page to look at:
w w w . c u . n e t / industrial

***************************
Did my post solve the questions or challenge? Please mark it as a solution for others to find.
0 Upvotes
1 Accepted solution

Accepted Solutions
Anton
Solution
Key Advisor | Diamond Partner

Hi @Crystal_Hopper

as a developer I'm quite surprised that IE is working better then Chrome and (the new) Edge since those two are basicly the same program and Chrome is considered one of the best clients out there.

 

It looks that you're using the default CTA styling. I would always recommend to set CTAs to "Link (no style)" and enter the depending CSS classes in the advanced options of the CTA. By doing this all your CTAs will look and behave the same AND if you change the design inside those classes in the future - it will automaticly be applied to all CTAs on your page which have those classes. 

Here are some classes I've found:

blue CTA: 

cta_button link-style1

(copy/paste those classes into the "CSS class" input field of the CTA)

 

 

hope this helps, 

 

Best, 

Anton

 




check
Did my post help answer your query? Help the Community by marking it as a solution



View solution in original post

0 Upvotes
2 Replies 2
Anton
Solution
Key Advisor | Diamond Partner

Hi @Crystal_Hopper

as a developer I'm quite surprised that IE is working better then Chrome and (the new) Edge since those two are basicly the same program and Chrome is considered one of the best clients out there.

 

It looks that you're using the default CTA styling. I would always recommend to set CTAs to "Link (no style)" and enter the depending CSS classes in the advanced options of the CTA. By doing this all your CTAs will look and behave the same AND if you change the design inside those classes in the future - it will automaticly be applied to all CTAs on your page which have those classes. 

Here are some classes I've found:

blue CTA: 

cta_button link-style1

(copy/paste those classes into the "CSS class" input field of the CTA)

 

 

hope this helps, 

 

Best, 

Anton

 




check
Did my post help answer your query? Help the Community by marking it as a solution



View solution in original post

0 Upvotes
Crystal_Hopper
Guide

I also thought that about IE vs the other 2. We've never had to use the classes like that, but I will keep in mind. Thanks for the idea!

 

This is something new that just happened across our whole website. I'm going to see what Support has to say about that before changing things too much. 

***************************
Did my post solve the questions or challenge? Please mark it as a solution for others to find.
0 Upvotes