Modificar a fonte do seu front-end com Google Fonts

Modificar a fonte do seu front-end com Google Fonts

Aceda ao site Google Fonts. Aqui está o URL do Google Fonts : fonts.google.com Pesquise a Google Font que deseja aplicar ao seu front-end. Clique numa fonte na lista de resultados para abrir a sua página.

Clique em "Select" no final da linha para cada peso de fonte que deseja poder utilizar no seu front-end. Aconselhamos a selecionar no mínimo os seguintes pesos : • Light • Regular • Bold A lista dos pesos selecionados aparece na barra da direita. Após selecionar todos os pesos, selecione a opção "@import".

De seguida, selecione essa porção de código e copie-a. Selecione apenas a porção de código que começa por @ e termina por ; Não é necessário copiar as etiquetas <style> </style>. Aceda ao back-end da sua plataforma de aluguer, no menu Administração - Front-end. Abra o separador "Páginas".

Clique no ícone do builder de qualquer página. Não será necessário repetir este procedimento em cada página, pois irá modificar a folha de estilo CSS de forma global. No builder, clique no ícone CSS para editar o CSS do seu front-end. Cole no editor que se abre a porção de código copiada do Google Fonts.

De seguida, adicione o seguinte código : body {
font-family: "YYY", sans-serif; } Neste código, substitua YYY pelo nome da sua Google Font (por exemplo : Montserrat). Verifique as informações que introduziu. Deverá obter o seguinte resultado : @import url('XXX'); body { font-family: "YYY", sans-serif; } ==> XXX sendo o URL fornecido no código copiado do Google Fonts ==> YYY sendo o nome da sua fonte Google

Após verificar as informações, clique no botão "Fechar". Uma notificação irá indicar que o seu CSS foi atualizado. Atualize uma página do seu front-end e verifique a alteração da fonte.