Migalhas de pão

Adicione um trilho de navegação às suas páginas, controle onde aparece e mantenha o percurso visível alinhado com o schema de breadcrumbs.

Visão geral

O Migalhas de pão ajuda os visitantes a perceber onde a página atual se encontra na estrutura do site e dá aos motores de busca sinais mais claros de hierarquia.

Pode configurá-lo em Airygen SEO -> Definições -> Migalhas de pão.

Este módulo é especialmente útil para sites com páginas-pai, arquivos de categorias, resultados de pesquisa ou percursos de conteúdo profundos que os utilizadores devem conseguir percorrer de volta.

Métodos de saída

O Migalhas de pão suporta posicionamento manual e inserção automática no conteúdo.

Saída manual

Ative Ativar saída manual de breadcrumbs quando quiser colocar o trilho manualmente.

  • Use a Função de modelo quando quiser colocar os breadcrumbs dentro do template do tema.
  • Use o Shortcode quando quiser colocar os breadcrumbs dentro do conteúdo do artigo, num bloco de shortcode ou noutra área que aceite shortcodes.
  • Use o Bloco quando quiser colocar os breadcrumbs visualmente no editor de blocos.

Template function:

<?php if ( function_exists( 'airygen_the_breadcrumbs' ) ) { airygen_the_breadcrumbs(); } ?>

Shortcode:

[airygen_breadcrumbs]

Block:

<!-- wp:airygen/breadcrumb /-->

Injeção automática

Ative Ativar injeção automática de breadcrumbs quando quiser que o Airygen SEO insira o trilho na área principal do conteúdo por si.

  • O campo Posição de inserção permite colocar o trilho em Antes do conteúdo ou Após o conteúdo.
  • A inserção automática é adequada quando quer uma localização consistente dos breadcrumbs em muitos artigos.
  • O posicionamento manual é melhor quando precisa de controlo exato sobre a posição no tema ou no layout da página.

Se ativar ao mesmo tempo a saída manual e a inserção automática, verifique cuidadosamente a página publicada para garantir que o trilho não aparece em duplicado.

Configurações

A página está organizada em Definições, Layout e Pré-visualização.

Separador Definições

Use este separador para decidir como os breadcrumbs são apresentados e quais os itens que aparecem no trilho.

Controlos de saída

  • A opção Ativar saída manual de breadcrumbs disponibiliza os snippets Função de modelo, Shortcode e Bloco para a apresentação dos breadcrumbs.
  • A opção Ativar injeção automática de breadcrumbs insere os breadcrumbs no conteúdo do artigo com base na localização escolhida.
  • O campo Posição de inserção controla se a saída automática aparece Antes do conteúdo ou Após o conteúdo.

Hierarquia

Estes controlos decidem quanto da estrutura aparece na cadeia de breadcrumbs.

  • A opção Mostrar ligação de início inicia o trilho com a etiqueta e o URL da página inicial.
  • A opção Mostrar ligação de blogue em arquivos insere a página de artigos antes dos itens de arquivo quando o site usa uma página estática para artigos.
  • A opção Mostrar páginas ancestrais adiciona páginas-pai para tipos de conteúdo hierárquicos, como páginas e tipos de conteúdo personalizados hierárquicos.
  • A opção Ocultar pais de taxonomia remove termos-pai dos trilhos de categoria e taxonomia quando quer um caminho mais curto.
  • A opção Mostrar página atual inclui a página atual como o último breadcrumb e também afeta a lista JSON-LD de breadcrumbs.
  • A opção Mostrar paginação acrescenta o número da página atual em arquivos paginados.
  • O campo Separador define o símbolo mostrado entre os itens do breadcrumb.
  • O campo Prefixo adiciona texto antes do trilho, como uma pequena etiqueta no estilo “Está aqui”.

Etiquetas

Use estes campos para ajustar o texto dos breadcrumbs ao tom do site.

  • O campo Etiqueta de início altera o texto usado para o breadcrumb da página inicial.
  • O campo Etiqueta de arquivo altera a etiqueta usada nas vistas de arquivo.
  • O campo Etiqueta de resultados de pesquisa altera a etiqueta mostrada nas páginas de resultados de pesquisa.
  • O campo 404 label altera o texto mostrado nas páginas não encontradas.

Separador Layout

Use este separador para estilizar o contentor dos breadcrumbs e o próprio texto do trilho.

Estilo do contentor

  • O campo Largura da borda altera a espessura da borda do contentor.
  • O campo Cor do contorno altera a cor da borda.
  • O campo Preenchimento altera o espaçamento interior à volta do trilho.
  • O campo Cor de fundo do contentor altera o fundo por trás dos breadcrumbs.

Estilo do trilho

  • O campo Tamanho da fonte altera o tamanho do texto dos breadcrumbs.
  • O campo Cor do texto altera a cor do texto sem ligação.
  • O campo Cor da ligação altera a cor dos breadcrumbs com ligação.
  • A opção Sublinhar ligações ativa ou desativa o sublinhado das ligações.

