Skip to content

Embed calls-to-action (CTA) on your external site

Last updated: October 13, 2020

Applies to:

Marketing Hub Professional, Enterprise
CMS Hub Professional, Enterprise
Legacy Marketing Hub Basic

If you are hosting your website content outside of HubSpot, you can still use your HubSpot CTAs to attract and convert leads. Learn how to embed CTAs and Smart CTAs on your external site using the CTA embed code.

  • In your HubSpot account, navigate to Marketing > Lead Capture > CTAs.
  • On the Calls-to-action dashboard, hover over a CTA and click the Actions dropdown menu, then select Embed code 
  • In the dialog box, click Copy code. Then click Close
  • Navigate to your external website's content management system (CMS). 
  • Paste the CTA embed code into the HTML of your non-HubSpot page, wherever you want the CTA to appear.  
  • Preview your CTA on the webpage to see what it looks like live. If the CTA does not display correctly, make sure that your external CMS has not altered the code that you copied. If you are using an image CTA, you may need to add additional styling to make sure the image CTA is responsive
  • When you're finished, publish you page(s) to take your changes live. 

Because every website/CMS is structured differently, these steps are not exact instructions on how to access your site's HTML code. If you're not sure how to access the HTML code of your site or embed an external code, email this article to your webmaster, IT department, or technical resource.

Please note: CTAs that are embedded on your external website will automatically update globally when a change has been made to the content, text, or general design of the CTA.

If you are embedding a CTA on your WordPress site, you may need to apply additional CSS declarations within your external stylesheet to make the CTA responsive. 

If you notice your CTA not working in WordPress or the embed code being altered when you view the live page, you may need to insert the CTA using a plugin to make sure the embed code stays intact. If you're using the latest version of Gutenberg, which removes inline JavaScript, use the Inline JS Block for Gutenberg plugin to embed forms and CTAs onto your page.