Todo lo que necesitas saber sobre el módulo de lista de iconos de Divi 5
Publicado: 2025-08-31Una de las últimas actualizaciones de Divi 5 introdujo carruseles y animaciones de lottie, así como algo que cada sitio puede usar: el nuevo módulo de lista de iconos. En lugar de puntos de bala simples, puede crear listas de estilo con íconos significativos que agregan claridad y atractivo visual.
Piense en las características en una página de producto, pasos en un proceso, servicios en una tabla de precios o incluso beneficios en una página de destino. El módulo de la lista de iconos hace que todo sea más fácil de diseñar y más atractivo para los visitantes.
En esta publicación, cubriremos todo lo que necesita saber sobre el módulo de lista de iconos, desde características hasta casos de uso prácticos, para que pueda actualizar sus listas y mejorar sus sitios Divi.
- 1 ¿Cuál es el módulo de lista de iconos?
- 1.1 Características clave
- 2 Cómo usar el módulo de lista de iconos
- 2.1 Agregar espacio entre elementos de la lista de iconos
- 2.2 Configuración de diseño universal para todos los elementos de la lista de iconos
- 3 ejemplos prácticos utilizando el módulo de lista de iconos
- 3.1 Blog de viajes
- 3.2 Características en un sitio comercial
- 3.3 Guía de proceso paso a paso
- 3.4 páginas de tiendas de comercio electrónico
- 4 Descargar gratis
- 5 Use el módulo de lista de iconos en Divi 5
¿Cuál es el módulo de lista de iconos?
El módulo de lista de iconos en Divi 5 está diseñado para crear listas estructuradas y atractivas que mejoren el diseño de su sitio. Al permitirle combinar cada elemento de la lista con un icono único, este módulo transforma el texto sin formato en contenido profesional y atractivo.
Antes de Divi 5, la creación de listas estilizadas en DIVI requirió formato de texto o módulos de propaganda, que era menos eficiente. El módulo de lista de iconos llena este vacío, ofreciendo una solución dedicada que es fácil de usar y altamente personalizable.
Características clave
El módulo de lista de iconos tiene características que lo convierten en una gran adición a Divi 5. Aquí están sus características clave:
Creación de lista fácil
Cree listas rápidamente agregando elementos y asignando iconos de la extensa biblioteca de iconos de Divi o cargando iconos personalizados. La interfaz intuitiva del módulo le permite construir listas pulidas en minutos, ahorrando tiempo en comparación con el formato manual.
Opciones de personalización extensas
Elija entre cientos de iconos incorporados, ajuste su tamaño, color y colocación para crear un aspecto cohesivo que se alinee con el diseño de su sitio.
Aproveche la potente configuración de diseño de Divi para personalizar las fuentes, los colores de texto, el espacio, la alineación y los fondos. También puede agregar efectos o animaciones de desplazamiento para hacer que sus listas sean más interactivas.
Cómo usar el módulo de lista de iconos
Comenzar con el módulo de lista de iconos de Divi 5 es fácil. Cree una nueva página o abra una existente. Haga clic para agregar un nuevo módulo y elija la lista de iconos .
Después de agregar el módulo, verá tres elementos de la lista de iconos en la pestaña de contenido. Comencemos haciendo clic en el primero para editarlo.
En la pestaña Contenido, ingrese un título en el campo de texto .
A continuación, expanda la pestaña desplegable del icono. Aquí, puede elegir entre cientos de íconos en la Biblioteca Divi. Puede buscar iconos o desplazarse para encontrar el que desea usar.
El módulo de lista de iconos le permite agregar enlaces a elementos de la lista individual, lo que facilita vincular a otras páginas, archivos adjuntos y más.
La pestaña de diseño es donde puede diseñar los elementos de su lista de iconos. En el menú desplegable del icono, asigne un color y tamaño de icono.
En la pestaña de fondo, puede asignar a su icono un color de fondo, agregar un borde o sombra de caja y ajustar el espacio.
Algunas otras opciones incluyen texto, donde controla la alineación del texto o agrega una sombra de texto. Sin embargo, para peinar el texto, elija el menú desplegable Texto del cuerpo. Puede asignar una fuente, peso, estilo, alineación de texto, color, tamaño y más allí.
Al igual que todos los demás módulos Divi, puede controlar el tamaño, el espacio, las sombras de los bordes y las casillas y agregar filtros, transiciones o animaciones.
Una vez que haya diseñado el primer elemento de la lista de iconos, puede copiarlo fácilmente, cambiar el icono y actualizar el texto.
Agregar espacio entre elementos de la lista de iconos
En la sección anterior, demostramos cómo agregar elementos de la lista de iconos. En esta sección, revisaremos cómo ajustar las propiedades de diseño utilizando el sistema de diseño FlexBox de Divi 5. Como puede ver, podríamos usar un poco de espacio entre cada uno de nuestros elementos de la lista de iconos.
En la configuración del módulo de lista de iconos principales, haga clic en la pestaña Diseño. Localice el menú desplegable de diseño y expanda para revelar la configuración.
Por defecto, Flex se selecciona bajo estilo de diseño. Esto le permite usar la configuración de Flexbox de Divi 5 para controlar el espacio, las instrucciones de diseño y la alineación. Para agregar espaciado entre cada elemento de la lista de iconos, simplemente ajuste el espacio vertical. Esto agrega espacio para respirar entre cada elemento, dando a nuestra lista más atractivo visual.
Configuración de diseño universal para todos los elementos de la lista de iconos
Además de diseñar elementos de la lista de iconos individualmente, puede usar la configuración de diseño del módulo principal para agregar estilos a cada elemento de la lista de iconos a la vez. Por ejemplo, si desea que todos sus íconos tengan el mismo color, texto o estilos de fondo, puede hacerlo a nivel de módulo.
Ya sea que desee diseñar elementos de la lista individualmente o en su conjunto, el módulo de lista de iconos en Divi 5 proporciona una excelente manera de mostrar información de una manera más fácil de usar.
Ejemplos prácticos utilizando el módulo de lista de iconos
El módulo de lista de iconos es versátil y puede mejorar diferentes áreas de su sitio web. Aquí hay algunos ejemplos prácticos para inspirar sus diseños.
Blogs de viajes
El módulo de lista de iconos ofrece una excelente manera de crear contenido atractivo en su blog de viajes. Puede usarlo para resaltar categorías en su blog, itinerarios de viaje, consejos de embalaje o destacados de destino. Además, puede combinar los efectos del flujo y usar diferentes iconos para cada elemento de la lista para presentar información de una manera clara y elegante.
Características en un sitio comercial
Use el módulo de lista de iconos para mostrar los servicios de su negocio. Asigne íconos relevantes y personalice colores para que coincida con su marca. También puede agregar enlaces a páginas de servicio para una fácil navegación.
Guía de proceso paso a paso
Cree una lista que describa los pasos de un proceso, como "Cómo registrarse". Use marcas de verificación para guiar visualmente a los usuarios a través de cada paso, haciendo que la información compleja sea más digerible.
Páginas de tiendas de comercio electrónico
Para los sitios de comercio electrónico, use el módulo de lista de iconos para resaltar las funciones de su tienda. Combina con los módulos WOO de Divi 5 para crear una página de categoría de productos cohesivos.
Descargar gratis
Únase al boletín Divi y le enviaremos una copia del último paquete de diseño de la página de destino de Divi, además de toneladas de otros recursos, consejos y trucos de Divi increíbles y increíbles. Sigue y serás un Divi Master en poco tiempo. Si ya está suscrito, simplemente escriba su dirección de correo electrónico a continuación y haga clic en Descargar para acceder al paquete de diseño.
Te has suscrito con éxito. ¡Consulte su dirección de correo electrónico para confirmar su suscripción y obtener acceso a paquetes de diseño semanales de Divi gratuitos!
Use el módulo de lista de iconos en Divi 5
El módulo de lista de iconos en Divi 5 ofrece una excelente manera de crear listas funcionales elegantes con poco esfuerzo. Su facilidad de uso, opciones de personalización robustas y su integración perfecta con las nuevas características de Divi 5 lo hacen imprescindible para los usuarios de Divi. Ya sea que esté destacando los servicios, guiando a los usuarios a través de un proceso o mostrando características del producto, este módulo lo ayuda a ofrecer resultados profesionales que involucran a su audiencia.
¿Listo para probarlo? Descargue el último Alpha Public Divi 5 hoy y explore el módulo de lista de iconos usted mismo. Estén atentos para más actualizaciones de Divi 5 mientras lanzaremos nuevas funciones.