Como usar

  1. Abra Airygen SEO -> Definições -> Migalhas de pão.
  2. No separador Definições, decida se quer Ativar saída manual de breadcrumbs, Ativar injeção automática de breadcrumbs ou apenas um método principal.
  3. Se quiser posicionamento ao nível do tema, ative Ativar saída manual de breadcrumbs e copie o snippet Função de modelo para a área do template onde o trilho deve aparecer.
  4. Se quiser posicionamento ao nível do editor, mantenha Ativar saída manual de breadcrumbs ativo e insira o Shortcode ou o Bloco na área do conteúdo onde o trilho deve aparecer.
  5. Se quiser posicionamento automático, ative Ativar injeção automática de breadcrumbs e escolha a Posição de inserção que melhor se adapta ao seu layout.
  6. Em Hierarquia, escolha se o trilho deve mostrar a ligação à página inicial, a ligação ao blogue em arquivos, páginas-pai, a página atual e detalhes de paginação.
  7. Defina um Separador legível e um Prefixo opcional para que o trilho combine com o tom do seu site.
  8. Em Etiquetas, personalize o texto para as vistas de início, arquivo, pesquisa e 404.
  9. Abra Layout e ajuste a borda do contentor, o padding, as cores e o estilo do texto para que o trilho combine com o tema.
  10. Abra Pré-visualização, alterne entre Portátil, Tablet e Telemóvel e reveja o trilho de exemplo antes de guardar.
  11. Guarde as definições e teste o frontend real num artigo, numa página de arquivo, numa página de pesquisa e numa página 404.

Depois de guardar, confirme estes pontos no site publicado:

  • O trilho de breadcrumbs aparece apenas uma vez em cada localização.
  • O trilho visível corresponde à hierarquia que quer que os utilizadores sigam.
  • A página atual aparece no trilho apenas quando Mostrar página atual está ativa.
  • O estilo publicado continua correto depois de o CSS do tema ser carregado.

Pré-visualização e saída real

O separador Pré-visualização mostra um exemplo simplificado de breadcrumbs com as suas definições de estilo atuais.

  • A pré-visualização inclui um seletor de dispositivo com Portátil, Tablet e Telemóvel.
  • A pré-visualização reflete as definições atuais de borda, espaçamento, cor e texto.
  • O ecrã também mostra exemplos gerados de HTML e CSS para que possa rever a estrutura de exemplo.

O site publicado pode continuar a parecer diferente da pré-visualização.

  • O trilho real depende do tipo de página, da estrutura de ascendentes, do caminho da taxonomia e do contexto de pesquisa ou 404.
  • A aparência final continua a poder ser afetada pelo tema ativo, pelo CSS personalizado e pelo layout à volta da página.
  • Se usar posicionamento manual e inserção automática ao mesmo tempo, a página real pode mostrar trilhos duplicados mesmo que a pré-visualização pareça limpa.

Depois de guardar, verifique um artigo real, um arquivo real, uma página de resultados de pesquisa e uma página 404 para confirmar o trilho visível e o comportamento do schema no frontend.

Benefícios de SEO

Os breadcrumbs tornam a hierarquia das páginas mais fácil de entender para os motores de busca e ajudam os visitantes a regressar de conteúdo profundo para secções mais amplas sem depender do botão anterior do navegador.

Também tornam as páginas de entrada vindas da pesquisa mais fáceis de explorar, o que é especialmente útil em sites com árvores de categorias, vistas de arquivo e percursos de conteúdo com vários níveis.

Casos de uso

Editores com estruturas temáticas em várias camadas

Antes: Um editor tem categorias, subcategorias e longas séries de artigos, mas os leitores não têm um caminho claro para voltar a páginas temáticas mais amplas.

Depois: O Migalhas de pão mostra o caminho para essas secções mais amplas, tornando as relações entre artigos mais fáceis de perceber e navegar.

Lojas WooCommerce ou catálogos com coleções profundas

Antes: Um comprador chega a uma página profunda de produto ou categoria a partir da pesquisa e não percebe imediatamente como essa página se integra no catálogo mais amplo.

Depois: O Migalhas de pão mantém visível o caminho da categoria para que o comprador possa entrar numa coleção mais ampla sem recomeçar do zero.

Agências a normalizar a estrutura do site em vários clientes

Antes: Cada site trata o posicionamento dos breadcrumbs de forma diferente, o que dificulta manter navegação e schema consistentes.

Depois: O Migalhas de pão dá à agência um único local para controlar posicionamento, etiquetas e layout, mantendo a possibilidade de escolher entre saída manual e inserção automática em cada site.

Perguntas frequentes

Devo usar saída manual ou inserção automática?

Use a saída manual quando precisar de posicionamento exato num template ou numa área de conteúdo. Use a inserção automática quando quiser o trilho inserido num local consistente em muitos artigos.

O que devo fazer se os breadcrumbs aparecerem duas vezes?

Verifique se ativou Ativar injeção automática de breadcrumbs e também colocou o Shortcode, o Bloco ou a Função de modelo na mesma página. Mantenha apenas o método de saída que realmente quer para essa localização.

Porque é que a pré-visualização não corresponde exatamente à página publicada?

A pré-visualização é uma representação simplificada das suas definições de estilo. A saída real continua a depender da hierarquia real da página, da query atual e do CSS do tema.