Nuevas Funciones en:

Fondos y Degradados, Formularios de Contacto, Animaciones, Sombras, Fuentes y Textos

Crea Páginas Web Más Espectaculares

Utiliza Toda la Potencia de Divi Builder y su Constructor Visual

 

Desde la Llegada de Divi 3.0 en Septiembre de 2016, con su potente Constructor Visual, muchas han sido las mejoras que han ido llegando al exitoso Tema de Elegant Themes, mejorando día a día su facilidad de utilización y ampliando su potencia y funcionalidades a la hora de crear Páginas Web Premium.

Las Nuevas Funciones afectan a distintos aspectos de Divi, aquí las describiremos en el mismo orden cronológico en que han ido apareciendo.

 

En este articulo veremos las 6 primeras actualizaciones de Nuevas Funciones, que afectan a los siguientes apartados:

  • Nueva Interfaz de opciones de Fondos y Degradados.
  • Nuevo Formulario de Contacto con más opciones, lógica condicional y validación de campos.
  • Opciones de Animaciones Avanzadas para todos los Módulos, Filas y Secciones de DIvi.
  • Controles de Sombras en Cajas para todos los Módulos, Filas y Secciones.
  • Mejoras en opciones de Fuentes, controles de Encabezado e innumerables opciones de Diseño de Texto.
  • Nuevas opciones para añadir fácilmente impresionantes Sombras de Texto en cualquier módulo.

El siguiente vídeo muestra una introducción al Tema Divi 3.0 realizada por Nick de Elegant Themes.

 


 

1. Nueva Interfaz de Opciones de Fondos

Nuevas Funciones en Diseño Web en Divi 3.0

  • Gestión de fondos más fácil

Las secciones, filas, columnas y módulos de Divi tienen muchas opciones de fondo. Anteriormente, estas opciones para colores de fondo, imágenes y vídeos, incluidas las configuraciones secundarias para modos de paralaje, imagen de fondo, tamaños de vídeo y transparencia de color se encontraban en una larga lista dentro de la pestaña Diseño. La gran cantidad de configuraciones dificultaba la navegación, y a menudo, no quedaba claro qué estilos de fondo había habilitados y la prioridad visual de esos estilos de fondo.

Con la Nueva Interfaz de Opciones, tenemos todas las configuraciones de fondo de Divi organizadas en un nuevo y elegante sistema de pestañas. Esta nueva interfaz ofrece una vista previa de cada estilo de fondo y deja claro qué estilos se han habilitado y cómo interactúan entre sí.

 

  • Fondos de Degradados

Dentro de la nueva interfaz de opciones de fondo hay un nuevo estilo de fondo: Degradados de Fondo. Ahora puedes crear bellos degradados con facilidad utilizando el nuevo conjunto de opciones de degradados del constructor. Elije los colores, elije el estilo de degradado, ajusta el ángulo y ¡listo! Hay infinidad de formas geniales para combinar degradados y crear diseños divertidos y vibrantes.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Controles de Imagen de Fondo

Dentro de la pestaña de la Imagen de Fondo de la nueva interfaz de opciones de fondo hay algunas opciones de imagen completamente nuevas que te brindan más control sobre el tamaño, la posición y el estilo de las imágenes de fondo. Ahora puedes controlar el tamaño de fondo, la posición y el valor de repetición de todas las imágenes de fondo.

También se ha agregado soporte para los modos de mezcla de CSS. Cuando agregas una imagen de fondo, ahora puedes cambiar entre diferentes modos de fusión que cambiarán la forma en que la imagen interactúa con el color de fondo o el degradado detrás de ella. La combinación de modos de mezcla con degradados de fondo puede crear algunos resultados bastante sorprendentes.

Nuevas Funciones en Diseño Web en Divi 3.0

 


 

2. Nuevo Formulario de Contacto

  • Nuevos tipos de entrada

El Nuevo Módulo de Formulario de Contacto ahora contiene todos los tipos de entrada que necesitas, incluidos los menús desplegables, las casillas de verificación y los botones de opción, y la nueva interfaz facilita la gestión de elementos secundarios dentro de estos nuevos tipos de campos. Agrega y quita elementos desplegables y botones de opción con facilidad e incluso elije qué elementos deben ser preseleccionados.

 

CASILLAS DE VERIFICACIÓN

Nuevas Funciones en Diseño Web en Divi 3.0

 

MENÚS DESPLEGABLES

Nuevas Funciones en Diseño Web en Divi 3.0

 

BOTONES DE OPCIÓN

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Lógica condicional

