Como alterar o tamanho do texto CSS no Shopify

O que é tamanho de texto CSS no Shopify?

Em CSS, a propriedade que controla o tamanho do texto é tamanho da fonte.

Você pode aplicá-lo em todo o site (todos os títulos ou corpo do texto) por meio do Editor de Temas do Shopify. Alternativamente, basta aplicá-lo a elementos específicos (como títulos de produtos ou itens de menu) com CSS personalizado.

Se você usar um construtor de páginas de terceiros como GemPages, você pode controlar o tamanho do texto visualmente sem codificar no editor do aplicativo.

Como alterar o tamanho do texto das suas páginas do Shopify?

Método 1: Usando o Editor de Temas do Shopify (Sem Código)

A maneira mais simples de ajustar o tamanho das fontes em sua loja é por meio do Editor de Temas.

Siga esses passos:

• No seu administrador do Shopify, vá para Loja Online > Temas.
• Encontre seu tema ativo e clique Personalizar.

• Na barra lateral esquerda, selecione Configurações do tema > Tipografia.
• Ajusta a Escala de tamanho de fonte para títulos e corpo de texto.

Essa alteração se aplica a todo o site e normalmente é representada como uma porcentagem (100% = padrão).

Método 2: Usando CSS (Código Personalizado)

Para um controle mais granular sobre elementos específicos, você pode editar o CSS do seu tema.

Siga esses passos:

• No Shopify Admin, acesse Loja Online > Temas.
• Encontre seu tema ativo e clique em três pontos ícone > Editar Código.

• De acordo com o relatório Ativos pasta, localize seu arquivo CSS (por exemplo, theme.css, base.css, ou theme.liquid). 

• Vá até o final e adicione suas regras CSS personalizadas.

Exemplos:

• Salve as alterações e limpe o cache para ver as atualizações ao vivo.

Altere o tamanho do seu texto usando GemPages

Se você preferir um solução visual sem códigoO GemPages facilita o ajuste do tamanho do texto diretamente no editor.

Passo 1: No seu administrador do Shopify, navegue até Construtor GemPages app> PÁGINAS. Clique na página cujo tamanho do texto você deseja alterar para abrir o Editor GemPages.

Passo 2: Depois de localizar o editor, clique no texto para revelar seu painel de configurações.

Passo 3: Sob o Configurações guia, role para baixo até o Estilo de texto seção.

Passo 4: Localize o Dimensões: campo e ajuste o tamanho do texto como preferir. Além disso, você pode alterar o texto para negrito, itálico ou sublinhado e mais distante personalizar it.

Passo 5: Salve suas atualizações e visualize a página antes de publicar para verificar o resultado.

Melhores práticas para definir o tamanho do texto CSS

• Use unidades responsivas: Prefere rem or em Acima de px para texto escalável em todos os dispositivos.
• Manter hierarquia: Certifique-se de que os títulos sejam maiores que o corpo do texto para maior clareza.
• Verifique a legibilidade: Teste suas alterações no desktop e no celular.

Perguntas Frequentes

1. Devo usar px, em, ou rem para o tamanho do texto?

O processo de em e rem tamanhos de texto são recomendados para melhor capacidade de resposta.

2. Alterar o tamanho do texto afetará o SEO?

Não diretamente. Mas uma melhor legibilidade melhora a experiência do usuário, o que pode influenciar positivamente o SEO.

3. Posso visualizar as alterações antes de publicar?

Sim. Tanto o Editor de Temas do Shopify quanto o GemPages permitem visualizações ao vivo antes de publicar as alterações na sua vitrine.