La guida fondamentale all'aggiunta di breadcrumb di WordPress
Pubblicato: 2021-11-26
Vuoi ridurre le frequenze di rimbalzo, migliorare la navigazione del sito Web, aumentare la SEO e offrire esperienze utente straordinarie? Certo che lo fai!
Ma se non stai usando breadcrumb come parte del tuo sito web, stai perdendo una grande opportunità. Le breadcrumb migliorano la navigazione del sito aiutando gli utenti a viaggiare più facilmente attraverso le tue pagine web (tramite una scia di "breadcrumbs").
È probabile che tu abbia incontrato breadcrumb molte volte. Spesso compaiono appena sotto il menu di navigazione di un sito.
Fonte: dedoles.se
Oggi condivideremo i nostri migliori suggerimenti e trucchi per aiutarti ad aggiungere breadcrumb di WordPress al tuo sito e iniziare a migliorare quelle esperienze utente.
Cosa sono le briciole di pane?
Dimentica il dorato e croccante, appena tostato o il panko. Quelle briciole di pane possono essere davvero deliziose, ma non è di questo che siamo qui per parlare oggi. No, siamo qui per discutere di breadcrumb online , un boccone complessivamente più funzionale (e meno commestibile).
Un breadcrumb è essenzialmente un collegamento di navigazione. I breadcrumb sono collegati per creare un percorso di testo attraverso le pagine di un sito web. Tracciano dove si trova un utente su un sito Web in relazione alla home page e di solito si trovano in alto, appena sotto la barra di navigazione.
Le breadcrumb migliorano l'esperienza utente (UX) del tuo sito rendendo più facile per gli utenti tornare sui propri passi. Supportano anche le classifiche SEO aiutando i motori di ricerca a navigare attraverso le tue pagine web e le strutture dei link (ne parleremo più avanti).
Capire come funzionano i diversi breadcrumb
I breadcrumb possono essere applicati a un sito Web per una serie di motivi. Per i siti Web creati in WordPress, ad esempio, esistono tre tipi di breadcrumb che possono essere incorporati nella navigazione di un sito. Questi sono basati sulla gerarchia, sugli attributi e sulla cronologia.
Pangrattato basato sulla gerarchia
Queste sono le tue classiche briciole di pane. I breadcrumb basati sulla gerarchia mostrano agli utenti del sito web dove si trovano nella struttura generale del tuo sito rispetto alla home page. Ciò consente ai visitatori di navigare facilmente tra le categorie e trovare prodotti correlati.
Pangrattato basato sugli attributi
Questi breadcrumb si trovano più spesso come parte dei siti di eCommerce. I breadcrumb basati sugli attributi elencano gli attributi che un utente ha cercato per raggiungere il prodotto o la pagina che sta visualizzando.
Ad esempio, immagina di navigare in un negozio di moda online. A volte, ti potrebbe essere chiesto di affinare la tua ricerca in termini di attributi del prodotto (ad es. vestibilità, stile, colore, taglia). Gli attributi che scegli costituiranno la tua traccia breadcrumb.
Fonte immagine
Pangrattato basato sulla storia
Questi breadcrumb sono cronologici. Sono ordinati in base a ciò che fai su un sito web. I breadcrumb basati sulla cronologia riportano gli utenti indietro attraverso le pagine che hanno già navigato. Questi breadcrumb agiscono un po' come il pulsante "indietro" sul tuo browser per aiutare gli utenti a tornare a una pagina che hanno già visitato.
Benefici delle briciole di pane
I breadcrumb sono incredibilmente utili per l'UX e la SEO di un sito web. Pertanto, molti servizi di content marketing stanno promuovendo i vantaggi dei breadcrumb come parte di una solida strategia di marketing digitale.
I breadcrumb consentono agli utenti di navigare più facilmente in un sito Web e aiutano i crawler dei motori di ricerca a comprendere il contenuto di un sito. Ciò significa un migliore posizionamento nei motori di ricerca, frequenze di rimbalzo più basse e migliori esperienze utente ovunque.
Navigazione del sito più semplice per i visitatori, che significa frequenze di rimbalzo inferiori
Come visitatore di un sito Web, non c'è niente di più fastidioso che scoprire di aver navigato su una pagina di prodotto a cui non sei minimamente interessato. A questo punto, probabilmente vorrai fare una delle due cose.
- Torna al motore di ricerca e ricomincia da capo.
- Torna alla home page e prova a trovare la pagina che stavi cercando.
Aggiungendo breadcrumb al tuo sito, gli utenti saranno meno inclini a rimbalzare e troveranno molto più facile individuare ciò che stanno cercando. I breadcrumb consentono ai visitatori del sito di tracciare facilmente il percorso dell'utente e individuare rapidamente le pagine desiderate.
I crawler del sito hanno più facilità a classificare le pagine giuste
Le breadcrumb potenziano la SEO del sito comunicando ai motori di ricerca di cosa trattano le pagine di un sito. Google utilizza effettivamente il nome di un sito e il percorso breadcrumb nei frammenti di ricerca, il che significa che è una delle prime cose che vedrai quando Google visualizza un elenco di risultati. Questo, a sua volta, aiuta i ricercatori a vedere dove verranno portati dopo aver fatto clic.
Ad esempio, se cerchi "che cosa sono i breadcrumb?" in Google, i risultati della tua ricerca elencano l'URL, i breadcrumb e il titolo di ogni sito web.
Tre metodi per aggiungere breadcrumb al tuo sito WordPress
Quindi, come fai esattamente ad aggiungere breadcrumb al tuo sito WordPress? Bene, ci sono alcune strade diverse che puoi prendere. Ti guideremo passo dopo passo attraverso i vari metodi.
Seleziona un tema WordPress che includa già breadcrumb
Il modo più semplice per aggiungere breadcrumb al tuo sito WordPress è installare un tema che li includa già. Se riesci a trovarne uno che si allinea bene con il tuo marchio e ha anche utili briciole di pane, allora presto, sei pronto per partire.
Implementa i breadcrumb tramite codice personalizzato
Un altro modo per aggiungere breadcrumb al tuo sito WordPress è implementarli tramite codice personalizzato. Supponiamo di trovare un tema su WordPress ma non viene fornito con breadcrumb inclusi. Con un po' di esperienza di programmazione di base, puoi aggiungerli tu stesso modificando il file function.php sul tema scelto.

