¿Cómo puedo arreglar la barra lateral de Divi? (barra lateral fija)

La barra lateral de un sitio web debe ser relevante. Entonces, ¿cómo se arregla la barra lateral de Divi? Si su barra lateral contiene muchos widgets, es posible que sus visitantes ya se hayan olvidado del que está en la primera posición, ¿verdad? Por no mencionar que si el contenido de su artículo es muy largo, la barra lateral también puede estar vacía cuando su lector llegue al final del artículo.

Así es como se comporta la barra lateral de forma natural, no es fija y sube con el contenido del artículo:

Para evitar que la barra lateral termine antes del final del contenido principal, algunos temas ofrecen la opción de tener una barra lateral fija. Esto significa que cuando el usuario se desplaza hacia abajo en la página, su barra lateral permanece posicionada en la parte superior, justo debajo de la cabecera del sitio y sólo revelará el final de su contenido cuando se llegue al final del artículo.

Divi no permite esto de forma nativa. ¡Encaminado! Una nueva opción de Divi (lanzada en agosto de 2020) le permite adjuntar cualquier módulo al desplazamiento. Es muy fácil, sólo hay que marcar una pequeña casilla. Esta opción se llama Opción Divi Sticky.

Si quieres conseguir el mismo resultado, se necesita Javascript... Como no se le da a todo el mundo, en este artículo propongo una solución mucho más sencilla... Hay varias maneras de hacer que su barra lateral sea fija.

Aviso: este artículo contiene enlaces de afiliación que reconocerá fácilmente. Los enlaces clásicos están en púrpura y los enlaces patrocinados están en rosa.

1 - ¿Qué es una "barra lateral"?

La barra lateral es la barra lateral que suele estar en el lado derecho de la sección del blog/artículo de su sitio de WordPress. Puede estar en el lado izquierdo dependiendo de las opciones de su tema.

La barra lateral muestra los widgets que puedes gestionar desde la pestaña Apariencia > Widgets. Hay muchos widgets y esta lista puede ampliarse en función de las extensiones que utilices...

¿Sabías que puedes probar Divi gratis? Ir a esta página y haga clic en "PRUEBA GRATUITA

2 - ¿Qué poner en una barra lateral?

Hubo un tiempo en el que se podía encontrar de todo en una barra lateral: un calendario, una convocatoria de boletines, una suscripción al blog, una barra de búsqueda, una inserción en la página de Facebook, un muro de Twitter, etc. Sin embargo, esto no es prudente. Una barra lateral no es un cajón de sastre y debe ser sobria y eficaz.

Evita los módulos de la página de Facebook o de la cuenta de Instagram: ¿realmente crees que vas a convertir cientos de lectores en seguidores con esto? No lo creo, pero es sólo mi opinión personal.

Por el contrario, creo que distrae a tus visitantes y hace que abandonen tu sitio: ¿es eso lo que quieres? Por no hablar de que puede ralentizar su sitio considerablemente. Así que mantén la sencillez y utiliza tu barra lateral con prudencia.

Por mi parte, imagino que la barra lateral es un lugar promocional y estratégico, utilízala más bien para convertir a tus lectores en algo más: suscriptores, clientes, etc.

Por no hablar de que todos los widgets inútiles pueden causar daño a su sitio, especialmente en términos de rendimiento (velocidad del sitio).

Lea también: ¿Cómo mejorar el rendimiento de su sitio de WordPress con Divi?

3 - ¿Cómo arreglar la barra lateral de Divi simplemente?

Para arreglar la barra lateral de Divi tendrás que hacer... qué, entre 1 y 5 clics dependiendo de la alternativa que elijas. En ambos casos, es pan comido.

3.1 - Alternativa 1: Utilizar la opción "Sticky Position" de Divi

Esta opción está disponible en el Visual Builder desde agosto de 2020. En el siguiente vídeo, Nich Roach -el fundador de Elegant Themes- le hace una demostración que lo dice todo:

Esta opción de visualización permite de forma nativa fijar elementos de su Diseño de Divi para desplazarse. Puede colocar los elementos en la parte inferior de la página o en la parte superior.

Por lo tanto, esta opción es perfecta para fijar el módulo de la barra lateral de su diseño Divi:

Tomemos el ejemplo de esta captura de pantalla... Se trata de un plantilla de artículos creada con el tema constructor pero también funciona si no se utiliza el Constructor de temas Divi La opción "Posición fija" funciona tanto en el Constructor Visual como en el Constructor de Temas.

Para arreglar la barra lateral del blog, simplemente abre la configuración del módulo y ve a la pestaña Avanzado > Efectos de desplazamiento y establece "Posición pegajosa" en "Pegar a la parte superior". Eso es todo, su barra lateral se fija en la parte superior de la página y luego se desliza hacia afuera cuando el lector llega al final de la página.

3.2 - Alternativa 2: Utilizar la extensión "Q2W3 Fixed Widget

Si no utiliza el Theme Builder o el Visual Builder para escribir las entradas de su blog, tendrá que utilizar una extensión que añada la funcionalidad de la barra lateral fija.

La ampliación Q2W3 Widget fijo le permite hacer esto.

Ve a la pestaña Extensiones > Añadir para instalarlo y activarlo y luego a la pestaña Apariencia > Opciones de widgets fijos para configurar algunas opciones.

En este panel de control, no tendrá que hacer mucho más que definir un margen externo "arriba" y "abajo".

En mis pruebas, noté que se necesitaban 100px para la parte superior y 250px para la parte inferior si el sitio utiliza widgets de pie de página o 100px para la parte superior y 100px para la parte inferior si el sitio no utiliza widgets de pie de página. Estos son los ajustes que han funcionado mejor, pero puede ser diferente para usted, así que siéntase libre de probar.

Por último, ve a la pestaña Apariencia > Widget, abre todos tus widgets y marca la casilla "Widget fijo". Esta casilla debe estar marcada para todos sus widgets.

Ya está, todo debería estar perfecto ahora. Has instalado el plugin Q2W3 Fixed Widget y debería haber arreglado la barra lateral de Divi. Ahora sólo tienes que comprobar el renderizado del front-end...

4 - En conclusión: ¡una barra lateral fija en un abrir y cerrar de ojos!

¿Qué te parece? Hacer que la barra lateral sea fija cuando el usuario se desplaza hacia abajo en la página es una buena manera de hacer visibles algunos widgets que pueden desaparecer rápidamente cuando el contenido del artículo es demasiado largo.

Y sobre todo, ¡es tan fácil!