{"id":41250,"date":"2022-11-29T12:37:07","date_gmt":"2022-11-29T10:37:07","guid":{"rendered":"https:\/\/www.hostinet.com\/formacion\/?p=41250"},"modified":"2022-11-29T13:09:52","modified_gmt":"2022-11-29T11:09:52","slug":"breadcrumbs-en-wordpress-que-son-y-como-lo-configuro","status":"publish","type":"post","link":"https:\/\/www.hostinet.com\/formacion\/wordpress\/breadcrumbs-en-wordpress-que-son-y-como-lo-configuro\/","title":{"rendered":"Breadcrumbs en WordPress: qu\u00e9 son y C\u00f3mo lo Configuro"},"content":{"rendered":"
<\/div>

\"Breadcrumbs<\/h4>\n

Si te interesa el SEO seguro que has o\u00eddo hablar de as breadcrumbs, tambi\u00e9n conocidos como \u00abmigas de pan\u00bb. Vamos a ver para qu\u00e9 sirven y c\u00f3mo puedes activarlos y configurarlos en tu WordPress.<\/h4>\n

 <\/p>\n

\u00bfQu\u00e9 son las Breadcrumbs?<\/h2>\n

Los Breadcrumbs o \u00abmigas de pan\u00bb, son los enlaces internos que aparecen en la parte superior de los art\u00edculos y que muestran la ruta desde la p\u00e1gina principal (index) hasta el art\u00edculo en s\u00ed.<\/p>\n

Su curioso nombre viene por un famoso cuento infantil en el que los protagonistas dejan migas de pan en el camino para luego encontrar la vuelta a casa.<\/p>\n

En WordPress el motivo es el mismo, se usan para saber en qu\u00e9 sitio de la web te encuentras exactamente.<\/p>\n

\"Ejemplo<\/p>\n

\u00bfC\u00f3mo Funcionan las Breadcrumbs?<\/h2>\n

El uso de las breadcrumbs es muy sencillo y ayudan al usuario a navegar por la web sin perderse, pudiendo volver a un punto anterior del sitio web.<\/p>\n

Por lo general, se usan de manera jer\u00e1rquica y en WordPress se hace uso de las categor\u00edas para ello.<\/p>\n

Por ejemplo, si accedes a este art\u00edculo desde el blog de formaci\u00f3n de Hostinet, las breadcrumbs ser\u00edan algo as\u00ed:<\/p>\n

hostinet > formaci\u00f3n > wordpress > breadcrumbs\r\n<\/code><\/pre>\n
De esta manera, el usuario con un s\u00f3lo click, podr\u00eda volver al blog de formaci\u00f3n o a la categor\u00eda de WordPress y adem\u00e1s, sabe en todo momento en qu\u00e9 sitio est\u00e1 de la web.<\/p>\n
Existen otras formas de utilizar las breadcrumbs, pero en vez de una jerarqu\u00eda, se usan los atributos, un m\u00e9todo m\u00e1s utilizado en el comercio electr\u00f3nico, por ejemplo:<\/p>\n
home > calzado > zapatillas deportivas > zapatillas running > marca xxx\r\n<\/code><\/pre>\n
De esta forma puedes volver a zapatillas deportivas<\/em> o zapatillas running<\/em> si es necesario, si tener que hacer click hacia atr\u00e1s en el navegador repetidas veces.<\/p>\n
Esta \u00faltima forma tambi\u00e9n es otro m\u00e9todo de utilizar las breadcrumbs, simplemente ir hacia adelante o hacia atr\u00e1s seg\u00fan naveguemos, aunque es mucho menos \u00fatil y lo ver\u00e1s en menos sitios web.<\/p>\n
 <\/p>\n
\u00bfPor qu\u00e9 usar las Breadcrumbs?<\/h2>\n
El uso de las breadcrumbs es ayudar a mejorar la experiencia del usuario cuando est\u00e1 en nuestro WordPress.<\/p>\n
Si el usuario est\u00e1 m\u00e1s c\u00f3modo navegando entre las distintas secciones de nuestra web, tenemos m\u00e1s opciones de que se quede y disminuir as\u00ed nuestra tasa de rebote.<\/p>\n
Todo esto tiene un valor significativo en el SEO, ya que Google y el resto de buscadores ven con buenos ojos las breadcrumbs, les ayudan a encontrar las p\u00e1ginas, pueden mostrarlo en sus resultados y en definitiva, nos posicionar\u00e1 mejor<\/strong>.<\/p>\n
\"Breadcrumbs<\/p>\n
<\/h2>\n
C\u00f3mo Configurar Breadcrumbs en WordPress<\/h2>\n
Ahora que ya sabes lo importante que son los breadcrumbs, seguro que quieres configurarlos en tu WordPress, as\u00ed que vamos a ver c\u00f3mo puedes hacerlo.<\/p>\n
Existen distintas formas en las que puedes configurar las migas de pan en WordPress y si tienes un desarrollador web, no tendr\u00e1 ning\u00fan problema en configurarlo.<\/p>\n
Eso s\u00ed, es recomendable crear un Tema Hijo o Child Theme<\/a><\/strong> y modificar el c\u00f3digo en archivos importantes en el theme de WordPress que est\u00e9s usando, as\u00ed que ten cuidado y haz copias de seguridad si tomas este camino.<\/p>\n
Nosotros vamos a usar otras opciones, m\u00e1s asequibles para los usuarios de WordPress con menos conocimientos t\u00e9cnicos.<\/p>\n
Breadcrumbs en el Themes de WordPress<\/h3>\n
Antes de nada, debes de saber que algunos themes de WordPress tiene entre sus opciones de personalizaci\u00f3n la posibilidad de a\u00f1adir las migas de pan directamente.<\/p>\n
As\u00ed que lo recomendable ser\u00eda que comprobaras si tu plantilla tiene esta opci\u00f3n disponible.<\/p>\n
Un peque\u00f1o truco que puedes usar es buscar un nuevo theme en WordPress y escribir: Breadcrumb<\/em> en la caja de b\u00fasqueda.<\/p>\n
\"Bradcrumbs<\/p>\n
Estos son los themes que a\u00f1aden breadcrumb<\/em> en la descripci\u00f3n, pero ojo, que no estar\u00e1n todos, algunos themes lo incorporan pero no lo a\u00f1aden en la descripci\u00f3n.<\/p>\n
En caso de duda, lo mejor es pregunt\u00e1rselo al desarrollador del theme, que es el que m\u00e1s sabe sobre esto.<\/p>\n
En nuestro caso estamos usando Astra<\/strong>, un theme muy popular por su alta capacidad de personalizaci\u00f3n y entre sus opciones podemos encontrar Migas de pan<\/strong>.<\/p>\n
\"Ejemplo<\/p>\n
Desde esta opci\u00f3n el theme nos permite activar y personalizar el aspecto de las breadcrumbs en nuestro WordPress.<\/p>\n
\"Configuraci\u00f3n<\/p>\n
Como hemos comentado, cada theme puede tener una forma distinta de a\u00f1adir las migas de pan y algunos themes no tendr\u00e1s disponible la opci\u00f3n de hacerlo, pero siempre puedes usar un plugin<\/strong>, ya que en WordPress existen varias opciones para a\u00f1adir las breadcrumbs.<\/p>\n
 <\/p>\n
A\u00f1adir Breadcrumbs con el plugin Yoast SEO<\/h3>\n
Como hemos comentado antes, las migas de pan son buenas para el SEO, as\u00ed que uno de los plugins m\u00e1s populares en WordPress para mejorar el SEO, no pod\u00eda dejar de tener esta opci\u00f3n.<\/p>\n
Estamos hablando de Yoast SEO<\/strong>, un plugin que, si te interesa el posicionamiento web y usas WordPress, posiblemente conozcas.<\/p>\n
Si lo tienes instalado, tienes una opci\u00f3n para activar y configurar las breadcrumbs<\/strong>.<\/p>\n
S\u00f3lo tienes que ir al men\u00fa de Yoast SEO y en el apartado de Apariencia en el buscador<\/strong> encontrar\u00e1s la opci\u00f3n de Migas de pan<\/strong>.<\/p>\n
\"Breadcrumbs<\/p>\n
Si quieres a\u00f1adir las migas de pan en todo el sitio, no tendr\u00e1s m\u00e1s remedio que modificar algunos archivos de tu theme.<\/p>\n
<?php\r\nsi ( function_exists('yoast_breadcrumb') ) {\r\n  yoast_breadcrumb( '<p id=\"breadcrumbs\">','<\/p>' );\r\n}\r\n?>\r\n<\/code><\/pre>\n
Dependiendo del theme que uses, tendr\u00e1s que a\u00f1adirlo en un sitio u otro, pero antes de nada, haz una copia de seguridad<\/strong>.<\/p>\n
Por cierto, si dispones de un bloque de Yoast para a\u00f1adir las breadcrumbs en cada entada o p\u00e1gina, sin necesidad de tocar el c\u00f3digo.<\/p>\n
\"Breadcrumbs<\/p>\n
<\/h3>\n
A\u00f1adir Breadcrumbs con el plugin Breadcrumb NavXT<\/h3>\n
Si quieres un plugin espec\u00edfico para a\u00f1adir las breadcrumbs, una de las opciones m\u00e1s utilizadas es Breadcrumb NavXT<\/strong>, el cual puedes descargar desde aqu\u00ed<\/a><\/em> o instalarlo directamente desde el repositorio de plugins de tu WordPress.<\/p>\n
En su configuraci\u00f3n, te ofrece la posibilidad de a\u00f1adir las migas de pan de diversas formas, incluso puedes usar un widget<\/strong> en el que decidir en qu\u00e9 secci\u00f3n de la web quieres que aparezcan.<\/p>\n
O usar un bloque en cualquiera de las entradas o p\u00e1ginas para a\u00f1adir las breadcrumbs en cada una de ellas<\/p>\n
\"Breadcrumb<\/p>\n
Cosas a Tener en Cuenta<\/h2>\n
A\u00f1adir las breadcrumbs en WordPress s\u00f3lo reporta beneficios<\/strong>, ya sea para la experiencia del usuario, como en el posicionamiento web SEO.<\/p>\n
Si tienes un desarrollador web, ser\u00e1 capaza de implementarlo sin problemas y si tienes algunos conocimientos y te ves capaz de editar los archivos, adelante, pero recuerda hacer una copia de seguridad del sitio<\/strong> antes de tocar nada.<\/p>\n
Por supuesto, si necesitas un hosting con soporte para WordPress, puedes contratar algunas de las opciones de alojamiento web que ofrecemos optimizadas para Hostinet<\/a>.<\/p>\n
\"Hosting<\/a><\/p>\n
En la web de Yoast<\/a> lo indican paso a paso, pero b\u00e1sicamente te indican que debes a\u00f1adir el siguiente c\u00f3digo en los archivos d\u00f3nde quieres que aparezcan:<\/p>\n