Artigos sobre: Editor de Páginas

Como IMPORTAR FONTES do Google Fonts no GreatPages


Para importar fontes do Google Fonts, siga o passo a passo abaixo:


  1. Acesse https://fonts.google.com/ e escolha a fonte que deseja importar;


  1. Acesse o editor de páginas;



  1. Clique no ícone de engrenagem que fica no canto superior direito da tela;



  1. Em seguida, clique em "Javascript & CSS";



  1. Clique para "Adicionar" um novo código;



  1. Escolha um nome para seu código, selecione a opção "Funcionamento" e adicione no campo de texto todo o código abaixo;


<link href="LINK DA FONTE" rel="stylesheet">

<style>
.gpc-e .c.e_titulo h1, .gpc-e .c.e_titulo h1 * {font-family: 'NOME DA FONTE', sans-serif;}
</style>



  1. Depois de colar o código no GreatPages, você precisará acessar o Google Fonts para buscar pelo Link da fonte e pelo Nome da fonte para editar o código;


  1. No Google Fonts, você precisará selecionar a fonte que deseja importar e clicar no botão "Select Thin 100" indicado na imagem abaixo;



  1. Quando fizer isso, vai abrir uma caixa ao lado da tela com as duas informações (indicadas na imagem abaixo) que você precisará copiar e adicionar no código colado no GreatPages;



  1. Você vai precisar fazer duas mudanças no código: A primeira é alterar onde está escrito LINK DA FONTE e colar o link indicado em vermelho na imagem abaixo.


A segunda alteração, é copiar o nome da fonte, indicado na imagem abaixo no local escrito no código com o nome NOME DA FONTE. No final, o seu código ficará no mesmo padrão do exemplo abaixo;


<link href="https://fonts.googleapis.com/css2?family=Pathway+Extreme:wght@100&display=swap" rel="stylesheet">

<style>

.gpc-e .c.e_titulo h1, .gpc-e .c.e_titulo h1 * {font-family: 'Pathway Extreme', sans-serif;}
</style>


Em seguida clique em "Salvar"!


Ao importar uma fonte para sua página, é importante entender como ela será configurada e visualizada:


  • Configuração Inicial: Quando você importa uma fonte, ela é inicialmente configurada para ser utilizada nos títulos.


  • Visualização: A fonte importada só pode ser visualizada no modo de pré-visualização e na página publicada. No editor, ela não aparecerá juntamente com as outras fontes disponíveis.


Fonte via Código: Lembre-se de que, mesmo após a importação, a fonte não se torna "nativa" na plataforma, pois está implementada via código.



Ficou com alguma dúvida? Chame nossa equipe no Chat! Estamos sempre prontos para ajudar



Atualizado em: 24/09/2024

Este artigo foi útil?

Compartilhe seu feedback

Cancelar

Obrigado!