La combinación de Advanced Custom Fields (ACF) con el Theme Builder de Divi es una de las más poderosas en WordPress: te permite crear plantillas dinámicas donde los datos de cada entrada — textos, imágenes, fechas, URLs — se cargan automáticamente desde campos personalizados, sin código adicional. En esta guía te mostramos cómo configurarlo desde cero.
¿Por qué ACF + Divi es tan poderosa?
El editor visual de Divi tiene soporte nativo para contenido dinámico desde la versión 4.0. Esto significa que en cualquier módulo de texto, imagen o botón puedes hacer clic en el ícono de contenido dinámico y vincular ese campo directamente a un dato de la base de datos de WordPress: título del post, imagen destacada, fecha, autor… o cualquier campo personalizado de ACF.
El resultado: diseñas una sola plantilla en el Theme Builder y Divi la renderiza con los datos reales de cada entrada automáticamente. Sin plantillas PHP, sin loops manuales, sin código. Esto es lo que convierte a Divi + ACF en una herramienta ideal para portafolios, directorios, catálogos de propiedades, bases de conocimiento y cualquier sitio que maneje tipos de contenido estructurado.
Paso 1: Instalar Advanced Custom Fields
Ve a tu panel de WordPress → Plugins → Añadir nuevo → busca «Advanced Custom Fields» (el plugin de WP Engine, anteriormente Elliot Condon) → instala y activa. La versión gratuita es suficiente para la mayoría de los casos. La versión Pro agrega campos avanzados como Repeater, Flex Content, Clone y el bloque de Gutenberg — útiles en proyectos más complejos.
Una vez activado, aparecerá un nuevo ítem en el menú de administración: Campos personalizados.
Los tipos de campos disponibles en ACF
ACF ofrece una amplia variedad de tipos de campo. Estos son los más utilizados en combinación con Divi:
| Tipo de campo | Uso en Divi (módulo recomendado) |
|---|---|
| Text / Textarea | Módulo de texto, módulo de encabezado |
| Image | Módulo de imagen, imagen destacada de sección |
| URL | Módulo de botón, módulo de video dinámico |
| Number | Estadísticas, precios, duraciones |
| Date Picker | Fechas de eventos, cursos, publicaciones |
| True/False | Visibilidad condicional de módulos |
| Relationship | Conectar CPTs relacionados |
| Repeater (Pro) | Listas dinámicas, itinerarios, características |
Paso 2: Crear un grupo de campos personalizados
Ve a Campos personalizados → Añadir nuevo. Lo primero que debes configurar es la regla de ubicación — a qué tipo de contenido aplica este grupo de campos. Las opciones más comunes:
- Post Type es igual a post: aplica a todas las entradas del blog.
- Post Type es igual a [tu CPT]: aplica solo a ese tipo de contenido personalizado.
- Página es igual a [página específica]: aplica solo a una página concreta.
Para el ejemplo del tutorial, crearemos un grupo «Destinos de viaje» que aplica a las entradas del blog con campos como: Bio del viajero, Lugar del viaje, Días del tour, Cosas recomendadas, Cosas no recomendadas y URL de reserva.
Paso 3: Llenar los campos en cada entrada
Una vez creado el grupo, al editar cualquier entrada (o CPT) que cumpla la regla de ubicación, verás el grupo de campos de ACF debajo del editor de contenido. Llena los datos de cada campo para esa entrada.
Es importante que los campos estén llenos antes de diseñar la plantilla en el Theme Builder, porque Divi necesita datos reales para mostrar la vista previa mientras diseñas.
Paso 4: Conectar ACF con el Theme Builder de Divi
Ve a Divi → Theme Builder → Añadir nueva plantilla. Asigna la plantilla al tipo de contenido que corresponde (por ejemplo: «Posts del blog individuales» o «Tu CPT específico»).
Dentro del Theme Builder, inserta un módulo de texto donde quieras mostrar un campo de ACF. Haz clic en el ícono de dólar (contenido dinámico) que aparece en el campo de texto del módulo. Divi mostrará una lista de fuentes dinámicas disponibles, entre las que estarán los campos de ACF que creaste.
Selecciona el campo y Divi vinculará ese módulo al dato de ACF. A partir de ese momento, cada entrada mostrará su propio valor en esa posición del diseño, automáticamente.
¿Quieres llevar esto más lejos? Aprende a crear Custom Post Types en WordPress para combinarlos con ACF y Divi en proyectos más avanzados.
Casos de uso reales: ACF + Divi en proyectos
Directorio de profesionales
CPT «Profesional» con campos ACF: especialidad, teléfono, ciudad, foto de perfil, URL de agenda. Divi renderiza una card con toda la información de cada profesional desde un único template.
Catálogo de propiedades inmobiliarias
CPT «Propiedad» con campos: precio, metros cuadrados, habitaciones, baños, mapa (Google Maps field de ACF Pro). La plantilla muestra cada propiedad con su propia información sin duplicar código.
Portfolio de proyectos de diseño web
Post type «Proyecto» con campos: cliente, año, tecnologías usadas, URL del resultado, galería de capturas. La plantilla en el Theme Builder de Divi muestra los datos de cada proyecto de forma consistente.
ACF vs otras alternativas de campos personalizados
| Plugin | Compatibilidad con Divi | Curva de aprendizaje | Costo |
|---|---|---|---|
| ACF (Advanced Custom Fields) | ✅ Nativa en Divi | Baja | Gratis / $149/año Pro |
| Meta Box | ✅ Con extensión MB Divi Integrator | Media | Gratis / $79/año Pro |
| CMB2 | Parcial (requiere código) | Alta | Gratis |
| Pods | Parcial | Media-alta | Gratis |
Para diseñadores que trabajan principalmente con Divi, ACF es la opción más recomendada porque Elegant Themes la ha integrado directamente en el sistema de contenido dinámico del Theme Builder.
Preguntas frecuentes sobre ACF con Divi
¿ACF funciona con Divi 5?
Sí. Divi 5 mantiene el soporte para contenido dinámico y ACF. Los campos configurados para Divi 4 siguen funcionando en Divi 5 sin necesidad de migración.
¿Puedo usar ACF con el módulo de Loop de Divi 5?
Sí. El módulo Loop de Divi 5 puede listar CPTs y dentro de cada item del loop puedes vincular módulos a campos de ACF, igual que en el Theme Builder clásico.
¿Necesito ACF Pro o la versión gratuita es suficiente?
La versión gratuita cubre la mayoría de los casos: campos de texto, imagen, URL, número, fecha, selección, etc. Necesitas ACF Pro si quieres usar el Repeater Field (para listas de duración variable dentro de un mismo campo) o el Flex Content (para layouts variables por entrada).
¿Los datos de ACF aparecen en el sitemap de Yoast SEO?
Los datos de ACF se almacenan como metadatos de la entrada y no aparecen directamente en el sitemap, pero influyen en el contenido renderizado de la página que Yoast sí indexa. Para campos de texto importantes para el SEO, considera incluirlos también en el cuerpo del post o en el extracto.
Conclusión
ACF + Divi Theme Builder es la combinación que transforma WordPress de un CMS de blogs a una plataforma capaz de construir prácticamente cualquier tipo de sitio. El flujo es siempre el mismo: crear el grupo de campos en ACF, llenar los datos en cada entrada, diseñar la plantilla una sola vez en Divi vinculando los módulos a los campos dinámicos. A partir de ahí, cada nueva entrada se renderiza automáticamente con su información. El siguiente paso natural es combinarlo con Custom Post Types para tener tipos de contenido completamente independientes del blog.
¿Quieres dominar estas técnicas con proyectos reales? Accede a los tutoriales premium de UXDivi o conoce el plan de membresía.
Comentarios
9 comentariosPara dejar un comentario, accede a tu cuenta de UXDivi.
Acceder a mi cuenta →Hola,
Tengo la siguiente pregunta en cuanto a los contenidos dinámicos.
Estoy generando un blog el cual lo quiero hacer dinámico, pero mi problema es que además de texto e imágenes cada post lleva un vídeo y al ser hecho desde Theme Builder no me deja cambiar la Url de dicho vídeo.
¿Alguna solución que se te ocurra?
Gracias por los contenidos que publicas, son de muy buena calidad y de interés.
Saludos
Que tal Sebastian, si hay una solución pero es un poco compleja de implementar. Esta solución la tenemos apuntada para grabar en un tutorial premium dentro de uxdivi.com
Hola,
Yo tengo el mismo problema que Sebastián. La plantilla que creo para publicación de Entrada en el generador de temas no me presenta los campos en el front end.
¿Habéis hecho el tutorial?
Muchas gracias
Que tal Laura, así es, hemos hecho un tutorial donde hemos solucionado como hacer videos dinámicos con Divi: https://uxdivi.com/blog/como-hacer-el-modulo-de-video-dinamico-en-divi
Hola Jefferson,
Muchas gracias por facilitarme el enlace y las cosas con DIVI.
Lo solucioné gracias a los comentarios de YouTube del tutorial. Vi que le pasaba a más gente y respondiste que si no funcionaba el contenido dinámico en el generador de temas usásemos un shortcode y funcionó!!! Con el campo Wywisy y con el HTML del vídeo se ve perfectamente. Muchas gracias!!!! Sois los mejores
¡Excelente! ¡Qué bueno! Es un gusto poder ayudar.
Que tal Sebastián, hemos hecho un tutorial donde hemos solucionado como hacer videos dinámicos con Divi: https://uxdivi.com/blog/como-hacer-el-modulo-de-video-dinamico-en-divi
Hola Jeff.
No se si con ACF puedo hacer lo que necesito.
Debo usar una pasarela de pago (obligatoria por el cliente), llamada Sipay, dentro del woocommerce que les desarrolle.
Investigando algo leí que debería crear un webhook (no tengo idea), y allí me pierdo totalmente.
No se como crear eso.
Si tienes algo que hayas investigado o presentado y no he visto, por favor indicame.
En líneas generales debo hacer que se enlace con ellos, ya me pasaron formas pero ellos nunca lo han hecho con woocommerce.
Cualquier ayuda que tengas por favor doc.
Gracias Gracias Gracias
Que tal Wilmer, por favor, plantea la duda en el foro de «eCommerce» para poder ayudarte. Saludos.