![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/breadcrumbs-hostinger-1024x502.png\")
<\/figure>En el ejemplo, Todos los apartados > Empezando > Creación de un sitio web propio > ¿Cómo crear un sitio web?<\/strong> son enlaces a las páginas que conducen a ese artículo.<\/p> En lugar de buscar otros artículos o hacer clic en el botón de regresar<\/strong>, los visitantes del sitio web pueden simplemente hacer clic en Empezando<\/strong> o en otras breadcrumbs para encontrar más información sobre el tema.<\/p> Los breadcrumbs se dividen en tres categorías:<\/p> Independientemente de la categoría, añadir breadcrumbs a WordPress puede mejorar la experiencia del usuario, mejorar el SEO y reducir la tasa de rebote<\/a>.<\/p> Los breadcrumbs proporcionan una forma fácil de navegar por tu sitio, lo que es especialmente importante para los usuarios que lo utilizan por primera vez. Los enlaces de navegación eliminan la necesidad de utilizar el botón de retroceso del navegador o de realizar varias búsquedas<\/p> Una gran experiencia de usuario mantiene a los visitantes del sitio contentos y aumenta su tiempo de permanencia en tu sitio web, exponiendo más de tu contenido a ellos.<\/p> Además de mejorar la navegación, los breadcrumbs también son útiles para la optimización de los motores de búsqueda<\/a>. Los rastreadores de los motores de búsqueda utilizan los enlaces de navegación con breadcrumbs para comprender la estructura de tu sitio e indexar las páginas web con mayor precisión.<\/p> Google incluso muestra los breadcrumbs en su página de resultados para ayudar a los usuarios a entender si la página es relevante para su búsqueda:<\/p> La tasa de rebote se refiere al porcentaje de visitantes que acceden a un sitio web y lo abandonan justo después, en lugar de explorar otros contenidos dentro del sitio.<\/p> Si la página web a la que acceden no les proporciona lo que necesitan, los breadcrumbs les guían a otras partes del sitio web. Por ejemplo, si un usuario no encuentra la camiseta azul que busca, puede explorar fácilmente otras categorías o encontrar un producto relacionado.<\/p> Así, es menos probable que se vayan a otro sitio web o vuelvan a las páginas de resultados del motor de búsqueda.<\/p> Hay tres formas de añadir los breadcrumbs de WordPress a tu sitio: manualmente, utilizando plantillas o plugins.<\/p> El método manual es ideal para las personas que se sienten cómodas con la codificación y quieren un control más creativo sobre cómo se muestran las migas de pan en su sitio de WordPress.<\/p> Para activar los breadcrumbs de WordPress manualmente, tendrás que añadir una función a tu archivo functions.php<\/strong>.<\/p> Para acceder al archivo, utiliza el Administrador de Archivos de tu panel de control de alojamiento web o conéctate por FTP<\/a>. Para este tutorial, vamos a utilizar el Administrador de Archivos de Hostinger.<\/p> Añadir los breadcrumbs de WordPress instalando un tema <\/a>con la funcionalidad de breadcrumbs es un método estupendo para aquellos que empiezan un nuevo sitio web o hacen un rediseño del mismo.<\/p> Para activar la funcionalidad de breadcrumbs, primero debes instalar y activar el tema o plantilla. Varias plantillas ya vienen con una función de migas de pan incorporada, como Astra<\/strong> y OceanWP<\/strong>.<\/p> Astra<\/a><\/p> Estadísticas:<\/strong><\/p> Astra es un tema bonito y ligero de WordPress que proporciona una forma de añadir migas de pan a los sitios web de WordPress sin esfuerzo.<\/p> Para añadir breadcrumbs a tu sitio usando Astra, sigue estos pasos:<\/p> Además de las migas de pan o breadcrumbs, esta plantilla también ofrece las siguientes características:<\/p> Astra está disponible de forma gratuita<\/strong> con funciones limitadas. Para opciones más avanzadas, ofrece tres planes premium: Astra Pro<\/strong> a 59 dólares al año<\/strong>, Mini Agency Bundle<\/strong> a 276 dólares al año<\/strong> y Agency Bundle <\/strong>a 523 dólares al año<\/strong>.<\/p> [VISTA PREVIA<\/a> \/ DESCARGA<\/a>]<\/p> OceanWP<\/a><\/p> Estadísticas:<\/strong><\/p> Descargas:<\/strong> 700,000+ OceanWP es un tema de WordPress de carga rápida con un shortcode para añadir migas de pan<\/a> a los sitios web de WordPress.<\/p> Aquí tienes una guía paso a paso sobre cómo añadir migas de pan a este tema:<\/p> Como se ha visto en el paso número cuatro, hay tres parámetros del shortcode:<\/p> En el ejemplo anterior, hemos añadido una clase personalizada con color azul y color hover negro. El código de color HEX<\/a> para el azul es #0003FE, mientras que el código de color para el negro es #000000.<\/p> Además de los breadcrumbs, la plantilla OceanWP también tiene las siguientes características:<\/p> La versión gratuita de OceanWP está disponible con características limitadas. Sus planes premium<\/a> son Personal<\/strong>, a 39 dólares al año<\/strong> para un sitio, Business<\/strong>, a 79 dólares al año<\/strong> para tres sitios, y Agency<\/strong>, a 129 dólares al año<\/strong> para 25 sitios.<\/p> [VISTA PREVIA<\/a> \/ DESCARGA<\/a>]<\/p> Si tu plantilla no viene con la funcionalidad incorporada, utiliza un plugin para añadir breadcrumbs al sitio. Hay varias opciones para elegir en el directorio de WordPress, pero hemos seleccionado los cuatro mejores plugins de WordPress<\/a> para añadir migas de pan a tu sitio web.<\/p> Yoast SEO<\/a><\/p> Estadísticas del plugin:<\/p> Yoast SEO es uno de los plugins de optimización de motores de búsqueda<\/a> más populares para WordPress. Además, este plugin de SEO viene con soporte de breadcrumbs incorporado.<\/p> Activar los breadcrumbs en tu sitio con Yoast SEO es un proceso sencillo. Después de instalar y activar el plugin, sigue estos pasos:<\/p> Si no quieres utilizar un tema hijo, intenta obtener ayuda de tu desarrollador de temas.<\/p> Además de la navegación con migas de pan, estas son otras funciones que obtienes al utilizar Yoast SEO:<\/p> El plugin Yoast SEO tiene una versión gratuita<\/strong> con funciones limitadas. La versión premium<\/a> cuesta a partir de 89 dólares al año<\/strong>.<\/p> [DESCARGA<\/a>]<\/p> Breadcrumb NavXT<\/a><\/p> Estadísticas del plugin<\/strong>:<\/p>![\"\"](\"https:\/\/blog.hostinger.io\/co-tutoriales\/wp-content\/uploads\/sites\/40\/2024\/06\/ES-New-WP_in-text-banner.png\")
<\/a><\/figure><\/div>¿Por qué deberías utilizar los breadcrumbs de WordPress?<\/h2>
\n
Mejora la experiencia del usuario<\/h3>
Mejoran el SEO<\/h3>
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/google-1-1024x342.png\")
<\/figure>Reducir la tasa de rebote<\/h3>
¿Cómo añadir los breadcrumbs de WordPress a tu sitio web?<\/h2>
Añadir manualmente las los breadcrumbs de WordPress<\/h3>
\n
![\"el](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/hpanel-hosting-manage-highlighted-es-1.png\")
<\/figure><\/div>\n
![\"administrador](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2017\/04\/hpanel-files-filemanager-sidebar-es.png\")
<\/figure><\/div>\n
![\"el](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/hpanel-files-filemanager-publichtml-wpcontent-es.png\")
<\/figure><\/div>\n
![\"La](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2017\/04\/hpanel-files-filemanager-publichtml-wpcontent-themes-selected-es.png\")
<\/figure><\/div>\n
\n
![\"archivo](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/hpanel-files-filemanager-publichtml-wpcontent-themes-functions-selected-es.png\")
<\/figure><\/div>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/hpanel-files-filemanager-publichtml-wpcontent-themes-functionsphp-edit-es.png\")
<\/figure><\/div>\n
<div class=\"<\/mark>breadcrumb<\/mark>\"<\/mark>><?php get_breadcrumb(); ?><\/div><\/pre>
Añadir breadcrumbs en WordPress desde una plantilla o tema<\/h3>
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/image-31.png\")
<\/figure>\n
\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/migas-de-pan--1024x468.png\")
<\/figure>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/themes-migas-de-pan-1024x479.png\")
<\/figure>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/migas-de-pan-astra-hpanel-1024x686.png\")
<\/figure>\n
\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/image-30.png\")
<\/figure>
Valoración:<\/strong> 4.9\/5
Características destacadas:<\/strong> breadcrumbs, integración con WooCommerce, extensiones, compatibilidad con el plugin page builder, preparado para la traducción
Precio: <\/strong>freemium<\/p>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/widgets-disponibles-1024x389.png\")
<\/figure>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/anadir-texto-1024x620.png\")
<\/figure>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/anadir-texto2-1024x584.png\")
<\/figure>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/anadir-texto3-1024x565.png\")
<\/figure>\n
\n
\n
Añadir breadcrumbs a WordPress con un plugin<\/h3>
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/image-29.png\")
<\/figure>\n
\n
if ( function_exists('yoast_breadcrumb') ) {\nyoast_breadcrumb( '<p id=\"breadcrumbs\">','<\/p>' );\n}\n?><\/pre>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/yoast-edit-header-theme-editor-1024x421.png\")
<\/figure>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/agregar-snippet-editar-tema-1024x524.png\")
<\/figure>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/yoast-migas-de-pan-1024x628.png\")
<\/figure>\n
Las futuras actualizaciones del tema o plantilla pueden anular los cambios que realices. Para solucionar este problema, utiliza un tema hijo<\/a>.<\/p>\n
![\"\"](\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2022\/09\/image-28.png\")
<\/figure>