TechBlogSD - Todo para WordPress y desarrollo WEB
Instrucciones de WEB y WordPress, noticias, reseñas de temas y complementos

¿Cómo agregar migas de pan en el sitio de Weebly?

0

La estructura interna del sitio es uno de los factores de SEO importantes que ayudan a Google y a otros motores de búsqueda a comprender fácilmente su sitio. Además de vincular otras páginas de su sitio, agregar rutas de navegación puede ayudar a los usuarios a navegar a diferentes secciones. Si no conoce la ruta de navegación, se trata de enlaces de navegación adicionales, que generalmente se muestran en la parte superior de la página web que contiene la estructura. Ayuda a los usuarios a navegar a las categorías o secciones de nivel superior del sitio fácilmente desde la página actual.

Relacionado: ¿Cómo agregar migas de pan en el sitio de WordPress?

Ejemplos de migas de pan

A continuación se muestra un ejemplo de cómo se verán las migas de pan horizontales y verticales.

¿Cómo agregar migas de pan en el sitio de Weebly?

Ejemplos de migas de pan

Como puede ver, proporciona la posición relativa de la página actual entre todo el sitio, algo así como un tablón de anuncios "¡Usted está aquí!" En el mapa.

Weebly y Breadcrumb

Weebly no ofrece por defecto de migas de pan elemento para agregarlo en su sitio. Sin embargo, puede utilizar CSS / HTML personalizado e insertar manualmente la ruta de navegación en cada página. Aquí le mostraremos seis rutas de navegación de estilos CSS diferentes que puede agregar en su sitio Weebly.

Nota: Recuerde, estas son migas de pan simples y manuales. No es parte del esquema y, por lo tanto, los motores de búsqueda no los mostrarán en los resultados de búsqueda como los sitios web de WordPress.

Antes de comenzar, el requisito previo para una ruta de navegación es mantener sus páginas de manera estructurada. Aunque no es necesario organizar las páginas según la ruta de navegación, recomendamos encarecidamente mantener la jerarquía necesaria en la pestaña "Páginas" y alinear su navegación en consecuencia. Lo explicaremos con una estructura de ejemplo como "Inicio> Construcción del sitio> Weebly> Consejos y trucos de Weebly> Esta página". Esto necesita cinco bloques con los enlaces correspondientes para crear una ruta de navegación.

Las rutas de navegación utilizan código CSS y HTML simple, por lo tanto, el código CSS se debe agregar a la hoja de estilo y el código HTML se debe incrustar en la página requerida. Dado que es posible que deba colocar las rutas de navegación en más de una página, se recomienda agregar el código CSS en "Tema> Editar HTML / CSS > Estilos> main.less" como se muestra a continuación:

¿Cómo agregar migas de pan en el sitio de Weebly?

Edición del archivo CSS principal en Weebly

El código HTML debe insertarse en una página utilizando el elemento " Código incrustado " encima del contenido.

Estilo 1 y 2

Por debajo de los estilos 1 y 2, las rutas de navegación comparten una clase CSS común con una pequeña adición de código para el segundo estilo.

Estilo CSS Breadcrumb 1

CSS Breadcrumb Style 2

Estilo 3, 4, 5 y Bono 6

CSS Breadcrumb Style 3

CSS Breadcrumb Style 4

CSS Breadcrumb Style 5

Bonus CSS Breadcrumb Style 6

Haga clic en el botón de abajo para obtener el código CSS / HTML para todas las rutas de navegación anteriores y el código CSS se resalta para cada estilo.

Hay cuatro imágenes necesarias para estas rutas de navegación que puede descargar a continuación y cargarlas en su sitio de Weebly. No olvide reemplazar las URL de la imagen dentro de CSS con sus propias URL.

Nota: Los estilos de ruta de navegación 1, 2, 3 y 4 en el CSS descargado representan los ejemplos 3, 4, 5 y 6 respectivamente, como se muestra arriba. No olvide reemplazar los enlaces de la imagen con sus propias URL.

Fuente de grabación: webnots.com
Deja una respuesta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More