Agregar breadcrumb (Migas de pan) en WordPress en el tema Divi

El tema Divi de Eleganthemes no tiene un módulo que permita agregar las migas de pan o breadcrumb a la plantilla.

El proceso para instalar y activar las migas de pan incluye la instalación de un tema hijo (Child theme) y el plugin Yoast SEO.

Para crear el child theme puede usarse un plugin llamado «Child Theme Configuration» teniendo en cuenta copiar los archivos functions.php, header.php, y footer.php y pinchando la casilla del numeral 8 para que guarde los cambios en caso de actualizar la plantilla principal de Divi.

Una vez creado el tema hijo debemos activarlo y mediante FTP accedemos al archivo header.php y agregamos al final el siguiente código:

 

<!-- aqui empiezo el breadcrumb -->	    

<div class="migasdepan">

       <?php  if ( function_exists('yoast_breadcrumb') ) {

yoast_breadcrumb( '

<p id="breadcrumbs" class="et_pb_row">','</p>

' );

}

?>

</div>

El código CSS es el siguiente

/*--MIGAS DE PAN--*/
.migasdepan {
width: 100% !important;
position: relative;
z-index: 1;
background:#000 !important;
border-bottom: 1px solid #ddd;
}
.migasdepan .et_pb_row {
padding: 5px;
}
#breadcrumbs {
font-size: 12px;
line-height: 1.3em;
color: #000;
}
.home .migasdepan,
.woocommerce-breadcrumb {
display: none;
}

Para evitar que las migas de pan se vean en un dispositivo menor que 1024 px


@media only screen and (max-width: 1024px) {
.migasdepan {
display: none;
}
}

Considera compartir este artículo en tus redes sociales.

Estamos listos para responder cualquier inquietud. !Pregúntanos lo que quieras!
Scroll al inicio
Ir al contenido