Come aggiungere le breadcrumbs al tuo sito wordpress grazie a yoast

copertina-inserire-le-breadcrumbs-in-wordpress-con-yoast

Come aggiungere le breadcrumbs al tuo sito wordpress grazie a yoast.

Aggiornato a Marzo 2018

Se vuoi scoprire come aggiungere facilmente le breadcrumbs al tuo sito wordpress, senza impazzire, te lo spiego passo passo e con le immagini in questo articolo.

Cosa sono le breadcrumbs?

Letteralmente briciole di pane, ci aiutano nella navigazione di un sito internet proprio come aiutano Hansel e Gretel a fare ritorno a casa (circa) nell’omonima fiaba. Sono generalmente riconoscibili come una riga di testo contente i passaggi che hai eseguito su un determinato sito internet, e riportano in generale alla homepage dello stesso. Potete trovarne un esempio
pratico in cima a questo articolo, per comodità vi allego un’immagine di come appaiono:

esempio breadcrumbs

Utilità delle breadcrumbs

Le principali funzioni delle breadcrums sono due:

  • mostrare il percorso fatto all’interno di un sito
  • creare un senso di orientamento per chi naviga

Per quanto possano sembrare semplici da implementare, non tutti i temi le utilizzano di default. La prima soluzione sarebbe quella di ricercare un plugin dedicato su wordpress.org ma la verità è che se il tuo sito è realizzato in wordpress, nel 90% dei casi puoi sfruttare un tool che stai già adoperando: YOAST (plugin dedicato al SEO, se non avete idea del perchè dovreste assolutamente farne uso, ve lo spiegherò in un articolo futuro).

I 3 passaggi per installare le breadcrumbs

1) Installare YOAST (se già non lo avete)

  • Dal back-end del vostro sito (quindi da dove applicate le modifiche), navigate il menù Plugin > Aggiungi nuovo (img 1.1)
  • Dalla barra di ricerca sul lato destro, cercate “yoast” e installatelo (img 1.2)
aggiungere-nuovo-plugin
installate-yoast

2) Abilitare le breadcrumbs di yoast

  • Dal menù a sinistra navigate fino alla voce Seo > Search appearance (img 2.1)
  • Vi si aprirà una pagina con un menù orizzontale, cercate la voce “Breadcrumbs” (img 2.2)
  • Cliccate sulla voce “Abilitato” per attivarle (img 2.3)
abilitare-breadcrumbs-yoas
trovare-la-voce-breadcrumbs
abilitare breadcrumbs

NOTA BENE

1) Già da questa pagina potrete personalizzare alcuni aspetti delle vostre breadcrumbs, perdeteci 1 minuto per configurarle come preferite.

2) A questo punto, ancora non vedrete le breadcrumbs in nessuna pagina del sito, ma non preoccupatevi, è normale e manca soltanto un passaggio.

3) Inserire le breadcrumbs nelle pagine

Qui vi si presentano due strade:

  • Manuale pagina per pagina e senza codici complicati (php)
  • Globale ma che richiede un minimo di competenze nella lettura del codice php

3A) Inserire le breadcrumbs senza conoscere il php

  • Aprire la pagina nella quale si vogliono inserire le breadcrumbs
  • Inserire la seguente scritta (detta shortcode) nella posizione desiderata
    [wpseo_breadcrumb]
  • Aggiornare o pubblicare la pagina
  • Ora compariranno le breadcrumbs

3B) Inserire le breadcrumbs tramite PHP

  • Dal menu a sinistra andate in Aspetto > Editor (img 3B.1)
  • Se è la prima volta che entrate in questa sezione riceverete un’avvertenza, cliccate su “Ho capito” (o simili) e proseguite
  • Dal menù a sinistra identificate il nome del tema che state utilizzando (img 3B.2 – non il tema “child”) e cliccate “seleziona”
  • Dal menù a destra cercate la voce header.php (vi consiglio di metterlo qui, sia per comodità che per fruibilità)
  • Ora, qui vi consiglio di scorrere fino alla fine del file (che vi si aprirà a sinistra) e di inserire come ultime righe il codice delle breadcrumbs:
<?php
if ( function_exists('yoast_breadcrumb') ) {
yoast_breadcrumb('
<p id="breadcrumbs">','</p>
');
}
?>

 

A questo punto, dovrebbero comparire le breadcrumbs in ogni pagina, subito dopo il menù iniziale (ovvero dopo l’header della pagina).

selezionare-aspetto-editor
selezionare il tema da modificare

NOTA BENE

Alcuni temi e alcuni plug-in potrebbero interferire o rendere questa procedura inutile, purtroppo non è possibile redigere una guida per ogni singolo tema di wordpress, in quei casi quindi, ti invito a lasciarmi un commento a questo articolo, indicandomi il problema, cercherò di aiutarti nel miglior modo possibile.

Alla prossima e buon lavoro.

Matteo Bonfiglioli

About Matteo Bonfiglioli

Matteo Bonfiglioli, lavora a Bologna come grafico pubblicitario. Da 6 anni collabora con diversi studi tra Bologna e provincia. Diplomatosi come grafico pubblicitario, si è poi specializzato (corsi IFTS) nel web design e nel video editing. La sua curiosità morbosa lo porta a studiare costantemente discipline come "SEO" e "Web marketing".

Leave a Reply