Elemento Miga de Pan (Breadcrumb)

¿Qué es el elemento Miga de Pan (Breadcrumb) en GemPages?

Un Miga de Pan (Breadcrumb) es un elemento de navegación que ayuda a los usuarios a comprender su ubicación actual dentro de un sitio web o aplicación. Generalmente aparece como una cadena de enlaces en la parte superior de una página web o interfaz, mostrando la jerarquía de páginas o secciones por las que el usuario ha navegado para llegar a la página actual.

Cuando se trabaja con páginas de subcategorías en Shopify (por ejemplo, "Zapatos de Hombre" dentro de "Zapatos"), los Migas de Pan (Breadcrumb) adquieren aún mayor importancia. Permiten a los clientes volver rápidamente a la colección principal o navegar entre subcategorías hermanas sin tener que explorar los menús manualmente.

El uso de Miga de Pan (Breadcrumb) en páginas de subcategorías también ayuda a los motores de búsqueda a comprender mejor la estructura del sitio, lo que puede mejorar el SEO al indicar claramente la relación entre las categorías principales y sus subcategorías.

¿Cómo añadir y configurar el elemento Miga de Pan (Breadcrumb)?

A continuación se detallan todos los ajustes del elemento Miga de Pan (Breadcrumb) en el Editor de GemPages Versión 7 .

Paso 1: Vaya al Panel de Control de GemPages > Preferencias > Configuración de la tienda. En la sección Otras configuraciones, active la opción "Incluir el identificador de colección en la ruta URL de los productos accedidos desde una colección."

Paso 2: Regrese a la sección Páginas y localice la página de destino para abrir el editor.

Paso 3: En la barra lateral izquierda, escriba Miga de Pan (Breadcrumb) en la barra de búsqueda y, a continuación, arrastre y suelte el elemento en la parte superior de su página.

Configurar la pestaña Ajustes

La pestaña Configuración del elemento Miga de Pan (Breadcrumb) le permite ajustar con precisión la apariencia, el diseño y el comportamiento interactivo de la ruta de navegación.

Icono separador

Personalice el separador entre los elementos del Miga de Pan (Breadcrumb) (por ejemplo, /, >, →):

• Ícono: Elija un icono o carácter. También puede cargar su propio icono .SVG.
• Color: Seleccione el color del icono mediante HEX o el selector de color.
• Tamaño: Ajuste el tamaño del icono con los botones +/–.

Estilo del Texto

Dé estilo al texto del Miga de Pan (Breadcrumb) con controles tipográficos completos:

Espaciado, tamaño y fondo de los elementos

Espacio: Ajuste el espaciado horizontal entre los elementos del Miga de Pan (Breadcrumb) arrastrando el control deslizante o introduciendo un valor específico manualmente.

Relleno: Ajuste el espaciado interior del contenedor del Miga de Pan (Breadcrumb) (superior, derecho, inferior, izquierdo) para crear espacio o alinear el elemento con el diseño.

Color de fondo: Establezca un color de fondo para la barra del Miga de Pan (Breadcrumb) mediante el selector de color o introduciendo un código HEX para un control preciso.

Forma

Puede dar al contenedor del breadcrumb un aspecto distintivo:

• Borde: Establezca el color, el grosor y el estilo del trazo.
• Esquina: Defina el radio del borde para redondear las esquinas (por ejemplo, 8px).
• Sombra: Añada sombras sutiles o pronunciadas y, a continuación, modifique el tipo, la dirección, el color, la distancia, el desenfoque y el tamaño.

Efecto

• Pasar el Cursor: Active los estilos al pasar el cursor cuando los usuarios interactúen con los enlaces del Miga de Pan (Breadcrumb).
• Activo: Resalte el elemento del Miga de Pan (Breadcrumb) actual (activo) de forma diferente al resto.

Opciones de visualización

Ocultar página activa:

• Sí: Oculta la página actual (último elemento del Miga de Pan (Breadcrumb), por ejemplo, Happy Dog Snack).
• No: Muestra la ruta completa del Miga de Pan (Breadcrumb).

Alineación

Este parámetro le permite determinar cómo se posiciona el elemento en la página. Dispone de tres opciones: alineado a la izquierda, centrado y alineado a la derecha.

Configurar la pestaña Avanzada

Para una personalización más avanzada, navegue a la pestaña Avanzado y siga las instrucciones de este artículo.

También puede encontrar más consejos útiles y videotutoriales en GemPages Academy.

Preguntas Frecuentes

1. ¿Cómo ayudan los Migas de Pan (Breadcrumb) con las páginas de subcategorías?

Los Migas de Pan (Breadcrumb) muestran claramente la jerarquía desde las categorías principales hasta las subcategorías, mejorando tanto la navegación del usuario como el SEO. Esto ayuda a los clientes a saber exactamente dónde se encuentran y a moverse fácilmente entre secciones.

2. ¿Puedo personalizar los Migas de Pan (Breadcrumb) de forma diferente para las páginas de subcategorías?

Sí. Puede aplicar diferentes estilos, separadores o colores de fondo a los Migas de Pan (Breadcrumb) en páginas de subcategorías para que destaquen.

3. ¿Qué ocurre si mi página de subcategoría no aparece en el Miga de Pan (Breadcrumb)?

Esto puede suceder si la URL del producto no incluye el identificador de colección/subcategoría. Asegúrese de que el ajuste de Shopify "Incluir el identificador de colección en la ruta URL" esté activado.

4. ¿Mejoran los Migas de Pan (Breadcrumb) el SEO de las páginas de subcategorías?

Sí. Ayudan a los motores de búsqueda a comprender la relación entre las categorías principales y las subcategorías, lo que puede mejorar la indexación y la estructura de enlaces internos.