Cómo Personalizar Migas de Pan de WooCommerce

Personalizar las migas de pan de WooCommerce

Cuando instalas WooCommerce de forma, añade las migas de pan o breadcrumbs que les facilitan a tus clientes enórmemente la navegación de en tu tienda virtual, para ubicarse y también para devolverse a las secciones que les interesan. ¿Sabes que puedes personalizarlas a tu gusto? En este tutorial te explicaremos cómo personalizar las migas de pan de WooCommerce de la forma correcta.

¿Qué son Migas de Pan?

¿La expresión suena rara, verdad? Pero cobrará sentido si recuerdas el cuento donde los amigos trazaban el camino de regreso a casa utilizando lo único que tenían, pan. El concepto de las migas de pan, o breadcrumbs como se le denimona en inglés no va muy lejos.

Las migas de pan es una expresión utilizada para describir un menú de navegación jerárquico presentado como una ruta de enlaces. A menudo se utiliza como una navegación secundaria que permite a los usuarios desplazarse de un contenido a otro.

Son parecidos en sus funciones a los menús, pero son un concepto distinto. El objetivo de los enlaces de las migas de pan es ayudar a los usuarios a navegar por tu tienda WooCommerce, y para ubicarse.

Las migas de pan ambién ayudan a los motores de búsqueda, principalmente a Google, para comprender la jerarquía de enlaces en una página web, y por consiguiente indexar mejor la estructura de tu sitio web de forma idónea.

Personalizar Migas de Pan de WooCommerce

Ahora que sabemos qué significan las migas de pan, es tiempo de descubrir todas las posibilidades que tenemos para personalizar migas de pan en tu tienda de WooCommerce, y darle una apariencia más atractiva y profesional.

Este tutorial está dedicado a las personas que tienen conocimientos básicos sobre la edición de archivos en WordPress. Por lo tanto, si no te sientes lo suficientemente cómodo, te recomendamos crear un backup completo de tu sitio web, para prevenir cualquier imprevisto.

Cambiar Separador de Migas de Pan

add_filter( 'woocommerce_breadcrumb_defaults', 'wpbo_cambiar_separador' );
function wpbo_cambiar_separador( $defaults ) {
    $defaults['delimiter'] = ' > ';
    return $defaults;
}

Este código viene en forma de un a función php, cuyo papel es cambiar el separador predeterminado de tu tienda de WooCommerce, que es una barra inclinada a un símbolo de mayor que (>).

Cambiar la Palabra “Inicio” en WooCommerce

add_filter( 'woocommerce_breadcrumb_defaults', 'wpbo_cambiar_texto_inicio' );
function wpbo_cambiar_texto_inicio( $defaults ) {
    $defaults['home'] = 'Libros';
    return $defaults;
}

Este código tiene una única función también, que es cambiar la palabra “Inicio” en las migas de pan de WooCommerce. Este código te permite colocar cualquier otra palabra que se ajuste a la naturaleza de tu tienda virtual.

Cambiar el Enlace de Inicio en WooCommerce

add_filter( 'woocommerce_breadcrumb_home_url', 'wpbo_cambiar_url_inicio' );
function wpbo_cambiar_url_inicio() {
    return 'https://wpbody.com';
}

Este tercer código tiene como objetivo cambiar el enlace de inicio en las migas de pan (breadcrumbs) de tu tienda virtual de WooCommerce. Puedes cambiar este enlace a prácticamente cualquier otro enlace interno o externo. Tú decides.

Quitar las Migas de Pan de WooCommerce

add_action( 'init', 'wpbo_quitar_migas_de_pan' );
function wpbo_quitar_migas_de_pan() {
    remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20, 0 );
}

Si crees que las migas de pan de WooCommerce no son útiles en tu sitio web, o usas otro tema de WordPress que ya incluye sus propias migas de pan, entonces puedes usar el código que aparece arriba para quitar los breadcrumbs de de tienda virtual.

¿Dónde Pegar estos Códigos?

La forma más recomendada de integrar estos códigos en el ecosistema de WordPress, es crear un plugin personalizada dedicado especialmente a los códigos o snippets que añades en tu sitio web.

En todo caso, puedes también pegar estos códigos en el archivo functions.php de tu tema actual, aunque no es una práctica recomendable, ya que corres el riesgo de dejar fuera de servicio tu sitio web en caso de cometer errores.

También, hablando de portabilidad, usar un plugin personalizado te permite conservar los cambios aunque cambies el tema actual, lo que hace que tu sitio web sea más sostenible.

Esto es todo, por favor sigue nuestra página en Facebook, para obtener los últimos tutoriales de optimización y seguridad de WooCommerce, y WordPress en general.

DEJAR COMENTARIO

Favor escribir tu comentario!
Favor ingresar tu nombre aquí