Para aplicar um estilo de fonte do Google Fonts em toda a Landing Page, siga o passo a passo abaixo:
- Acesse sua conta RD Station Marketing;
- Clique no menu Converter > Landing Pages;
- Clique no nome da Landing Page que você deseja alterar ou no botão Criar Landing Page, caso queira criar um nova página;
- Clique em Edição Avançada:
- Agora, em uma segunda aba no seu navegador, abra o site Google Fonts;
- Escolha a fonte que você deseja usar na sua Landing Page. Neste caso, usaremos a fonte Metal Mania para exemplificar:
- Depois, clique no botão Select this style para selecionar qual o estilo você deseja utilizar:
- Depois de selecionado, clique no ícone Selected families, no topo direito da tela:
- Acesse a aba Embed. Neste local, você terá acesso aos códigos necessários para realizar a importação da fonte:
- Para o código ser aceito pela RD Station Marketing, você deve usar o código localizado na aba @import:
- Copie o código, selecionando-o e clicando com o botão direito do mouse sobre ele, ou utilizando o atalho CTRL-C no seu teclado:
- Agora, retorne para a sua aba do RD Station Marketing, em Edição Avançada;
- Na aba JavaScript em HEAD, apague o código pré-configurado, e cole o novo código copiado no passo anterior:
- Salve a alteração realizada clicando no botão Aplicar;
- Agora, para aplicar a fonte selecionada em uma seção específica da sua Landing Page, copie o identificador do elemento que deseja alterar o estilo da fonte, veja a imagem de exemplo abaixo:
- Agora, em Edição Avançada, clique na aba CSS;
- Na aba CSS, vamos customizar o local específico em que a fonte deverá ser aplicada. Cole o identificador do local (que copiou no passo anterior) antes das chaves {}, conforme o exemplo abaixo:
- Agora, retorne para a aba do seu navegador com o Google Fonts e copie o código CSS rules;
- Retorne para o RD Station Marketing em Edição Avançada;
- Depois de copiar o CSS rules, cole o código entre as chaves {} do identificador, conforme configurado no passo 17:
- Por fim, clique no botão Aplicar;
- Para visualizar as mudanças na fonte, você deve clicar em Pré-visualizar. A fonte não mudará na tela de edição da Landing Page;
- Pode acontecer de ter locais na Landing Page em que a fonte selecionada não é aplicada, isso ocorre porque existe uma pré-formatação de texto presente. Para que a alteração funcione corretamente, retorne para a tela de Edição e siga este passo a passo:
- Selecione o texto que em a fonte não foi aplicada;
- Use o atalho CTRL+X no seu teclado, isso fará com que o seu texto seja copiado e recortado, ao mesmo tempo;
- Logo em seguida, use o atalho CTRL+SHIFT+V, assim o seu texto será colado novamente sem nenhuma formatação presente, fazendo com que a fonte escolhida por você, seja aplicada corretamente;
- Para finalizar, você pode visualizar a fonte aplicada, clicando no botão Pré-visualizar:
- Pronto, sua configuração de fonte está completa.
Comentários
0 comentário
Artigo fechado para comentários.