SEO e realizzazione siti web Udine a misura di PMI

menu x
menu x

Breadcrumbs WordPress: attivare e ottimizzare le briciole di pane

  • 28 Novembre 2022
Laura Musig Siti web Udine » Blog SEO » Breadcrumbs WordPress: attivare e ottimizzare le briciole di pane
Si parla di:
breadcrumbs-wordpress

Le breadcrumbs (letteralmente briciole di pane) sono un sistema di navigazione presente su siti internet ed interfacce web. Volevo parlarne in questo blog, perchè è un argomento che coinvolge sia l’ambito web design che l’ambito posizionamento sui motori di ricerca. In altre parole, non solo vanno a migliorare l’esperienza utente facilitando la navigazione del sito, ma hanno anche un impatto SEO.

Che cosa sono le breadcrumbs

Le breadcrumbs sono piccolo percorso di navigazione testuale, spesso posizionato nella parte superiore di una pagina che indica dove si trova l’utente sul sito. Questa traccia rappresentata dalle breadcrumb ti mostra immediatamente dove sei. Ogni passaggio di quel percorso è selezionabile, fino alla home page.

Ma perché questo aiuto alla navigazione è chiamato briciole di pane? Quando Hansel e Gretel andarono nel bosco, Hansel lasciò cadere dei pezzi di pane a terra in modo che potessero ritrovare la strada di casa se si fossero persi. Questi breadcrumb alla fine sono diventati il modello per quelli che vediamo sui siti web attualmente.

Perchè attivare le bread crumbs

Le breadcrumb sono un elemento essenziale per evidenziare „la via“, orientando l’utente e offrendo l’accesso con un clic a pagine pertinenti di livello superiore. Ciò è particolarmente importante quando un visitatore atterra su una pagina più all’interno della gerarchia del sito web.

Come attivare le breadcrumbs su WordPress

Tendenzialmente molti temi WordPress includono nei templates delle loro pagine i breadcrubs. Qualora questo non fosse vero, è sempre possibile farlo in fase di ottimizzazione Onpage del proprio sito. Il mio consiglio è quello di utilizzare le bredcrumbs Yoast, una funzione nativa del celebre plugin SEO che vi consente non solo di attivare le briciole di pane ma di poterle ottimizzare in ottica SEO.

Dalla dashboard di WordPress cliccate su Yoast, quindi su Aspetto della ricerca ed infine su Breadcrumbs. Attivate l’omonima funzione e quindi salvate. A questo punto dovete inserire il richiamo alle breadcrumbs all’interno delle vostre pagine. A questo punto potete operare in due modi.

Breadcrumbs Yoast – Shortcode

Se volete includere le breadcrumbs di Yoast in una singola pagina o post non dovete fare altro che includere il seguente shortcode all’interno dell’editor di testo del contenuto considerato e quindi clicccare su Aggiorna.

wpseo-shortcode-bc
Qui sopra lo short code wp seo breadcrumbs di Yoast.

Lo shortcode appena mostrato può essere incollato con praticità dentro l’editor Gutenberg o nei website builder più popolari come Elementor o Wp Bakery.

Breadcrumbs Yoast – Php

Se invece volete inserire le breadcrumbs a livello globale all’interno del tema vi basterà includere la seguente funzione php, all’interno dei file del tema. Potrebbe trattarsi di template specifici come quelli rappresentati dai file page.php o single.php oppure a livello generale potreste dover includere il codice php di Yoast all’interno del file header.php.

<?php if ( function_exists('yoast_breadcrumb') ) {   yoast_breadcrumb( '<p id="breadcrumbs">','</p>' ); } ?>

Ottimizzazione SEO delle breadcrumbs

Dal momento che le breadcrumbs hanno rilevanza SEO è bene effettuare qualche semplice ottimizzazione per i motori di ricerca.

Il primo elemento che vado ad ottimizzare è il primo livello ovvero il link alla home. Di default avremmo una situazione come questa:

Home / Pagina madre / Pagina figlia

Questo significa che se tutte le pagine del nostro sito dispongono delle briciole di pane, avremmo tantissimi collegamenti che linkano l’home page del sito attraverso l’anchor text Home, che come immaginiamo non è una keyword commerciale (money keyword) nè una keyword brandend. Pertanto se entriamo nelle impostazioni di Yoast per le briciole di pane, potremmo cambiare il link a Home con:

  1. Il nome del sito / dell’azienda
  2. Il nome dell’azienda + una keyword commerciale per la quale vogliamo sia posizionata l’home page.
  3. La keyword commerciale per la quale vogliamo sia posizionata l’home page.

Il mio consiglio è quello di utilizzare l’opzione 2, in quanto la meno sfacciata.

bread-crumbs-home

