Notebook

[CSS] Configurando o Texto (justify)

🎨 Como justificar todos os parágrafos do seu site com CSS

Nesta aula, você vai aprender a aplicar o alinhamento justificado (justify) em todos os parágrafos do seu site WordPress, deixando o texto com uma aparência mais profissional e agradável para leitura.

Existem várias formas de fazer isso, desde as mais simples (usando o Customizer) até as mais avançadas (criando um MU-Plugin). Vamos ver cada uma delas.

🎯 O que é text-align: justify?

O alinhamento justificado faz com que o texto ocupe toda a largura do contêiner, ajustando os espaços entre as palavras para que as margens esquerda e direita fiquem alinhadas. É o formato usado em jornais, revistas e livros.

No CSS, a propriedade é simples:

p {
    text-align: justify;
}

📌 Método 1: CSS Adicional no Customizer (mais fácil e recomendado)

Este método é ideal para iniciantes e não exige conhecimento de código. As alterações são aplicadas ao tema ativo.

  1. No painel do WordPress, vá em Aparência → Personalizar.
  2. No menu lateral, clique em “CSS Adicional” (geralmente é o último item).
  3. Cole o código CSS abaixo no campo:
p {
    text-align: justify;
}
  1. Clique em “Publicar”.

✅ Vantagem: Simples e imediato, sem precisar de plugins ou editar arquivos.

⚠️ Desvantagem: Se você trocar de tema, o CSS é perdido (a menos que use um tema filho).

📌 Método 2: Editor de Temas (style.css)

Este método é útil se você já utiliza um tema filho e quer que as alterações persistam mesmo após atualizações do tema pai.

  1. Acesse Aparência → Editor de Temas (se não aparecer, ative essa opção no wp-config.php com define('DISALLOW_FILE_EDIT', false);).
  2. Selecione o arquivo style.css do seu tema (ou tema filho).
  3. Cole o código no final do arquivo:
p {
    text-align: justify;
}
  1. Clique em “Salvar”.

✅ Vantagem: Mantém as alterações mesmo se você desativar o tema ou trocar de tema (se estiver no tema filho).

⚠️ Desvantagem: Pode ser sobrescrito por atualizações do tema pai se você não estiver usando um tema filho.

📌 Método 3: MU-Plugin (solução mais profissional e definitiva)

Esta é a abordagem que você mais utiliza: criar um MU-Plugin que injeta o CSS no cabeçalho do site, independentemente do tema ativo. É a solução mais limpa e permanente.

  1. Acesse o servidor via FTP ou File Manager.
  2. Navegue até /wp-content/mu-plugins/ (crie a pasta se não existir).
  3. Crie um arquivo chamado justificar-paragrafos.php.
  4. Cole o seguinte conteúdo:
<?php
/**
 * Plugin Name: Justificar Parágrafos com CSS
 * Description: Aplica text-align: justify a todos os parágrafos do site.
 * Version: 1.0
 * Author: Reinaldo (Neodoor)
 */

if ( ! defined( 'ABSPATH' ) ) exit;

add_action( 'wp_head', function() {
    echo '<style>p { text-align: justify; }</style>';
}, 100 );
  1. Salve o arquivo.

✅ Vantagem: Funciona em qualquer tema, não é perdido com atualizações, é super leve e você tem controle total.

⚠️ Desvantagem: Exige acesso ao servidor para criar o arquivo.

🎯 Personalização avançada (aplicar apenas em posts e páginas)

Se você quiser justificar apenas os parágrafos que estão dentro de posts e páginas (e não em widgets, rodapé, etc.), use este CSS:

.single-post p, .page p {
    text-align: justify;
}

Se quiser aplicar também nas listagens de blog (arquivos), adicione:

.blog p, .archive p {
    text-align: justify;
}

🧪 Teste e verificação

Após aplicar qualquer um dos métodos, acesse uma página com texto no seu site. Os parágrafos devem aparecer alinhados à esquerda e à direita (justificados).

Se não funcionar, verifique:

  • Se o código foi colado corretamente (sem erros de digitação).
  • Se o cache do WordPress (ex: WP Super Cache) foi limpo.
  • Se o tema não está sobrescrevendo o alinhamento com uma regra mais específica (ex: .entry-content p).

✅ Resumo

Método Dificuldade Persistência
Customizer (CSS Adicional) ⭐ Iniciante Perde ao trocar de tema
Editor de Temas (style.css) ⭐⭐ Intermediário Depende de tema filho
MU-Plugin ⭐⭐⭐ Avançado ✅ Permanente (recomendado)

Escolha o método que melhor se adapta ao seu fluxo de trabalho. Se você já está acostumado com MU-Plugins, vá direto para o terceiro – é a solução mais robusta e alinhada com nosso laboratório.

Arquivo final do MU-Plugin: /wp-content/mu-plugins/justificar-paragrafos.php

Com essa técnica simples, seu site ficará mais legível e profissional. Aproveite para anotar esta aula no seu caderno de estudos! 🚀

★★★★★
Média: 3.0 (40 votos)