Siga estas etapas para saber como personalizar a fonte em seu funil ou site, usando alguns métodos diferentes.
Há fontes personalizadas disponíveis por padrão em um funil. Basta clicar no parágrafo, clicar em Configurações de tipografia e, em seguida, selecionar uma família de fontes para fazer isso.
Fontes padrão personalizadas disponíveis nos sites
Há quatro elementos que você pode usar em funis para textos com estilos diferentes.
Navegue até Websites e edite a página desejada.
Adicione seções, linhas e elementos de acordo com sua preferência
Clique em um elemento para destacá-lo e modificar o texto com o menu do lado direito da tela
No menu suspenso, clique em Tipografia
Selecione a família de fontes que deseja adicionar ao título e ao corpo do texto.
Se preferir, escolha uma fonte do Google.
Escolha as fontes nativas de título e conteúdo que serão usadas em todo o funil.
Clique em um elemento específico para modificar a tipografia do texto.
Fontes personalizadas no Construtor de Sites usando CSS
Se você tiver o conhecimento necessário, o uso de CSS personalizado permite que você personalize completamente o funil/site além das opções padrão. CSS, ou Cascading Style Sheets (Folhas de estilo em cascata), é a tecnologia usada pela maioria dos sites para criar páginas da Web visualmente atraentes, incluindo aspectos como layout, cores e fontes.
Observação: talvez seja necessário entrar em contato com um desenvolvedor para obter assistência se você não tiver o conhecimento necessário.
Método 1: Adicionar código
Navegue até o Construtor de Funil e edite o funil.
No menu suspenso, clique em CSS Personalizado e use um código semelhante ao deste método:
Método 2: Usando o seletor CSS
Em vez disso, você pode modificar exclusivamente um elemento específico usando o seletor CSS
Método 3: Importação com CSS/HTML
Você pode usar a regra CSS @import ou a tag HTML <link>.
Para usar HTML no Construtor de Sites, use o elemento Código
Clique sobre o elemento adicionado e vá em configurações > geral > editor de código aberto
Primeiro, explicaremos como importar a fonte que você deseja. O Google Fonts pode gerar o código automaticamente com base na fonte que você deseja adicionar à sua página da Web. Abra o Google Fonts e siga estas etapas:
Localize a fonte e clique nela (um cartão com a fonte)
Você verá uma lista com todos os estilos disponíveis da fonte escolhida
Clique em "Get Font" e escolha "Get embed code"
Copie os códigos que você precisa.
Importe as fontes do Google "Muli" e "Quicksand" para o <body> e o <h1>, respectivamente.
Especifique a família da fonte para cada um dos elementos (<body> e <h1>).
Estilize os dois elementos separadamente usando as seguintes propriedades: cor, peso da fonte, estilo da fonte, tamanho da fonte, altura da linha, espaçamento entre letras e outras propriedades.
Aqui está um exemplo de como fica:
CSS
@import url('https://fonts.googleapis.com/css?family=Muli&display=swap');
@import url('https://fonts.googleapis.com/css?family=Quicksand&display=swap');
body {
font-family: 'Muli', sans-serif;
color: rgba(0, 0, 0, 0.8);
font-weight: 400;
line-height: 1.58;
letter-spacing: -.003em;
font-size: 20px;
padding: 70px;
}
h1 {
font-family: 'Quicksand', sans-serif;
font-weight: 700;
font-style: normal;
font-size: 38px;
line-height: 1.15;
letter-spacing: -.02em;
color: rgba(0, 0, 0, 0.8);
-webkit-font-smoothing: antialiased;
HTML
Também é possível importar o Google Fonts usando a tag HTML <link>. Você deve adicioná-la ao cabeçalho.
Use <h1> como uma tag de título e escreva o conteúdo em uma tag <p>.