Cómo añadir y modificar columnas con WordPress y Divi

por | Jul 7, 2019

Las columnas son un elemento básico en la estructura de una página web, principalmente nos permiten maquetar bloques de contenidos y darles un aspecto visual más llamativo y ayuda a entender mejor el contenido de dicha página.

En WordPress la mayoría de los maquetadores o constructores visuales permiten crear filas y dentro de ellas columnas con múltiples disposiciones como, por ejemplo:

1/1 para una columna de anchura completa

½ + ½ para dos columnas

1/3 + 1/3 + 1/3 para tres columnas

Pero lo que os quiero enseñar hoy es un paso más allá, y es que Divi en su afán por continuar ampliando las posibilidades de diseño visual en páginas web ha añadido una nueva y mejorada configuración para las columnas, la cual nos permite añadir estilos y efectos sin necesidad de tocar ni una línea de código.

Te puede interesar: Añadir botones de redes sociales en Divi

[toc]

Cómo añadir una columna con Divi

Lo primero que tenemos que hacer es crear una página o entrada nueva y editarla con el Divi builder. Una vez dentro del constructor visual tenemos que añadir una fila o sección.

Estas secciones pueden ser:

  • Regular: Son secciones que respetan el ancho de la página
  • Especialidad: Permite hacer combinaciones con distintos anchos de columnas
  • Anchura completa: Estas secciones sobrepasan el ancho de la página

En la mayoría de casos utilizaremos secciones de tipo Regular. Al seleccionar esa opción ya podremos elegir cuantas columnas queremos y la disposición que quieres que tengan.

Modificar columnas con el nuevo editor mejorado de Divi

Hasta aquí todo lo que hemos visto son las opciones básicas que traía Divi por defecto para añadir columnas, pero con la última actualización 3.25 han incluido un editor mejorado que permite hacer auténticas virguerías con la disposición, tamaño y efectos de las columnas.

Si accedemos a la rueda del engranaje de la fila o sección veremos cómo nos aparece las distintas opciones para editar cada columna de manera individual.

Este nuevo gestor trata a las columnas como elementos secundarios de las filas por lo que desde un mismo panel de control podemos administrar, editar, reorganizar y eliminar cada columna por separado.

crear columnas editables con divi

Lo sorprendente de esto es lo fácil e intuitivo que se vuelve el añadir nuevas columnas incluso desde otras secciones.

Simplemente con arrastrar el modulo y colocarlo entre dos columnas se creará una nueva, con sus respectivos parámetros para editarla.

[bctt tweet=»Prueba las nuevas opciones de edición de columnas avanzadas con Divi»]

Aplica efectos de personalización a cada columna de manera individual

Aquí las opciones se vuelven prácticamente ilimitadas y es que ahora se suman las opciones de diseño de cada módulo más las de cada columna, estos efectos también puedes aplicarlo en la cabecera de tu web creando un menu personalizado con divi

Las opciones de diseño que actualmente permite para cada columna son:

  • Separación
  • Borde
  • Sombra de la caja
  • Filtros
  • Transformación
  • Efectos animados
  • CSS Personalizado

Como ves, añadir y modificar columnas con wordpress y Divi es una auténtica gozada y lleva la personalización de las páginas web a un nivel superior.

¿Y a ti, que te parecen las nuevas opciones de personalización de columnas con Divi? Deja un comentario con tus impresiones y si te ha gustado este post nos ayudarías mucho con tus 5 estrellitas.

Nos vemos en el próximo post ¡Un saludo!

Fuente: Elegant Themes

Consultor SEO local en Romerowebs | Web | + posts

¡Hola! Soy Matías Romero, diseñador web y consultor de SEO local. Me verás por aquí hablando de diseño web, wordpress, consejos de SEO, Google Maps y lo que se me vaya ocurriendo.

Nos vemos en las SERPS 😉

0 comentarios

Enviar un comentario

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

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Divi black friday 2023

¡El black friday de Divi está aquí! y esta vez han tirado la casa por la ventana. A partir del martes 21 de noviembre a las 4 p.m. podrás acceder al mayor descuento del año en la web de elegant themes.Miles de euros en descuentos y premiosHabrá miles de premios...