Adicionar fontes do Google às páginas e CTAs

Você pode adicionar tags com link do Google Fonts a uma ou todas as páginas em suas configurações ou no campo HTML do cabeçalho. Se você estiver acostumado a editar CSS, pode adicionar o código de @import à parte superior de um arquivo CSS específico.

Observação: se estiver criando conteúdo usando um tema, você pode escolher qualquer fonte do Google diretamente nas configurações de tema. Todas as fontes do Google também são compatíveis com modelos do Starter na guia Design.

Copie o Script da fonte do Google

Primeiro, copie o script para sua fonte desejada do Google Fonts.

• Acesse fonts.google.com.
• Na barra de pesquisa, procure o nome da fonte desejada.
• Clique no nome da fonte para visualizar uma lista completa de estilos disponíveis para importar.
• Clique em + Selecionar este estilo ao lado de cada estilo que deseja importar dessa fonte.
• No painel direito, selecione a guia Incorporar e selecione @import.
• Copie o script @import fornecido pelo Google, sem a tag <style>. Você adicionará esse script no topo da folha de estilos na sua conta da HubSpot.
• Em seguida, você aplicará essas fontes a seletores CSS específicos em sua folha de estilo do HubSpot usando as regras de CSS para especificar famílias do Google Fonts.

Adicione a fonte do Google às suas páginas do HubSpot

• Na sua conta da HubSpot, localize a folha de estilos aplicada às suas páginas e abra o arquivo no seu gerenciador de design.
• Cole o código @import na primeira linha do seu arquivo CSS. Deve ficar no topo do sua folha de estilos CSS.

• Aplique a fonte do Google para os seletores CSS desejados, como mostrado no exemplo abaixo. 

h1 {
font-family: 'Comic Neue', cursive;
}

Adicionar sua fonte do Google a uma CTA

Você pode adicionar uma fonte do Google a uma CTA personalizada na sua conta. Essa opção não está disponível para uma CTA de imagem.

• Copie o código de Especificar no código CSS do Google Fonts.
• Na sua conta da HubSpot, navegue até Marketing > Captura de leads > CTAs.
• Passe o cursor do mouse sobre a CTA que deseja editar e clique no menu suspenso Ações, em seguida, selecione Editar. 
• No painel direito, na parte inferior do editor de CTA, clique em Opções avançadas.
• No campo de texto CSS personalizado, cole o código das regras de CSS para especificar as famílias do Google Fonts. Você verá a fonte do Google aplicada à CTA assim que inserir esse CSS. 

• Clique em Avançar no canto inferior direito para finalizar os detalhes da sua CTA. Em seguida, clique em Salvar para aplicar suas alterações.