Is it possible to modify the CTA Button style options in the dropdown?

SOLVE
AShairzay
Participant

Or can they only be styled with the custom class field? The Button style dropdown already has an option for "Primary", and it would be great to add styles like "Secondary", "Tertiary", etc so the team doesn't have to remember to apply the right CSS classes.

0 Upvotes
1 Accepted solution

Accepted Solutions
DanielSanchez
Solution
Key Advisor

Hi,

 

You can edit the CSS within the CTA itself. But you won't have created pre-styles to make it easier for you to create new CTAs. Unless they clone that version that defined the internal style.

css.PNG

 

 

But you can create pre styles to classes to use in Custom CSS Class. You can change in your CSS File in Design Manager (the better way), or in settings of your domain (settings > website > pages). Example:

css-class.PNG

 

 

 

 

 

And in CTA configuration, you change the CTA style only changing the class. (black-cta, yellow-cta, etc..).

ctaaa.PNG

 

Did this post help solve your problem? If so, please mark it as a solution.

Best! 🙂

 

View solution in original post

4 Replies 4
DanielSanchez
Key Advisor

Hi @AShairzay ,

 

You can define the styling for different classes in your site's CSS (requires HTML and CSS knowledge). And then in the CTA drop-down list, check the option in style and just link the name of the desired class. 🙂

 

ctaa.PNG

 

Did this post help solve your problem? If so, please mark it as a solution.

Best!

AShairzay
Participant

So there's no way to modify the options in the Button style dropdown itself? A theme file in Design Manager or something?

0 Upvotes
DanielSanchez
Solution
Key Advisor

Hi,

 

You can edit the CSS within the CTA itself. But you won't have created pre-styles to make it easier for you to create new CTAs. Unless they clone that version that defined the internal style.

css.PNG

 

 

But you can create pre styles to classes to use in Custom CSS Class. You can change in your CSS File in Design Manager (the better way), or in settings of your domain (settings > website > pages). Example:

css-class.PNG

 

 

 

 

 

And in CTA configuration, you change the CTA style only changing the class. (black-cta, yellow-cta, etc..).

ctaaa.PNG

 

Did this post help solve your problem? If so, please mark it as a solution.

Best! 🙂

 

View solution in original post

AShairzay
Participant

Got it, thanks!

0 Upvotes