Wordpress

theme.json: fonte personalizada no tema de blocos do WordPress 6.9

Você copiou o inter-variable.woff2 pra assets/fonts/, escreveu o @font-face no style.css e o seletor de tipografia do editor continua mostrando as três fontes de sempre. Num tema de blocos o editor não lê o seu CSS, ele lê o theme.json: enquanto a família não estiver declarada lá, ela não existe pros Estilos Globais.

O bloco que faltava

{
  "$schema": "https://schemas.wp.org/trunk/theme.json",
  "version": 3,
  "settings": {
    "typography": {
      "fontFamilies": [
        {
          "name": "Inter",
          "slug": "inter",
          "fontFamily": "Inter, system-ui, sans-serif",
          "fontFace": [
            {
              "fontFamily": "Inter",
              "fontWeight": "400 700",
              "fontStyle": "normal",
              "fontDisplay": "swap",
              "src": [ "file:./assets/fonts/inter-variable.woff2" ]
            }
          ]
        }
      ]
    }
  }
}

O version 3 é o esquema atual do WordPress 6.9. É o array fontFace que faz o núcleo imprimir a regra @font-face no front e no editor. Sem ele o nome aparece no seletor, mas o navegador cai no fallback e ninguém entende por quê.

O prefixo file:./ passa pelo get_theme_file_uri(): procura na pasta do tema filho e, se não achar, cai pra do pai. Dá pra deixar o .woff2 só no pai; errou o caminho nos dois, sai a URL do pai assim mesmo e o navegador toma 404.

Usando o slug no CSS

body {
    font-family: var(--wp--preset--font-family--inter);
}

O nome da variável sai direto do slug. Trocou o slug, quebrou o CSS de quem já usava a variável antiga — escolha um slug curto e não mexa depois.

Editou o theme.json e nada mudou? Antes de culpar o cache, olhe os Estilos Globais: fonte escolhida pelo editor de site fica salva no post type wp_global_styles e ganha do arquivo — redefinir para os padrões, no painel Estilos, limpa isso.

O cache do theme.json fica num grupo não persistente, então wp cache flush não muda nada aqui; enquanto você ajusta, ponha define('WP_DEVELOPMENT_MODE', 'theme'); no wp-config.php e o núcleo ignora esse cache. E confira no DevTools se o .woff2 volta 200: um location ~* .(woff2)$ mal escrito no nginx derruba a fonte com 404 e o sintoma parece o mesmo.

Post Recentes

Criar swapfile no Ubuntu: parar o OOM killer de matar o MySQL

VPS de 2 GB onde o mysqld morre de madrugada e o site volta com erro de conexão. Como confirmar…

9 horas atrás

Grupos nomeados no preg_match: pare de contar índice de $matches

Regex com cinco parênteses e ninguém lembra se a data é $matches[2] ou $matches[3]. Nomeie os grupos e leia o…

23 horas atrás

Token de integração da API do Magento 2: gerar e usar no header Bearer

Erro The consumer isn't authorized to access resources ao chamar a REST do Magento 2.4.8? Ative a integração, libere os…

1 dia atrás

Rate limit no wp-login.php com nginx: barrar força bruta antes do PHP

Bots batendo centenas de POST por minuto no login derrubam a CPU. Configure limit_req_zone no nginx e devolva 429 antes…

2 dias atrás

Anonimizar IP no nginx: mascarar o último octeto do log para a LGPD

Seu access.log guarda o IP inteiro dos visitantes há meses sem necessidade. Mascare o último octeto com map e log_format…

3 dias atrás

Prompt injection em campo de usuário: isole a observação do pedido

A observação do pedido chegou com ordem embutida para gerar cupom. Delimite o texto do cliente e trate a resposta…

3 dias atrás