En este tutorial premium aprenderás a realizar un increíble header el cual estará conformado por dos menús, uno principal y otro secundario.
El menú secundario tendrá un efecto sticky (stick to top) el cual consiste en quedarse fijo en la parte superior al ir haciendo scroll, además los iconos que conforman nuestro menú desaparecerán al colocarse en la parte top de la ventana. Cómo plus agregaremos un enlace activo a cada opción del menú al llegar a cada sección correspondiente.
También animaremos el logotipo y la llamada de acción (botón principal) en nuestro menú secundario para hacer un header más atractivo.
Este header es completamente responsive, es decir, se adapta correctamente tanto a computadoras, tabletas y móviles.
Todo lo anterior ¿suena genial verdad? Pues ya no esperes más y aprende a realizar este increíble ejercicio.
En este tutorial premium aprenderás a crear una sección con módulos anuncio o blurb clickeables en divi sin plugins.
El ejercicio consiste en crear una composición con dos columnas; en la columna izquierda mostraremos la información correspondiente de cada blurb de la columna derecha, es decir, al ir haciendo click en cada una de las miniaturas de la columna derecha se nos irá mostrando la información correspondiente de cada módulo en la columna izquierda.
Este tipo de funcionalidad es imposible de realizar por defecto con divi así que fiel a la costumbre de OV DIVI nos apoyaremos de un pequeño fragmento de código jquery exclusivo de OV DIVI para agregar este tipo de funcionalidad en cualquier sitio web desarrollado con este increíble constructor visual.
El ejercicio de este tutorial está enfocado en la creación de un menú de comida pero en realidad puedes aplicarlo en cualquier sitio web, aquí ya dependerá de tu creatividad de cómo quieras aplicar esta funcionalidad.
Si te ha parecido interesante este ejercicio recuerda que podrás desbloquear esta habilidad suscribiendote a los tutoriales exclusivos donde no solo tendrás acceso a este ejercicio sino a muchos ejercicios más que te ayudarán a subir tus habilidades con divi y wordpress…
En este tutorial premium aprenderás a diseñar un dropdown menú tipo Google App desde cero con divi y sin plugins.
Este tipo de menús es muy funcional cuando tenemos varios elementos en nuestro menú que necesitamos seccionar y organizar de mejor manera. El menú consiste en tener un icono con dots y al hacer click en éste se nos despliegue un dropdown menú con las opciones correspondientes visualmente atractivas.
El ejercicio lo realizamos desde cero, es decir, empezamos a construir el menú para escritorio, tableta y teléfonos, lo adaptamos correctamente pixel por pixel a todas las resoluciones para al final agregar la funcionalidad del dropdown menú. No sólo aprenderás a crear el dropdown menú si no que vas aprender a realizar un menú con el constructor visual usando buenas prácticas con divi.
Si quieres darte una mejor idea de que trata, puedes visitar la demo y si ya estás convencido de realizar este tutorial puedes unirte a los tutoriales exclusivos de la Academia OV DIVI para que tengas acceso a este tutorial y muchos tutoriales más.
En este tutorial premiun único y exclusivo de los tutoriales exclusivos de la Academia OV DIVI aprenderás a crear un menú hamburguesa flotante (fixed floating menu) con el generador de temas de divi y lo mejor es que no dependeremos de plugins.
Este menú flotante lo adaptaremos a una plantilla predeterminada de divi pero obviamente puedes adaptarlo a cualquier proyecto web sin complicaciones.
Al usar secciones, filas y módulos para construir este menú hamburguesa flotante tendrás la posibilidad de insertar cualquier elemento dentro de éste, es decir, no está limitado a insertar solamente enlaces sino que puedes insertar cualquier módulo de divi cómo imágenes, videos, un formulario de contacto, de suscripción, de login, en fin, cualquier módulo que se te ocurra y consideres se adapte bien al formato. No hay limites.
Si quieres tener acceso a este y muchos más tutoriales premium exclusivos de divi te invito a unirte a los tutoriales exclusivos, créeme valen completamente la pena 😍
En este tutorial premium y único de los tutoriales exclusivos de la Academia OV DIVI aprenderás a crear una funcionalidad que consiste en cambiar o reemplazar el logo y color de los enlaces del menú dependiendo la sección al hacer scroll en nuestros sitios web creados con divi.
Hay ocasiones que queremos mantener fijo el header de nuestro sitio web, pero muchas veces en nuestra página estamos implementando fondos claros y oscuros en diferentes secciones, por lo tanto, si nuestro logotipo es blanco éste se perderá con las secciones del mismo color y si nuestro logotipo es negro también se perderá con las secciones con fondo de color oscuro. Es aquí dónde entra la funcionalidad que aprenderás el día de hoy ya que gracias a unos fragmentos de código seremos capaces de reemplazar el logotipo y color de los enlaces dependiendo la sección en la que nos encontremos al ir haciendo scroll o desplazarnos sobre la página.
Realmente es una funcionalidad que te vendrá bien en más de un proyecto, ya que este detalle es muy común que nos pase en nuestros sitios web. Así que si quieres aprender a implementar esta funcionalidad te espero dentro de los tutoriales exclusivos.
Un abrazo.
ACTUALIZACIÓN: Tutorial liberado gratis para el canal de youtube.(17/11/21)