Cercate un modo semplice per aggiungere la navigazione breadcrumb al vostro sito?
L'aggiunta di una navigazione a briciole di pane presenta vantaggi sia per la SEO che per gli utenti.
In questa esercitazione si apprenderà come aggiungere la navigazione a briciole di pane e alcune opzioni per personalizzare i percorsi a briciole di pane.
In questo articolo
- Che cos'è la navigazione a briciole?
- Vantaggi delle briciole di pane
- Passo 1: Scaricare e installare All in One SEO (AIOSEO)
- Passo 2: Attivare le briciole di pane
- Fase 3: Scegliere un'opzione di visualizzazione
- Impostazioni delle briciole di pane
- Utilizzo dei modelli di Breadcrumb Pro
- Tipi di navigazione Breadcrumb
- Migliori pratiche
Che cos'è la navigazione a briciole?
Le briciole di pane sono piccoli link che mostrano agli utenti il percorso seguito per arrivare alla pagina in cui si trovano.
Questi collegamenti sono chiamati anche " breadcrumb trail".
Il termine deriva dalla fiaba di Hansel e Gretel. Hansel lascia una scia di briciole di pane quando si addentra con la sorella nel bosco. Spera di usare quelle briciole per ritrovare la strada di casa.
Vantaggi delle briciole di pane
Le briciole di pane aiutano i motori di ricerca a capire l'argomento della pagina e la gerarchia del sito.
Queste briciole di pane possono aiutare la pagina a posizionarsi per le parole chiave di destinazione o correlate.
Inoltre, poiché i percorsi breadcrumb sono collegamenti interni, possono anche aiutare i motori di ricerca a scansionare il vostro sito.
Markup Schema
L 'aggiunta di breadcrumb schema markup alle pagine web comporta anche un vantaggio SEO. Questo tipo di codice HTML aiuta Google a comprendere meglio la vostra pagina.
I plugin SEO di WordPress, come All in One SEO (AIOSEO), aggiungono automaticamente questo codice per voi.
Esperienza utente migliorata
Le briciole di pane aiutano inoltre gli utenti a navigare in un sito senza utilizzare il pulsante indietro del browser. Per questo motivo, le briciole di pane possono offrire una migliore esperienza all'utente, ridurre la frequenza di rimbalzo e aumentare il coinvolgimento.
I siti complessi, compresi i negozi di e-commerce con gerarchie annidate, traggono notevoli vantaggi dalla navigazione breadcrumb.
In questo tutorial vi mostreremo come aggiungere le briciole di pane e come visualizzarle e personalizzarle.
Utilizzeremo il plugin All in One SEO (AIOSEO).
Passo 1: Scaricare e installare All in One SEO (AIOSEO)
Innanzitutto, scaricate e installate All in One SEO (AIOSEO).
Questo plugin include un generatore di breadcrumb. Ha anche tutto ciò che serve per la SEO. Ed è adatto ai principianti.
All in One SEO (AIOSEO) è un plugin affermato con migliaia di recensioni a 5 stelle su WordPress.org. Attualmente, oltre 3 milioni di proprietari di siti utilizzano il plugin.
Passo 2: Attivare le briciole di pane
Dopo aver installato il plugin, andare su AIOSEO " Impostazioni generali " Briciole di pane.
Attivare il pulsante Abilita briciole di pane.
Di seguito, vengono visualizzate 4 opzioni per l'aggiunta di briciole di pane al sito.
Fase 3: Scegliere un'opzione di visualizzazione
Ecco quali sono le 4 opzioni
- Blocco o shortcodedi Gutenberg: Utilizzateli per aggiungere briciole di pane alle singole pagine.
- Widget: Utilizzatelo per aggiungere le briciole di pane alla barra laterale o al piè di pagina del vostro blog.
- Codice PHP: Utilizzatelo per aggiungere istantaneamente le briciole di pane a tutto il sito (a tutte le pagine).
Tutti questi metodi sono facili da usare. Vediamo di illustrarli passo per passo.
Metodo 1: Blocco Gutenberg
Come forse sapete, WordPress è dotato dell'editor Gutenberg, che utilizza blocchi cliccabili per aggiungere elementi a una pagina.
Questi elementi possono essere un paragrafo, un elenco puntato, un'immagine o una tabella.
All in One SEO offre alcuni blocchi speciali di Gutenberg, tra cui il blocco AIOSEO - Breadcrumbs.
Per utilizzare questo blocco, aprire una pagina e posizionare il cursore nel punto in cui si desidera aggiungere le briciole di pane.
- Fare clic sul segno "+"nero per aggiungere un nuovo blocco.
- Nella finestra a comparsa, cercate "briciole di pane" e apparirà il blocco AIOSEO - Briciole di pane.
- Fare clic su di esso per aggiungere le briciole di pane alla pagina.
Metodo 2: Shortcode
C'è anche uno shortcode AIOSEO unico per aggiungere briciole di pane.
I codici brevi di WordPress sono piccole parti di testo che si copiano e incollano in una pagina per aggiungere un elemento, come un indice.
Come i blocchi di Gutenberg, gli shortcode sono veloci e facili da usare.
Tornare a AIOSEO " Impostazioni generali " Briciole di pane per ottenere lo shortcode delle briciole di pane.
- Fare clic su Shortcode ico.
- E copiare lo shortcode AIOSEO breadcrumbs sotto di esso.
A questo punto, navigare in una pagina del sito a cui si desidera aggiungere le briciole di pane.
Quindi incollate il codice breve nel vostro articolo.
Quando si visualizza l'anteprima della pagina web, si può notare che le briciole di pane sono state aggiunte.
Metodo 3: Widget
I widget di WordPress consentono di aggiungere funzionalità a parti permanenti del sito, come le barre laterali e i piè di pagina.
I widget includono calendari, caselle di ricerca e archivi.
Per aggiungere le briciole di pane al sito utilizzando l'opzione widget, andare su Aspetto " Widget.
(Se il vostro tema supporta le aree widget, lo vedrete nel menu).
Si aprirà una nuova finestra. Sul lato destro si vedrà una replica scorrevole della barra laterale.
A questo punto, fare clic sull'icona "+"accanto alla parola Widget.
Si aprirà una casella di ricerca. Iniziare a digitare "briciole di pane" e apparirà il widget briciole di pane di AIOSEO.
Trascinare il widget nella posizione in cui si desidera che appaia nella barra laterale.
Nel nostro esempio, lo trascineremo nell'area del piè di pagina.
Ora le briciole di pane appariranno nel piè di pagina della barra laterale.
Naturalmente, è possibile avere briciole di pane nella barra laterale e nella parte superiore delle pagine.
Metodo 4: Codice PHP
È possibile aggiungere facilmente le briciole di pane a tutto il sito utilizzando uno snippet di codice PHP.
Copiate e incollate questo frammento come se fosse un normale testo.
Il vantaggio di questa opzione è che aggiungerà automaticamente le briciole di pane a tutte le pagine e non sarà più necessario ripetere l'operazione.
Questi sono i passaggi:
- Copiare il frammento di codice.
- Aprire l'editor dei temi.
- Fare clic su header.php.
- Incollare il frammento di codice.
Esaminiamo questi passaggi.
1. Copiare il frammento di codice
Nella pagina Breadcrumbs di AIOSEO,
- Fare clic su Codice PHP. Apparirà una piccola riga di codice.
- Fare clic sulla piccola icona di copia a destra dello snippet di codice.
Ora che avete copiato questa riga di codice, la incollerete nel vostro tema.
2. Aprire l'editor dei temi.
- Nella navigazione a sinistra di WordPress, andare su Aspetto " Editor dei file del tema.
Si aprirà una nuova finestra come questa:
3. Fare clic su header.php
- Nella colonna di destra(File del tema), scorrere fino a trovare header.php e fare clic su di esso.
In questo modo apparirà una nuova finestra di codice a sinistra.
4. Incollare il codice.
- Look for the </head> tag.
- Sotto di esso, incollare il frammento di codice PHP.
- Quindi fare clic su Aggiorna file per salvare le modifiche.
Here’s a close-up of the </head> tag and the PHP breadcrumb code snippet.
Dopo aver fatto clic su Aggiorna file, tutte le pagine Web avranno aggiunto le briciole di pane.
E anche i nuovi post o le nuove pagine li avranno.
Watch out: Before the </head> tag, there’s a <head> tag (without the slash). The PHP code snippet must go after the </head> tag.
Ora che sapete come aggiungere le briciole di pane al vostro sito WordPress, vi mostreremo come personalizzarne l'aspetto.
Impostazioni delle briciole di pane
La modifica delle impostazioni delle breadcrumb altera l'aspetto dei percorsi delle breadcrumb.
Queste impostazioni includono le opzioni per:
- Includere o omettere la propria homepage.
- Utilizzate diversi stili di separatori.
- Include o omette la pagina corrente (titolo della pagina) in cui si trova l'utente.
Per prima cosa, si vedrà l'Anteprima nella parte superiore dell'area delle impostazioni del Breadcrumb.
Man mano che si regolano le impostazioni, l'anteprima cambia.
Sotto l'anteprima, è possibile sperimentare diversi stili di separatore.
È possibile disattivare il collegamento alla homepage o assegnargli un'etichetta diversa. ("Home" è l'etichetta predefinita).
Scorrere un po' in basso.
Qui sono disponibili altre due opzioni di personalizzazione.
- Prefisso delle briciole di pane: Se si desidera visualizzare un testo all'inizio del percorso, inserirlo qui.
- Mostra la home del blog: selezionare "Off" se non si desidera che il nome del blog appaia nel percorso delle briciole di pane.
Per saperne di più sulle impostazioni delle briciole di pane.
Utilizzo dei modelli di Breadcrumb Pro
Se si utilizza la versione Pro di All in One SEO (AIOSEO), le opzioni relative ai modelli di briciole di pane si trovano nella parte inferiore di AIOSEO " Impostazioni generali " Briciole di pane.
I modelli consentono di modificare l'aspetto delle briciole di pane. È possibile scegliere opzioni diverse per i vari tipi di post.
Per saperne di più sui modelli di breadcrumb.
Tipi di navigazione Breadcrumb
Oltre alle briciole di pane basate sulla gerarchia descritte in precedenza, esistono altri 2 tipi di briciole di pane per la navigazione.
Le briciole di pane basate sulla gerarchia sono chiamate anche briciole di pane basate sulla posizione.
Briciole di pane basate sulla storia (briciole di pane basate sul percorso)
Questo tipo di navigazione visualizza le pagine visitate in un sito.
Può diventare ingombrante quando gli utenti visitano molte pagine.
Briciole di pane basate sugli attributi
Alcuni siti web di e-commerce includono gli attributi dei prodotti, come il colore, la finitura o la dimensione, nei loro percorsi breadcrumb.
Questi possono essere combinati con briciole di pane basate sulla gerarchia.
Migliori pratiche
Google raccomanda che le briciole di pane corrispondano alla gerarchia del sito.
Detto questo, non dovrebbero replicare o sostituire gli elementi di navigazione principali.
Sintesi
Le briciole di pane possono migliorare l'usabilità del sito web e aiutare le pagine a posizionarsi meglio nei risultati di ricerca di Google.
I siti di e-commerce con molte pagine di prodotti e i siti ricchi di informazioni trarranno notevoli vantaggi dalla navigazione breadcrumb. Ma qualsiasi proprietario di sito può aggiungerla.
Cosa c'è dopo?
Ora che avete imparato ad aggiungere il pangrattato, qual è il prossimo passo?
Imparare ad aggiungere una sitemap HTML al vostro sito web WordPress è facile. Ed esplorate i nostri progetti SEO fai-da-te per principianti.
Se questo articolo vi è stato utile, iscrivetevi al nostro canale YouTube. Vi troverete molte altre esercitazioni utili. Potete anche seguirci su X (Twitter), LinkedIn o Facebook per rimanere aggiornati.
Vuoi provare AIOSEO gratuitamente?
Inserite l'URL del vostro sito web WordPress per installare AIOSEO Lite.
Divulgazione: I nostri contenuti sono sostenuti dai lettori. Ciò significa che se cliccate su alcuni dei nostri link, potremmo guadagnare una commissione. Raccomandiamo solo prodotti che riteniamo possano apportare un valore aggiunto ai nostri lettori.
L'articolo inizia bene, ma poi non mi viene spiegato a sufficienza perché (e come) dovrei intraprendere determinate azioni relative alle breadcrumb sul mio sito web - l'autore presuppone conoscenze che io non possiedo. Quindi non sono sicuro di intraprendere alcuna azione. Nel complesso, questo articolo non è sufficientemente adatto ai principianti.