¿Qué es Breadcrumbs y cómo agregar Breadcrumbs en Blogger?

breadcrumbs en blogger

¿Alguna vez te has sentido perdido navegando en un sitio web? Las migas de pan, o breadcrumbs, son como un mapa que te ayuda a orientarte, mostrando exactamente dónde estás y cómo llegaste ahí. En este artículo te explicaré qué son las migas de pan, por qué son tan importantes para tu blog en Blogger y, lo más importante, cómo puedes agregarlas fácilmente. ¡Vamos a hacerlo sencillo y claro!

¿Qué son las migas de pan (Breadcrumbs)?

Imagina que estás navegando en un sitio web y te encuentras en una página dentro de una categoría específica. En la parte superior, ves algo como esto:

Inicio >> Blogger >> Plantillas >> Plantilla ultrarrápida de Blogger

Ese pequeño texto es lo que llamamos migas de pan. Te muestra exactamente dónde estás en el sitio y te permite volver atrás con un solo clic. Son súper útiles para los usuarios, ya que no necesitan usar el botón "atrás" o buscar manualmente las páginas que visitaron antes. Además, ayudan a Google a entender cómo está organizado tu blog, lo que mejora tu SEO.

Tipos de migas de pan

Es posible que no lo sepas, pero existen diferentes tipos de migas de pan. Aquí te explico los más comunes:

  1. Migas de pan basadas en la jerarquía: Son las que la mayoría de los blogs usan. Muestran el camino desde la página principal hasta la página en la que estás. Por ejemplo: Inicio > Categoría > Subcategoría > Página Actual.
  2. Migas de pan basadas en atributos: Estas son más comunes en sitios de compras. Por ejemplo, si estás buscando ropa, puede mostrar algo como Inicio > Hombre > Camisas > Azul.
  3. Migas de pan basadas en el historial: Estas muestran las páginas que el usuario ha visitado anteriormente. Sin embargo, este tipo no es muy común porque puede resultar confuso.
Índice de contenidos
  1. ¿Qué son las migas de pan (Breadcrumbs)?
  2. Tipos de migas de pan
  • ¿Por qué son importantes las migas de pan?
  • ¿Cómo agregar migas de pan en Blogger?
    1. Conclusión
  • ¿Por qué son importantes las migas de pan?

    Ahora que ya sabes lo que son, hablemos de por qué deberías usarlas en tu blog. Aquí te doy algunas razones importantes:

    1. Mejoran la experiencia de tus lectores

    Imagina que un lector llega a una de tus publicaciones desde Google. Sin migas de pan, es posible que no sepan cómo llegar a otras partes de tu blog. Con las migas de pan, pueden ver claramente la estructura de tu sitio y navegar fácilmente por él. Esto mejora su experiencia y los hace sentir más cómodos.

    2. Ayudan a reducir la tasa de rebote

    La tasa de rebote es cuando los usuarios llegan a tu blog y se van rápidamente sin visitar otras páginas. Con las migas de pan, les das una razón para explorar más. Pueden hacer clic en las categorías o en otras secciones de tu blog, lo que aumenta el tiempo que pasan en tu sitio y reduce la tasa de rebote.

    3. Facilitan el trabajo a los motores de búsqueda

    Los motores de búsqueda como Google usan las migas de pan para entender mejor la estructura de tu blog. Esto les ayuda a indexar más páginas y a mostrar tu contenido en los resultados de búsqueda de manera más precisa.

    4. Navegación sencilla para tus visitantes

    Tus visitantes podrán moverse fácilmente entre páginas, categorías y la página de inicio con solo un clic. Esto no solo mejora su experiencia, sino que también los invita a quedarse más tiempo en tu blog.

    ¿Cómo agregar migas de pan en Blogger?

    Ahora que entiendes por qué son importantes, pasemos a la parte práctica: ¡añadir migas de pan a tu blog en Blogger! No te preocupes, lo haremos paso a paso.

    Paso 1: Inicia sesión en tu cuenta de Blogger

    Lo primero que necesitas hacer es iniciar sesión en tu cuenta de Blogger.

    Paso 2: Selecciona tu plantilla o tema

    Ve a Tema en el menú de la izquierda. Haz clic en el botón "Personalizar" y luego selecciona "Editar HTML". Te recomiendo hacer una copia de seguridad de tu plantilla antes de seguir, por si algo sale mal.

    Paso 3: Busca el código correcto

    Una vez que estés en el editor de HTML, presiona Ctrl + F en tu teclado para abrir la barra de búsqueda. Busca este código:

    <div class='blog-posts hfeed'>

    Paso 4: Añade el código de las migas de pan

    Justo debajo de ese código, copia y pega el siguiente código para activar las migas de pan en tu blog:

    <!--breadcrumbs start by miwebperfecta.com-->
    <b:if cond='data:blog.pageType == "item"'>
    <p class='breadcrumbs'>
            <span class='post-labels'>
            <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
            <b:loop values='data:posts' var='post'>
                <b:if cond='data:post.labels'>
                <b:loop values='data:post.labels' var='label'>
                    <b:if cond='data:label.isLast == true'> »
                        <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
                    </b:if>
                </b:loop>
                <b:else/>
                » Unlabelled
                </b:if>
                » <span><data:post.title/></span>
            </b:loop>
            </span>
        </p>
    </b:if>
    <b:if cond='data:blog.pageType == "static_page"'>
    <p class='breadcrumbs'>
      <a expr:href='data:blog.homepageUrl'>Home</a> » <data:blog.pageName/>
    </p>
    </b:if>
    <b:if cond='data:blog.pageType == "archive"'>
        <p class='breadcrumbs'>
          <a expr:href='data:blog.homepageUrl'>Home</a> » <data:blog.pageName/>
        </p>
    </b:if>
    <b:if cond='data:blog.searchLabel'>
        <p class='breadcrumbs'>
          <a expr:href='data:blog.homepageUrl'>Home</a> » <data:blog.pageName/>
        </p>
    </b:if>
    <!--breadcrumbs end-->

    Paso 5: Guarda los cambios

    Una vez que hayas pegado el código, simplemente haz clic en "Guardar" y ¡listo! Las migas de pan estarán activas en tu blog.

    Conclusión

    Agregar migas de pan a tu blog es una de esas pequeñas acciones que pueden tener un gran impacto. Ayudan a tus lectores a navegar mejor, mejoran su experiencia y también facilitan que los motores de búsqueda entiendan la estructura de tu sitio, lo que puede ayudarte a mejorar tu SEO.

    Si aún no las has añadido, ¡ahora es el momento! Sigue los pasos que te mostré y en pocos minutos tu blog estará más optimizado y será más fácil de navegar. Si tienes alguna duda o problema, no dudes en dejarme un comentario. ¡Estaré encantado de ayudarte!

    Felipe Arango

    Siento pasión por el diseño web y las páginas web. Expreso mis ideas en miwebperfecta.com.

    Deja una respuesta

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

    Tu puntuación: Útil

    Subir