I'm having this issue with customizing CTA's for the first time. Everytime I've customized a CTA I have not had an issue with saving it in HubSpot. I tried to make a new 'book now' button with custom HTML, visually it was perfect but HubSpot will not process and save it. Has anyone else run into this issue before? Is there a max-width for CTA's? That is the only issue I could think of on my end.
if this doesn't get saved or don't work - there are a few options what could be the problem:
1. you main CSS file has, like nearly every HubSpot CSS file some (basic)styling for CTA-buttons and "overwrites" your custom styling
2. your code has invalid inputs and HubSpot deletes it
3. you have selected "simple"(or something else) as "button-style". For best results you should try to change it to "link(no style)" and enter all your custom CSS below.
...
Personally I would never style (every) CTA-button with custom CSS inside the button creation.
The "best-case" (imo) is:
- open your main css file (or the one which is used by the template)
- create a new class like ".my-nice-looking-cta-button"
- assign all of your custom css code to this class
- save the CSS file
- assign the class to your CTA-button
with this method you have not to style every CTA-button again and again.
If we take the example code from above it would look like this with the "class-solution"
- enter "my-fancy-cta-button" as custom CSS-class in the CTA-button options
Also - if you open "advanced options" in the CTA creation view and check/select the auto-size option, the CTA will be always as width as possible(if there is no max-width in the CSS)
Hope this helps.
If you need fourther help, I can help you.
regards
Anton
Did my post help answer your query? Help the Community by marking it as a solution
if this doesn't get saved or don't work - there are a few options what could be the problem:
1. you main CSS file has, like nearly every HubSpot CSS file some (basic)styling for CTA-buttons and "overwrites" your custom styling
2. your code has invalid inputs and HubSpot deletes it
3. you have selected "simple"(or something else) as "button-style". For best results you should try to change it to "link(no style)" and enter all your custom CSS below.
...
Personally I would never style (every) CTA-button with custom CSS inside the button creation.
The "best-case" (imo) is:
- open your main css file (or the one which is used by the template)
- create a new class like ".my-nice-looking-cta-button"
- assign all of your custom css code to this class
- save the CSS file
- assign the class to your CTA-button
with this method you have not to style every CTA-button again and again.
If we take the example code from above it would look like this with the "class-solution"
- enter "my-fancy-cta-button" as custom CSS-class in the CTA-button options
Also - if you open "advanced options" in the CTA creation view and check/select the auto-size option, the CTA will be always as width as possible(if there is no max-width in the CSS)
Hope this helps.
If you need fourther help, I can help you.
regards
Anton
Did my post help answer your query? Help the Community by marking it as a solution