COS-General

How do I use Typekit with HubSpot?

Last updated: November 11, 2015

Adobe Typekit is a subscription font library that gives you access to a varitey of fonts for your website. Follow these instructions to use Typekit with HubSpot:
  • In Typekit, add the font that you would like to use to a new or existing kit. For more detailed instructions, check out this Typekit help article.
  • Click Kits and select the kit that you added the font to.
  • Select Kit Settings.

  • Enter the your domain followed by a comma
  • Enter preview.hs-sites.com. Adding this domain will allow Typekit fonts to render in the Design Manager preview. If you are using additional Content Staging domains, you will also want to add those domains as well.
  • Click Save Settings.

  • Publish the kit, by clicking Publish.

 

  • Click Embed Code
  • Copy the embed code.

  • If you want to apply the Typekit script to your entire COS site, log in to Hubspot, navigate to Content > Content Settings, and paste the script towards the top of the Header HTML field. Click Save.
  • If you only want to add the script to a specific template layout, log in to Hubspot and navigate to Content > Design Manager. Open the template that you would like to edit and choose Edit > Edit Head. Paste the script in the Additional HTML Head Markup for this Layout section. Publish your template.
  • In your HubSpot stylesheet, reference the font-family that is specified in Typekit.