Tutorial de Advanced Custom Fields ACF con Divi y su contenido dinámico

¡Hola DiviFans! en este Tutorial de Advance Custom Fields ACF con Divi y su contenido dinámico aprenderán a crear campos de contenido personalizado dentro de las entregas, y así luego traerlo al sitio web a través de los contenidos dinámicos en el Theme Builder de Divi.

Tiempo de lectura estimado: 0 minutos

Índice

Cuando usamos Divi Builder en combinación con el contenido dinámico, rápidamente nos encontraremos creando platillas dinámicas a mansalva. En el tutorial de hoy, te mostraremos cómo crear algunos campos de información totalmente dinámicos utilizando Divi Theme y un grupo de campos personalizados que habremos creado con Advance Custom Fields ACF.

Preview

Al terminar el tutorial, podrás conseguir un resultado como este:

¿Cómo crear contenido dinámico con ACF y Divi?

Después de la actualización de Divi 4.0 donde introdujeron el Theme Builder se abrieron un mundo de posibilidades para el diseño web con Divi. Uno de los cambios principales fue la introducción del contenido dinámico, con el que podemos traer al front-end de la web diferentes tipos de elementos, tales como los textos, las imágenes, y los enlaces, de forma dinámica, escogiendo estos tipos de contenidos desde el mismo Divi Builder.

Instalar y activar el plugin ACF dentro de WordPress

Nos vamos al instalador de plugins y buscamos ACF en el buscador, una vez encontramos el plugin le damos instarlar y activar.

Configurar grupo de campos

Lo siguiente que debemos hacer es configurar un nuevo grupo de campos personalizados. Lo logramos yendo a Panel de WordPress > Campos personalizados > Agregar nuevo .

Queremos que el grupo de campos aparezca exclusivamente en las publicaciones de las entradas o los post, aunque pudiéramos aplicar reglas adicionales dependiendo del objetivo que queramos con nuestro sitio web. Para hacerlo, debemos asegurarnos de que las siguientes reglas se apliquen al grupo de campos:

• Post Type es igual a post

Agregar campos

Una vez que hemos creado el grupo de campos personalizados, es hora de agregar los diferentes campos dentro de nuestra publicación. Para el ejemplo de este post usaremos algunos campos relacionados con un destino de viaje.

Los campos creados serán:

• Bio del viajero
• Lugar el viaje
• Días del tour
• Cosas que recomendamos
• Cosas que no recomendamos
• Contrata este tour

Llenar los campos en el post del blog.

Una vez que hayamos creado los campos, nos vamos a nuestras entradas y procedemos a llenar la información de los campos personalizados creados en cada una de ellas.

Finalmente, asignar los campos dinanicamente a los módulos dentro del theme builder del blog.

Como último paso, nos vamos a maquetar nuestro blog con el theme builder de Divi, donde vamos a asignar dichos campos a contenidos como textos que traeremos dinamicamente a nuestro post.

Es importante recordar que para que los datos dinámicos se muestren todos los campos personalizados dentro de nuestro blog deben estar llenos.

Conclusiones

En este tutorial te mostramos cómo crear crear campos de contenido personalizado con el plugin de ACF y así luego traerlo al sitio web a través de los contenidos dinámicos en el Theme Builder de Divi. Son pasos bastante sencillos, pero que una vez tomas practicas, puedes crear cosas geniales tal como lo hacemos dentro de uxdivi.com

¡Nos gustaría saber qué piensas! ¿Podrás en practica la creación de los campos personalizados dentro de Divi? Déjanos tus opiniones en la parte inferior de este post.

¡Muchas gracias! ¡No olvides compartir este contenido en tus redes sociales!

Nos vemos el el proximo video tutorial.