Ecco cosa dovrai fare:
- Collega WordPress al tuo server utilizzando un sito FTP come FileZilla FTP .
- Fai clic sulla cartella public_html nel client FileZilla (questo include i file del tuo sito Web).
- Fare clic sulla cartella del contenuto wp.
- Fai clic sulla directory dei temi e scegli la cartella del tema corrente.
- Fare clic sulla cartella functions.php quindi selezionare visualizza/modifica.
- Inserisci il codice qui sotto per registrare la funzione breadcrumb sul tuo sito.
- Salva le modifiche e carica il file aggiornato quando richiesto.
Usa un plugin per aggiungere breadcrumb.
Un terzo e ultimo modo per aggiungere breadcrumb al tuo sito WordPress è utilizzare un plug-in. Avrai bisogno di utilizzare uno strumento specializzato per farlo come Yoast SEO, Breadcrumb NavXT o il plug-in WooCommerce Breadcrumbs.
Utilizzo del plugin Yoast SEO
Yoast è uno dei plugin SEO più conosciuti per WordPress e può essere utilizzato per abilitare i breadcrumb sul tuo sito web. Se stai già utilizzando Yoast per SEO, questa è la soluzione migliore, anche se sono disponibili altre opzioni (di cui parleremo tra poco).
Per aggiungere il pangrattato usando Yoast, procedi nel seguente modo:
- Installa il plug-in Yoast SEO dalla dashboard di WordPress, ad esempio plug-in> aggiungi nuovo> digita "Yoast" nella barra di ricerca> installa.
- Nel plug-in Yoast, vai all'aspetto.
- Fare clic sull'editor del tema.
- Seleziona il modello chiamato header.php.
- Inserisci lo snippet di codice qui sotto.
- Salva le modifiche facendo clic su "Aggiorna file".
Utilizzando il plugin Breadcrumb NavXT
Un'altra alternativa all'utilizzo di Yoast è Breadcrumb NavXT. Questo plugin può essere installato sul tuo sito proprio come Yoast. Una volta installato, segui semplicemente i passaggi seguenti per implementare i breadcrumb.
- Nel plug-in NavXT vai alle impostazioni.
- Fare clic su breadcrumb NavXT.
- Scegli tra le quattro opzioni di navigazione breadcrumb.
- Configura il plugin e salva le modifiche.
- Vai all'aspetto.
- Fare clic sull'editor del tema.
- Seleziona il file header.php.
- Inserisci il codice qui sotto.
- Fare clic su Aggiorna file.
Utilizzo del plugin Woocommerce Breadcrumbs
Infine, se sei un utente Woocommerce, puoi utilizzare il plugin Woocommerce Breadcrumbs per aggiungere funzionalità breadcrumb al tuo sito web.
Ecco cosa dovrai fare:
- Installa il plugin Woocommerce Breadcrumbs sul tuo sito WordPress.
- Passa alle impostazioni.
- Fare clic su briciole di pane WC.
- Spunta la casella accanto per abilitare i breadcrumb.
- Fare clic su Salva modifiche .
Fonte: fixrunner.com
Personalizza i breadcrumb di WordPress con CSS
Puoi dare uno stile ai breadcrumb applicando CSS personalizzati per abbinare lo stile unico del tuo sito web. Se stai codificando le tue briciole di pane da solo, dovrai pensare all'estetica a cui miri.
Per fare ciò, dovrai aggiungere CSS personalizzati per dare uno stile ai tuoi breadcrumb all'interno del tuo foglio di stile del tema esistente o dal Customizer di WordPress. Qui sarai in grado di apportare modifiche al design ai tuoi breadcrumb, incluso l'adattamento di caratteri, colori, margini, icone e bordi.
Due modi per rimuovere i breadcrumb dal tuo sito
I breadcrumb hanno ovvi vantaggi quando si tratta di aiutare la navigazione del sito e la SEO per la crescita , ma non a tutti piace includerli. Se hai deciso di rimuovere i breadcrumb del tuo sito, ci sono due modi per farlo.
Attiva o disattiva l'interruttore di disabilitazione
Il primo modo per rimuovere i breadcrumb è semplicemente attivare l'interruttore nel tuo plug-in per disabilitare i breadcrumb o disattivare del tutto il plug-in.
Rimuovere il codice inserito manualmente
L'altra opzione è rimuovere il codice inserito manualmente. Torna semplicemente alla cartella header.php del tuo sito ed elimina la riga di codice che aggiunge breadcrumb al tuo sito.
Lascia una scia di pangrattato
I breadcrumb sono un'ottima aggiunta a qualsiasi sito web. Aiutano gli utenti a navigare attraverso le tue pagine web e i crawler dei motori di ricerca per capire un po' meglio i tuoi contenuti.
Inoltre, incorporare i breadcrumb nel tuo sito è abbastanza semplice. Alcuni modelli di WordPress includono anche breadcrumb.
Se non stai già impastando, cosa aspetti?