Migas de pan (Breadcrumb) en WordPress

Migas de pan (Breadcrumb) en WordPress

Las «migas de pan» o «breadcrumb» son una funcionalidad que permite al visitante saber en qué página se encuentra y la ruta completa de cómo se llega a ella. Dentro de las utilidades disponibles para añadir esta característica a nuestro sitio, se encuentra el plugin Breadcrumb Trail. Aunque lleva dos años sin actualizarse, lo cierto es que gracias a su ligereza y sencillez tuvo bastante éxito en su momento. Tanto es así que muchos Themes integraron dicho código en su propia plantilla y a fecha de hoy sigue funcionando perfectamente salvo por un pequeño error.

¿Y cómo sabemos si nuestro tema usa dicho código? Pista: disponemos de la funcionalidad y no tenemos ningún plugin que la lleve a cabo. Esto significa que el tema se encarga de ello, y lo normal es que en algún archivo del tema encontremos los créditos. Algo así como:

 * @package   BreadcrumbTrail
 * @version   1.1.0
 * @author    Justin Tadlock <justin@justintadlock.com>
 * @copyright Copyright (c) 2008 - 2017, Justin Tadlock
 * @link      https://themehybrid.com/plugins/breadcrumb-trail
 * @license   http://www.gnu.org/licenses/old-licenses/gpl-2.0.html

Una vez localizado el archivo, vamos a ver como solucionamos el error que mencionábamos de forma que la prueba de resultados enriquecidos salga positiva.

Las responsables del desaguisado son las siguientes líneas:

// Wrap the item with its itemprop.
$item = ! empty( $matches )
	? preg_replace( '/(<a.*?)([\'"])>/i', '$1$2 itemprop=$2item$2>', $item )
	: sprintf( '<span itemprop="item">%s</span>', $item );

Con ello se consigue de forma automática marcar cada URL de las «migas de pan» con la propiedad «item». Ejemplo:

<a itemprop="item" href="https://www.xxxxxx.com/"><span itemprop="name">Elemento</span></a>

pero resulta que también lo hace con el último elemento que va sin enlace. Cuando el robot de Google comprueba la página se encuentra, siguiendo con el ejemplo, con:

<span itemprop="item"><span itemprop="name">Último Elemento</span></span></a>

Y eso provoca el error ya que la propiedad «item» le indica a Google que debe encontrar un enlace. Como no existe, cuando ejecutamos la prueba nos sale el error «La URL del campo «id» no es válida».

¿Y cómo lo solucionamos?

En primer lugar, comentando las líneas de la función «Wrap the item with its itemprop»:

// Wrap the item with its itemprop.
// $item = ! empty( $matches )
//	? preg_replace( '/(<a.*?)([\'"])>/i', '$1$2 itemprop=$2item$2>', $item )
//	: sprintf( '<span itemprop="item">%s</span>', $item );

En segundo lugar, vamos a buscar las líneas que contengan

sprintf( '<a href

y vamos a sustituir esa porción de código en todas y cada una de esas líneas por

sprintf( '<a itemprop="item" href

Como veis, se trata simplemente de añadir el marcado itemprop="item" a cada enlace.

Ejemplo:

Línea original:

$this->items[] = sprintf( '<a href="%s" rel="home">%s</a>', esc_url( network_home_url() ), $this->labels['home'] );

Línea modificada:

$this->items[] = sprintf( '<a itemprop="item" href="%s" rel="home">%s</a>', esc_url( network_home_url() ), $this->labels['home'] );

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *