Tutorial Divi: Anima todo tipo de contenido, no solo imágenes

Cuanto más te metes a crear webs con Divi más te das cuenta de que no todo se puede hacer mediante módulos y botones, que en ocasiones, para personalizar todo a tu gusto no te queda más remedio que añadir algo de CSS, lo que es normal en todo desarrollo.

Y una de esas situaciones es cuando quieres añadir animaciones fácilmente a elementos que no sean imágenes y descubres que el desplegable de animaciones solo está disponible en el módulo de imagen.

Pero si investigas un poco en el CSS del código de Divi encuentras una clase llamada et-waypoint que permite añadir animaciones a cualquier elemento, y funciona.

Solo tienes que añadir esta clase CSS al elemento que desees, unida a una de estas otras clases CSS:

  • et_pb_animation_fade_in (fundido de entrada)
  • et_pb_animation_bottom (animación de abajo a arriba)
  • et_pb_animation_top (animación de arriba a abajo)
  • et_pb_animation_right (animación de derecha a izquierda)
  • et_pb_animation_left (animación de izquierda a derecha)

Con lo que deberías añadir algo como lo siguiente en el campo «Clase CSS» de la pestaña «CSS personalizado» del módulo de Divi al que quieras añadir una animación. Por ejemplo:

et-waypoint et_pb_animation_left

En este caso para añadir la animación de izquierda a derecha.

Simplemente deja un espacio entre cada clase CSS. Guardas los cambios y verás que funciona de maravilla, simple y efectivo.

El resultado es que consigues añadir animaciones a cualquier módulo de Divi, no solo al de imagen.

VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(9 votos, promedio: 5)

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te funciona? pues entonces no he dicho nada :)

Sobre el autor

5 comentarios en “Tutorial Divi: Anima todo tipo de contenido, no solo imágenes”

      1. Ricardo Sarubbi Cufré

        Hola Fernando soy de Buenos Aires y me gusta mucho tu blog y tus consejos. Quiero preguntarte, he leído bastante últimamente, acerca de Elementor. Saludos y gracias, Richard

  1. Jose Luis López de Ciordia

    ¡Muchas gracias! Sobre estos cambios en el CSS… ¿son de los que requieren hacer un tema hijo para que no se eliminen con una actualización del tema? ¿O al venir esa opción CSS sin editar archivos no es necesario? Gracias de nuevo

Deja un comentario

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

Información base sobre privacidad:
  • Responsable: Fernando Tellado ([email protected])
  • Fin del tratamiento: Moderación de comentarios para evitar spam
  • Legitimación: Tu consentimiento
  • Comunicación de los datos: No se comunicarán los datos a terceros salvo por obligación legal
  • Derechos: Acceso, rectificación, portabilidad, olvido

 

Ir arriba Ir al contenido