A Call to Action button in the footer of my pages is sometimes failing to load styling before the page is rendered, resulting in an unstyled button.
The button is the “Sign Up for Updates” button above the “Contact Us” button. Styling for the “Contact Us” button comes from sitewide styling, while the CTA button styling appears to come from a script /hs/cta/cta/current.js, which is difficult to control.
Can we accomplish the styling and tracking functions without calling the additional script? We are seeing a delay in script and therefore styling execution. If we are stuck with the way the button is set, is there a way to force it to execute more smoothly?
Hi @JKeating, I hope that you are well!
Thank you for asking the Community!
I checked the website and saw the 2 CTAs in the footer. The only thing I could notice was the arrow that appears slightly after on “Sign up for updates”, whereas on “Contact us” the arrow is already there.
I’d love to put you in touch with some of our Top Experts: Hi @alyssamwilie, @Stephanie-OG and @miljkovicmisa do you have suggestions to help @JKeating, please?
Thanks so much and have a brilliant day!
Best,
Bérangère
The lag in the appearance and operation of the “Sign Up for Updates” button is due to various elements related to the loading and execution of the external script (/hs/cta/cta/current.js) and its associated resources on your website.
Directly Style the Button in Your CSS – This approach eliminates any delays that may arise from relying on the external script for styling.
Enhance Script Loading Efficiency – If the script is essential for functionality, consider utilizing the async or defer attributes to prevent it from hindering your page’s performance.
I hope this will help you out. Please mark it as Solution Accepted and upvote to help another Community member.
Thanks!