Se han implementado Opciones de Lógica Condicional en el módulo de Formulario de Contacto que permiten mostrar y ocultar campos en función de la información que seleccionan los usuarios. Por ejemplo, puedes crear un formulario de presupuesto de Diseño Web Dinámico utilizando la lógica condicional que muestra campos adicionales cuando los usuarios seleccionan ciertos paquetes de Diseño Web. Si el visitante elige la opción de eCommerce, automáticamente mostrará campos adicionales para solicitar más información sobre su negocio. El sistema de lógica condicional es muy robusto y permite mezclar y combinar varias reglas para crear casi cualquier combinación que puedas imaginar.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Validación de campos

Nuevas Funciones en Diseño Web en Divi 3.0

Cada tipo de entrada ahora incluye Reglas de Validación de Campos que puedes usar para asegurarte de que la información que los visitantes introducen está formateada correctamente, como restringir caracteres a letras y números. También puedes definir longitudes mínima y máxima para campos de entrada estándar.

Hay muchas situaciones en las que es posible que desees imponer límites de caracteres o Validar los Datos que los visitantes introducen para asegurarte de que estén formateados correctamente. Esto puede reducir el error del usuario e identificar errores de auto-completar. Por ejemplo, si preguntas por la edad de alguien, puedes requerir que la entrada de los datos del usuario solo contenga números. También podrías imponer un límite de caracteres de 3 ya que ninguno tendrá 1,000 años.

 

 


 

3. Animaciones Avanzadas

  • Combina animaciones para crear efectos impresionantes

Todos los elementos de Divi ahora tienen Opciones de Animación, lo que significa que puedes combinar estilos de animación entre distintos Módulos, Filas y Secciones para crear secuencias de animación increíbles que harán que tus visitantes se queden boquiabiertos.

Los elementos animados se pueden combinar para crear bellas series de animación usando demoras e intensidades escalonadas para crear efectos realmente deslumbrantes.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Siete estilos únicos de animación

El nuevo sistema de animación viene con SIete Estilos de Animación Diferentes, incluidos Fade, Slide, Bounce, Zoom, Flip, Fold y Roll. Cada estilo de animación diferente crea un efecto único que se puede usar para diferentes tipos de contenido y cada estilo se puede personalizar con los Controles Avanzados de Animación. Puedes hacer que las animaciones sean rápidas, ágiles o lentas y sutiles, ajustar el tiempo, agregar demoras, cambiar la dirección y crear el conjunto perfecto de animaciones para tu página.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Controles avanzados para cada estilo de animación

Nuevas Funciones en Diseño Web en Divi 3.0Las animaciones son Altamente Personalizables gracias a la nueva interfaz de animaciones, que te permite crear estilos de animación personalizados que se adaptan a tu Página Web.

Una de las opciones de animación únicas de Divi es su Deslizador de Intensidad Personalizado. Esta opción te permite transformar rápidamente la intensidad de tu animación de sutil a agresiva, lo que te permite elegir la personalidad de tus animaciones. ¡Simplemente desliza el control deslizante y Divi hace todos los cálculos en el fondo para ti! Todos hemos visto sitios web con extravagantes animaciones que están totalmente fuera de control, pero con Divi puedes atenuar fácilmente tus animaciones y encontrar esa transición perfectamente serena.

También hay muchas otras opciones que te brindan un control total sobre tu estilo de animación. En total, hay siete opciones diferentes que puedes usar para ajustar tu animación.

 

 


 

4. Controles de Sombras en Cajas

  • Control personalizado completo

Los nuevos Controles de Sombras en Cajas te dan la capacidad de diseñar fácilmente maravillosos efectos de sombras y aplicarlos a cualquier módulo, fila o sección en tu página. Puedes crear sombras personalizadas utilizando los nuevos controles de sombreado de cuadro, o puedes seleccionar rápidamente entre muchos estilos de sombreado prefabricados y aplicarlos a cualquier elemento con un solo clic.

Cualquier módulo, fila y sección en Divi Builder ahora tiene un conjunto completo de opciones de sombreado de cuadro. Puedes controlar el color de la sombra de la caja, la posición, el desenfoque, la fuerza y controlar el inicio y final de las sombras. Crear y personalizar estas sombras es muy divertido en Visual Builder.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Diseños predefinidos fáciles de usar

Además de crear tus propios estilos de sombreado de caja, puedes seleccionar entre varios pre-ajustes. Estos siete estilos te permiten aplicar rápidamente todos los efectos de sombreado de caja más comunes con un solo clic. Una vez aplicado, la sombra se puede personalizar aún más utilizando el conjunto completo de controles.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Aplicar impresionantes efectos de sombra en cualquier elemento Divi

La nueva interfaz de Divi Builder hace que sea fácil crear sombras elegantes y aplicarlas a cualquier módulo, fila o sección. ¡Todo en Divi Builder puede tener sombras de caja añadidas! Es sorprendente la cantidad de maneras creativas en que se puede aplicar este conjunto de controles a diferentes módulos para crear estilos nuevos e interesantes.

