# Google Fonts Local: tipos de letra alojados localmente e RGPD (dffontmanager)

> O DF Font Manager aloja os seus tipos de letra Google Fonts diretamente no seu servidor PrestaShop: os seus visitantes nunca mais contactam os servidores da Google (conformidade RGPD), e…

- Página: <https://www.datafirefly.com/pt/documentation/dffontmanager/>
- Idioma: pt
- Atualizado em: 2026-09-03
- Outros idiomas: [fr](https://www.datafirefly.com/documentation/dffontmanager/index.md), [en](https://www.datafirefly.com/en/documentation/dffontmanager/index.md), [es](https://www.datafirefly.com/es/documentation/dffontmanager/index.md), [de](https://www.datafirefly.com/de/documentation/dffontmanager/index.md), [it](https://www.datafirefly.com/it/documentation/dffontmanager/index.md), [pl](https://www.datafirefly.com/pl/documentation/dffontmanager/index.md), [nl](https://www.datafirefly.com/nl/documentation/dffontmanager/index.md)
- Índice: <https://www.datafirefly.com/pt/documentation/llms.txt>

O DF Font Manager aloja os seus tipos de letra Google Fonts diretamente no seu servidor PrestaShop: os seus visitantes nunca mais contactam os servidores da Google (conformidade RGPD), e muda a tipografia da sua loja por simples regras CSS, sem modificar um único ficheiro do tema. O módulo gere a importação a partir do catálogo Google Fonts, o subsetting automático por alfabeto, o pré-carregamento do ficheiro crítico, a estratégia font-display e o carregamento de tipos de letra próprios.

Esta documentação cobre a versão **1.0.0** do módulo, compatível com PrestaShop **8.0.0 a 9.x**. Nenhum override de classe, nenhuma dependência Composer, JS vanilla sem jQuery.

## Instalação

1. No seu back-office PrestaShop, abra **Módulos > Gestor de módulos**.
2. Clique em **Instalar um módulo** e carregue o ficheiro `dffontmanager.zip`.
3. Aparece um separador **Gestor de tipos de letra** sob o menu **Design**: é aí que tudo se passa (o botão Configurar do módulo também redireciona para lá).

O módulo regista-se em três hooks (`displayHeader`, `actionFrontControllerSetMedia`, `actionOutputHTMLBefore`) e cria duas tabelas: os tipos de letra instalados e as regras de substituição. Os ficheiros de tipos de letra são guardados em `modules/dffontmanager/views/fonts/` e a folha de estilos gerada em `modules/dffontmanager/views/css/generated/`: verifique que estas pastas têm permissão de escrita.

## Definições gerais

- **Ativar os tipos de letra alojados localmente**: interruptor principal: carrega a folha de estilos gerada e as etiquetas de pré-carregamento no front-office.
- **Remover as chamadas externas Google Fonts (RGPD)**: limpa o HTML renderizado da loja: todas as etiquetas link que apontam para `fonts.googleapis.com` ou `fonts.gstatic.com` (folhas de estilo, preconnect, pré-carregamentos) e os `@import` inline correspondentes são retirados antes do envio da página. É esta opção que garante que nenhum pedido parte para a Google, mesmo que o seu tema ou outro módulo o injete.
- **Estratégia font-display**: aplicada a todas as declarações `@font-face` geradas. `swap` (por defeito) mantém o texto visível durante o carregamento; `block`, `fallback`, `optional` e `auto` estão disponíveis para necessidades específicas.

Recomendação: deixe `swap`. É o melhor compromisso para os Core Web Vitals: sem texto invisível (FOIT), sem penalização do LCP.

## Importar um tipo de letra Google Fonts

1. No painel **Importar um tipo de letra Google**, escreva pelo menos dois caracteres: o preenchimento automático percorre o catálogo Google Fonts completo, guardado em cache 7 dias no seu servidor (botão de atualização ao lado do campo).
2. Selecione uma família: as **variantes** disponíveis (espessuras 100 a 900, normal e itálico) e os **alfabetos** aparecem. Por defeito, as espessuras 400 e 700 e os subsets latin + latin-ext estão pré-marcados.
3. Clique em **Importar localmente**.

O módulo interroga então a API CSS da Google, descarrega os ficheiros woff2 oficiais correspondentes à sua seleção (um ficheiro por alfabeto e por variante), verifica a sua assinatura binária, arruma-os em `views/fonts/nome-da-familia/` e regenera a folha de estilos. A página recarrega com a família visível na tabela dos tipos de letra instalados, com o seu peso total em disco.

O descarregamento é feito uma única vez, de servidor a servidor, no momento da importação. Os seus visitantes nunca participam nesse pedido: do lado do front-office, tudo é servido a partir do seu domínio.

### O subsetting automático

A Google divide cada tipo de letra em ficheiros por alfabeto (latin, latin-ext, cirílico, grego, vietnamita, etc.). O módulo só descarrega os alfabetos marcados e conserva para cada ficheiro o seu `unicode-range` de origem na declaração `@font-face`. O navegador só pede portanto os intervalos de caracteres realmente apresentados na página: uma loja portuguesa típica serve 20 a 90 KB de tipos de letra em vez de várias centenas.

Marque apenas os alfabetos da sua audiência real. Para o português, latin + latin-ext bastam (o latin-ext cobre os caracteres acentuados como ã, õ e ç). Poderá sempre reimportar a família mais tarde com subsets adicionais: a importação substitui de forma limpa os ficheiros existentes conservando as suas definições (pré-carregamento, ativação) e as suas regras.

### Reimportar ou modificar uma família

Para acrescentar uma espessura ou um alfabeto a uma família já instalada, refaça simplesmente a importação com a nova seleção: os antigos ficheiros da família são substituídos, as regras de substituição que a usam ficam intactas.

## Carregar um tipo de letra próprio

O painel **Carregamento de um tipo de letra personalizado** aceita os formatos `woff2` (recomendado), `woff`, `ttf` e `otf`. Indique o nome da família, a espessura e o estilo, e envie o ficheiro: um ficheiro por combinação espessura/estilo, fundidos automaticamente sob a mesma família. Cada ficheiro é validado pela sua assinatura binária (e não pela sua extensão), e depois integrado na folha gerada e disponível nas regras exatamente como um tipo de letra Google.

Verifique que a sua licença autoriza o uso web em alojamento próprio, nomeadamente para os tipos de letra comerciais comprados a fundições.

## Gerir os tipos de letra instalados

A tabela dos tipos de letra instalados mostra para cada família: a fonte (google ou custom), as variantes, os subsets, o número de ficheiros e o seu peso em disco, e depois dois interruptores:

- **Ativo**: inclui ou exclui a família da folha de estilos gerada (os ficheiros ficam no disco).
- **Pré-carregamento**: ver a secção dedicada abaixo.

O botão de eliminação retira a família, os seus ficheiros em disco e todas as regras que a usam, e reconstrói depois a folha de estilos.

## Regras de substituição

É aqui que aplica os seus tipos de letra sem tocar no tema. Cada regra associa um **seletor CSS** a um **tipo de letra instalado**, com quatro opções:

- **Espessura**: força um `font-weight` (deixe vazio para herdar do tema);
- **Estilo**: normal ou itálico (vazio para herdar);
- **Pilha de recurso**: famílias genéricas apresentadas se o tipo de letra ainda não estiver carregado: `sans-serif`, `serif`, `monospace` ou `system-ui, sans-serif`;
- **!important**: marcado por defeito, garante que a regra prevalece sobre os estilos do tema qualquer que seja a sua especificidade.

Exemplos de seletores correntes:

- `body`: toda a loja;
- `h1, h2, h3, h4, h5, h6`: todos os títulos;
- `.btn, button`: os botões;
- `.product-title, .h3.product-title`: os títulos de produtos das listagens (a adaptar ao seu tema).

Configuração típica em duas regras: `body` para o seu tipo de letra em 400 com pilha `sans-serif`, e depois `h1, h2, h3, h4` para a mesma família em 700. Inspecione o seu tema com as ferramentas de programador do navegador para identificar os seletores a visar mais finamente.

Cada adição ou eliminação de regra reconstrói imediatamente a folha de estilos. A folha é carregada _depois_ do CSS do tema: mesmo sem `!important`, as suas regras ganham a cascata em igualdade de especificidade.

## Pré-carregamento: boas práticas

O interruptor **Pré-carregamento** de uma família emite no topo da página uma etiqueta `link rel=preload as=font crossorigin` para o seu ficheiro crítico, escolhido automaticamente: woff2, estilo normal, alfabeto latin, espessura mais próxima de 400. O navegador descarrega assim o tipo de letra em paralelo com o CSS, antes mesmo de descobrir o seu uso: o texto definitivo aparece mais cedo.

Pré-carregue apenas uma ou duas famílias realmente usadas acima da linha de dobra. Cada pré-carregamento consome largura de banda prioritária: abusar dele degrada o LCP em vez de o melhorar.

## Funcionamento técnico

- A folha gerada `fonts-v{carimbo}.css` contém todas as declarações `@font-face` (com `font-display` e `unicode-range`) seguidas das regras de substituição. Cada reconstrução produz um novo nome de ficheiro (cache-busting automático) e purga as versões antigas.
- É registada via `actionFrontControllerSetMedia` com uma prioridade que a coloca depois do CSS do tema.
- As etiquetas de pré-carregamento são emitidas por `displayHeader`; a lista dos ficheiros críticos é guardada em cache na configuração: nenhum pedido SQL adicional por página do front-office.
- A remoção das chamadas externas é executada em `actionOutputHTMLBefore`, no HTML final, depois da cache Smarty.
- O botão **Reconstruir o CSS** força uma regeneração completa: útil depois de uma intervenção manual nos ficheiros ou de um restauro de cópia de segurança.

## Verificar a conformidade RGPD

1. Abra a sua loja numa janela de navegação privada.
2. Abra as ferramentas de programador (F12), separador **Rede**, e filtre por `fonts.g`.
3. Recarregue a página: a lista deve ficar vazia. Se aparecer um pedido para `fonts.googleapis.com` ou `fonts.gstatic.com`, ative a opção de remoção das chamadas externas e limpe a cache do PrestaShop.

Teste a página inicial, uma ficha de produto e o checkout: alguns módulos de pagamento ou de widgets de terceiros carregam os seus próprios tipos de letra em iframes, fora do alcance da limpeza HTML (aplicam-se então as suas faixas de consentimento respetivas).

## Multiloja

Os tipos de letra importados e as regras de substituição são partilhados entre todas as lojas de uma mesma instalação. Os interruptores de ativação e a opção de remoção das chamadas externas seguem o contexto de configuração padrão do PrestaShop.

## Resolução de problemas

- **O tipo de letra não aparece no front-office**: verifique por ordem: o interruptor principal está ativado, a família está ativa, existe uma regra de substituição para o seletor certo, e a cache do PrestaShop foi limpa (Parâmetros avançados > Desempenho). Inspecione depois o elemento no navegador: se a regra aparecer riscada, um estilo do tema mais específico sobrepõe-se a ela; marque `!important` na regra.
- **A importação falha com um erro de rede**: o seu servidor deve poder alcançar `fonts.googleapis.com` e `fonts.gstatic.com` em saída (cURL ou allow_url_fopen). Num servidor atrás de uma firewall estrita, peça a abertura destes dois domínios ao seu alojamento.
- **O preenchimento automático não propõe nada**: o catálogo não pôde ser descarregado (rede). Clique no botão de atualização do catálogo, ou escreva o nome exato da família e valide com Enter: a importação direta funciona sem o catálogo.
- **Erro de escrita na importação ou na reconstrução**: dê permissões de escrita ao servidor web em `modules/dffontmanager/views/fonts/` e `modules/dffontmanager/views/css/generated/`.
- **Subsistem chamadas à Google apesar da opção de remoção**: identifique a fonte no separador Rede (coluna iniciador). Se se tratar de um iframe de terceiros (pagamento, avaliações, mapa), a limpeza HTML não se lhe pode aplicar: é o consentimento desse serviço de terceiros que rege.

## Atualização do módulo

Os ficheiros de tipos de letra e a folha gerada vivem na pasta do módulo. Uma atualização feita **sobrescrevendo a pasta** `modules/dffontmanager/` elimina os tipos de letra importados. Depois de tal atualização, abra o gestor e reimporte as suas famílias (dois cliques por família: as suas definições e regras, guardadas na base de dados, são conservadas). Uma atualização através do Gestor de módulos padrão desencadeia o mesmo comportamento: preveja a reimportação logo a seguir.

## Desinstalação

A desinstalação elimina as duas tabelas, as chaves de configuração, os ficheiros de tipos de letra descarregados e a folha de estilos gerada. A sua loja recupera instantaneamente os tipos de letra de origem do seu tema: nenhum resíduo.