Il secondo consiglio per di ottimizzazione riguarda il miglioramento dell’aspetto (nelle breadcrumbs ) delle singole pagine o sottopagine.

Questa ottimizzazione è eccellente se volete avere dei link che rimandino ad una certa pagina attraverso una keyword commerciale che non avete potuto utilizzare nel titolo della pagina o nel main menu dal quale questa pagina è richiamata. Questa schermata vi chiarirà meglio cosa intendo.

tab-avanzate-yoast

Per ottenere questo risultato dovete entrare in una specifica pagina o post in cui volete effettuare le ottimizzazioni, posizionatevi sul box dedicato a Yoast e cliccate sulla tab Avanzate. Cercato il campo dedicato alle breadcrumbs e cambiate il rimando alla pagina come credete.

La presenza delle breadcrumbs

Se l’installazione delle breadcrumbs è avvenuta correttamente, ve ne accorgerete dall’osservazione della SERP, ma ovviamente questo non accadrà immediatamente e dovremmo aspettare la nuova scansione da parte del crawler di Google. Per verificare immediatamente la corretta installazione delle briciole di pane possiamo utilizzare il Test dei risultati multimediali di Google. Se il tool vi mostra la tab “Breadcrumb“, l’installazione è stata fatta correttamente.

Breadcrumb WordPress: i migliori plugin

Se non volete utilizzare necessariamente Yoast, potete sempre utilizzare un plugin WordPress specifico per le breadcrumb. Qui sotto ve ne elenco alcuni, concentrandomi sui plugin free.

Breadcrumb NavXT

Sviluppato come il successore evoluto del famoso Breadcrumb Navigation XT, questo plugin è stato riscritto da zero per offrire una performance ancora più straordinaria e una personalizzazione senza precedenti.  Con Breadcrumb NavXT, la navigazione breacrumb prende vita, guidando i tuoi visitatori in un viaggio intuitivo attraverso le pagine del tuo blog o del tuo sito WordPress. Che tu sia un esperto sviluppatore di temi o un utente appassionato, questo plugin ti permette di creare percorsi breadcrumb altamente personalizzabili, adattandoli alle esigenze specifiche del tuo sito web.

Breadcrumbs Divi Module

Questo plugin ti offre la possibilità aggiungere un modulo Breadcrumbs direttamente nel Divi Builder. Una volta attivato, il plugin ti mette a disposizione un modulo Breadcrumbs personalizzato, disponibile nella tua lista di moduli. In altre parole ti offre le funzionalità per posizionare i Breadcrumbs ovunque desideri all’interno del Divi Builder.

Le caratteristiche che lo rendono unico:

– Supporto completo del Visual Builder: crea facilmente e velocemente il tuo percorso di navigazione ideale grazie all’interfaccia visiva intuitiva.

– Personalizzazione del separatore: scegli tra un’ampia selezione di icone Divi quella che meglio si adatta al tuo stile e al tuo sito.

– Cambio dei colori per i link, il testo e l’icona: rendi i tuoi Breadcrumbs coerenti con l’immagine del tuo brand, personalizzando i colori in base alle tue preferenze.

Con questo plugin innovativo, la creazione di una navigazione chiara e user-friendly diventa un gioco da ragazzi.

WooCommerce Breadcrumbs

WooCommerce Breadcrumbs è un semplice plugin per WordPress, con potrai trasformare l’aspetto delle breadcrumbs di WooCommerce. Inoltre, avrai la possibilità di disabilitarle completamente, evitando così la loro visualizzazione.

Grazie alla modifica dell’HTML che circonda le tue breadcrumbs, potrai ottenere un’ampia scelta di stili. Ad esempio, invece delle breadcrumbs di navigazione predefinite con i semplici collegamenti e il carattere separatore, grazie a WooCommerce Breadcrumbs potrai trasformarle in un elenco non ordinato di collegamenti.

NOTA: Questo plugin non si occuperà direttamente dello stile delle briciole di navigazione. Ti fornirà semplicemente gli strumenti necessari per modificare l’HTML che le circonda.

Laura Musig SEO UdineLaura Musig

Web Designer e SEO Freelance a Udine o se preferite web designer SEO. Nel 2001 decisi di sezionare un sito web per vedere cosa c’era dentro, da allora creo e gestisco siti web. Lettrice onnivora, con un fisiologico bisogno di scrivere e di ballare.

Come diventare SEO:


Corso SEO

Ho inoltre raccolto le risorse più utili di questo blog per aiutare chi sta cercando di capire come si diventa SEO Specialist:

SEOZoom

Blog SEO e ultime news

In questa sezione propongo periodicamente approfondimenti a tema SEO e web marketing. Segnalo anche gli ultimi lavori di creazione siti web ad Udine e di posizionamento sui motori di ricerca. 

Perchè non leggi anche questi post?

Leggi tutti i post dal mio blog seo