Nuevas Funciones en Diseño Web en Divi 3.0

Nuevas Funciones en Diseño Web en Divi 3.0

 


 

5. Mejoras en Fuentes, Encabezados y Textos

  • La nueva interfaz de opciones de fuentes

La Nueva Interfaz para Administrar Fuentes en Divi Builder está repleta de nuevas fuentes, nuevas funciones y una experiencia de usuario mejorada.

Se han cuadruplicando las fuentes disponibles en Divi de 200 a 800! Además de esta lista estática de 800 Fuentes, también puedes agregar tu clave API de Google a las Opciones de Divi Theme que mantendrán tu lista de fuentes actualizada a diario. ¡Cada vez que se agrega una nueva fuente de Google, se mostrará automáticamente en Divi Builder! Estas nuevas fuentes abren infinidad de oportunidades nuevas para diseñar páginas únicas e impresionantes.

Nuevas Funciones en Diseño Web en Divi 3.0

Las principales opciones de la nueva interfaz de fuentes son las siguientes:

  • Búsqueda Sencilla en la lista de fuentes.
  • Acceso Rápido a las fuentes utilizadas recientemente.
  • Vista en Vivo de la fuente al seleccionarla en la lista.
  • Carga y Administración de Fuentes Personalizadas.
  • Nuevas opciones de Estilo de Fuente.
  • Mejores opciones del Grosor de la Fuente.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Control individual de los niveles de encabezado H1-H6

Ahora se pueden Controlar los Niveles de Encabezado para todos los módulos y aplicar estilos personalizados a los encabezados H1-H6.

Puedes crear Estilos de Diseño Personalizados para cada Nivel de Encabezado en Divi Builder, asignando fuentes personalizadas, tamaños de texto y estilos de fuente a H1, H2, H3, H4, H5 y H6 de forma independiente. Esto hace que los títulos personalizados sean mucho más útiles y prácticos cuando se usan dentro del módulo de texto Divi.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Innumerables nuevas opciones de diseño para los módulos de texto

Se han agregado Docenas de Nuevas Opciones de Diseño al módulo de texto para brindar un mayor control sobre los elementos de texto estándar.

El Módulo de Texto Divi tiene una nueva interfaz con pestañas para gestionar estilos de texto personalizados, incluidos los controles para párrafos estándar, citas, listas y enlaces. Ahora puedes controlar estilos sin tener que aplicar HTML personalizado o CSS en línea usando el editor de texto.

Nuevas Funciones en Diseño Web en Divi 3.0

 


 

6. Opciones de Sombreado de Textos

  • La nueva interfaz de sombra de textos

Agregar y personalizar Sombras de Textos es más fácil que nunca gracias a los ajustes preestablecidos de sombras de Divi y a una gama completa de controles de sombra de texto. El Divi Builder está equipado con una nueva interfaz para controlar las sombras de texto en cada módulo, y esta nueva interfaz se puede encontrar en todos los grupos de opciones de texto.

Agregar grandes sombras de texto a tu página es muy simple gracias a los diseños predefinidos de sombra que se pueden aplicar a cualquier elemento de texto con un solo clic. Se han pre-diseñado 5 estilos únicos de sombreado de texto que funcionan muy bien con cualquier tamaño de texto. Estos estilos son puntos de partida perfectos y se pueden personalizar aún más utilizando el conjunto completo de controles de sombra de texto.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Completamente personalizable

Todos los Módulos Divi se han actualizado con un conjunto completo de Opciones de Sombra de Textos, cada una de las cuales se puede gestionar dentro de la nueva interfaz Text Shadow. Todos los aspectos de estas sombras son personalizables, incluida la posición, la intensidad del desenfoque y el color, y la creación de sombras personalizadas en el Visual Builder es una experiencia verdaderamente maravillosa mientras observas cómo se mueven las sombras y cómo se transforman ante tus ojos.

Nuevas Funciones en Diseño Web en Divi 3.0

 

  • Funciona con todos los módulos

La nueva interfaz de sombra de texto está Disponible para Todos los Módulos y las sombras de texto se pueden aplicar y personalizar para cada elemento de texto individual.

Nuevas Funciones en Diseño Web en Divi 3.0

 


 

Es evidente que el equipo de Elegant Themes ha trabajado muy duro para poder ofrecernos todas estas actualizaciones, disponibles para su utilización de una forma fácil y divertida en el Constructor Visual de Divi.

Gracias a estas herramientas, podrás crear Páginas Web Espectaculares y Profesionales, con elementos visuales fácilmente configurables y todo sin tener que escribir ni una linea de código HTML o CSS.

En el próximo artículo sobre Nuevas Funciones, veremos mejoras relacionadas con Bordes, Filtros de Colores, Sistema de Ayuda, Prediseños de Divi y Divisores.