7 cosas que no sabía que podía hacer con los campos personalizados avanzados

Advanced Custom Fields (ACF) es casi sinónimo de desarrollo de WordPress. Con más de 4,5 millones de sitios, este complemento ha ayudado a WordPress a crecer a nuevas alturas. Conoces el complemento. Probablemente hayas construido con el plugin. ¿Pero lo estás aprovechando al máximo?

En esta sesión, analizaremos rápidamente algunas de las formas menos conocidas en las que puede aprovechar ACF para crear sus experiencias de WordPress más dinámicas, poderosas y atractivas hasta el momento.

Altavoces:

• Iain Poulson, gerente sénior de productos en WP Engine
• Rob Stinson, gerente de marketing de productos en WP Engine

Diapositivas de la sesión:

Transcripción:

Iain Poulson: Hola, y bienvenido a nuestra sesión sobre el complemento de campos personalizados avanzados. Soy Iain Poulson, gerente de productos de ACF en WP Engine, y aquí me acompaña Rob Stinson, nuestro gerente de marketing de productos. Hoy, lo guiaremos a través de una sesión bastante rápida de siete cosas que no sabía que podía hacer con el complemento Advanced Custom Fields, algunas cosas que son bastante nuevas y algunas cosas que son menos conocidas. Y la funcionalidad que vamos a centrar en un sitio ficticio que ha diseñado Rob, por lo que básicamente somos fanáticos de ejemplos reales en lugar de cosas abstractas, pero también somos grandes fanáticos de las películas.

Entonces, este sitio es una celebración del mejor período del cine, probablemente, posiblemente, las películas de los 90, por lo que el sitio se basa en reconocer y premiar las películas más populares y queridas de los 90. El sitio necesita exhibir películas y permitir que los usuarios voten por su favorito y, al más puro estilo de Rob, el sitio se ve muy bien. Entonces, comencemos, y comencemos desde el principio, e instalemos ACF. Dime cómo, Rob.

ROB Stinson: Genial, gracias, Iain. Sí, gracias, hombre. Se ve bastante bien, ¿no? Ha sido un buen poco de tiempo diseñarlo, me divertí un poco. Así que hemos ganado el contrato. Tenemos el proyecto y estamos iniciando, y lo primero que hicimos fue identificar, que esto tiene sentido en primer lugar, para ACF. Vamos a necesitar configurar un montón de campos personalizados para algunos tipos de publicaciones personalizadas, y hacer algunas plantillas interesantes y cosas por el estilo. ACF es la herramienta para el trabajo aquí. Entonces, por supuesto, primero debemos instalar ACF, y eso es lo primero aquí. Por lo general, sabemos que puede tomar el complemento como un archivo zip y cargarlo en el administrador de WordPress, de manera agradable y simple.

Esa es la forma estándar de instalar un complemento, pero también sabemos que a los desarrolladores en estos días les gusta administrar sus dependencias de manera un poco diferente. Por lo general, me gusta administrarlo dentro del código, y dentro del mundo de PHP, eso generalmente se hace con Composer. Ahora ha podido instalar complementos de WordPress desde el repositorio de WordPress.org durante algún tiempo con bastante facilidad con Composer, pero ha sido un poco más difícil hacerlo con complementos premium como ACF Pro.

Pero el lanzamiento más reciente hace un par de semanas, en realidad, hace aproximadamente un mes, hemos habilitado la capacidad de instalar ACL Pro ahora a través de Composer, lo cual es fantástico, así que vamos a hacerlo ahora mismo. Entonces, cómo hacer esto es, el paso número uno, debe agregar la URL del repositorio de ACF Pro Composer a su archivo composer.JSON. El paso número dos es crear un archivo auth.JSON para sus credenciales y colocarlo en la raíz de su proyecto, tanto localmente como en el camino hacia donde estamos implementando y el las credenciales que necesita para ese archivo ahora están disponibles en su área de cuenta en advancedcustomfields.com.

Entonces, si inicia sesión, verá un área de licencias, y hay algunas pestañas adicionales y cosas así, en realidad puede tomar todo el fragmento de código, copiar y pegar todo, o puede tomar el nombre de usuario individual y contraseña y llévela al archivo que ha creado, el archivo auth.JSON.

Y el tercer paso, ejecutamos el comando Composer, así que es agradable y fácil, un proceso de 3 pasos, pero fantástico porque significa que, como dije, los desarrolladores a los que les gusta tener un control un poco más preciso sobre cómo administran las dependencias de su proyecto, ahora puede hacerlo con ACF Pro, lo cual es fantástico. Por supuesto, hay más documentación al respecto, así que solo para profundizar y ver cómo se desempaqueta todo, salte a los documentos en el sitio web, y debería estar listo para comenzar. Genial, voy a vomitar a Iain por el número dos.

Iain Poulson: Correcto, ahora hablemos sobre la configuración de los datos para el sitio. Entonces, los tipos de publicaciones personalizadas son bastante fundamentales en WordPress en la forma en que crea un sitio que no se trata solo de publicaciones o páginas. Es la función de tipo de publicación personalizada que viene en cualquier versión de WordPress hace mucho tiempo que lo convierte en un CMS adecuado, y generalmente es el primer paso que dan los desarrolladores cuando están construyendo los sitios. Y eso siempre ha sido algo que ha sucedido fuera de ACF. Históricamente, registras un tipo de publicación con código o usas otro complemento para hacerlo, pero es la parte del viaje que se conecta bastante bien con ACF. Entonces, como parte de ACF 6.1, esa funcionalidad llegará al complemento, por lo que es el punto de partida natural del viaje.

Si desea crear un sitio con datos de estructura de datos, va a crear un tipo de publicación. Le va a agregar campos, y luego podría agregar algunas taxonomías, y luego comenzará a editar esos datos. Así que sí, eso es algo que hemos puesto en 6.1, y es muy emocionante tener todo ese flujo de construcción en CMS. Así que busquemos el sitio del premio VHS. Vamos a necesitar estructurar nuestros datos y hacer que WordPress haga lo que necesitamos que haga, así que en términos del tipo de publicación, como no queremos usar publicaciones y páginas, vamos a crear una publicación personalizada. escriba para película, para almacenar los datos de la película, el objeto de datos o el modelo de datos, pero obviamente en términos de WordPress, ese es un tipo de publicación personalizada.

Queremos clasificar las películas con una taxonomía para que podamos permitir que los usuarios vean fácilmente películas de un tipo de género, y luego obtendrán la vista frontal fácil, las URL simples que les permiten acceder a películas de ciertos géneros Y vamos a necesitar algunos campos adicionales para almacenar datos estructurados alrededor de una película, así que queremos, por ejemplo, que el director sea un campo de texto. Necesitaremos el año en que salió la película como un número, y vamos a necesitar algún tipo de relación para relacionar las películas entre sí y, por supuesto, necesitamos almacenar la cantidad de votos que obtendrá, y ese es el campo numérico.

Entonces, echemos un vistazo rápido en ACF 6.1, ¿cómo vamos a hacer eso? Así que esta es la pantalla de ACF 6.1, y notará una ligera diferencia, tenemos el menú en la barra lateral. Ahora es ACF, no solo campos personalizados, y esta es la pantalla de tipo de publicación. Así que solo soy yo configurando el tipo de publicación de la película. Es el flujo de trabajo más simple aquí, simplemente agregar una etiqueta singular para el tipo de publicación, que es película, la etiqueta plural, y se genera automáticamente la clave de tipo de publicación. La configuración pública está configurada de forma predeterminada porque quiero que esté visible en el front-end, el tipo de publicación, y quiero poder editarlo en el administrador.

Entonces, una vez que se guardó y agregó, lo bueno de la conexión aquí con ACF es el hecho de que el siguiente paso en el viaje es que hemos creado el tipo de publicación, ¿queremos agregar campos al tipo de publicación o queremos vincular los campos existentes al tipo de publicación o crear una taxonomía? Así que podemos hacer todo eso desde ese punto aquí, obviamente necesitamos ir y agregar esos campos. De acuerdo, al hacer clic en ese aviso para agregar nuevos campos al tipo de publicación de la película, obtenemos el Editor de grupos de campos, y se completa previamente en la parte inferior del Metabox de configuración.

Entonces, las reglas de ubicación ya están configuradas para decir, muestre estos campos, cuando esté editando el tipo de publicación de la película, y luego puede continuar y agregar sus campos, lo que ya hice aquí en la captura de pantalla. Así que tenemos el director, el año, los votos y las películas relacionadas. Luego, por supuesto, podemos registrar la taxonomía personalizada de la que hablamos, agregando el género y conectando la taxonomía de género con el tipo de publicación de películas. Pero estos son campos que hemos agregado que están adjuntos al objeto de la película, pero ¿qué pasa con los campos que necesitamos para almacenar datos que pueden ser más globales o de todo el sitio? Rob, ¿qué tenemos para eso?

Rob Stinson: Genial, gracias por eso, Iain, te ves bien. Nuestro modelo de contenido está funcionando muy bien, pero aún no hemos terminado. Ahora ya hemos cubierto la instalación de ACF Pro a través de Composer, y solo analizamos los tipos de publicaciones personalizadas y las taxonomías personalizadas en ACF. Ahora esas dos cosas que son muy, muy frescas, pero la tercera cosa que quiero cubrir ahora, es una vieja, pero buena. Y así ha estado en el complemento durante bastantes años, pero no todos lo saben, y no todos entienden completamente el valor de esto, por lo que vamos a ver ahora los campos globales con la página de opciones.

Ahora, por lo general, piensa en un campo personalizado y cómo almacena datos para una publicación en particular, una página o un tipo de publicación personalizada. Pero a veces tenemos la necesidad de almacenar datos que están asociados en todo el sitio, y un gran ejemplo en nuestro maravilloso sitio de premios VHS es este tipo de notificación superior o barra promocional. Y esta es una barra que queremos que persista en cada página del sitio Página de inicio, vas a la página de una película, está ahí. Si va a la página Acerca de, a la página de Contacto o a la página de Blog, esta pequeña barra se encuentra en todo el sitio sin importar a dónde navegue el usuario, por lo que no tiene sentido asociar esos datos relevantes con una publicación o un película.

Es algo que debería estar asociado con el sitio. Por lo tanto, queremos poder activar y desactivar esta barra porque queremos configurar las cosas, pero tal vez queramos activarla en ciertas épocas del año. Es posible que tengamos una promoción o una campaña en particular, por lo que queremos la capacidad de tener un campo booleano, para que podamos activarlo y desactivarlo. Además, queremos poder actualizar el texto de la acción llamada en sí, o en el botón, por lo que, por supuesto, los campos personalizados tienen mucho sentido para eso.

Ahora, para configurar una página de opciones, que es la característica dentro de ACF que nos permite hacer esto, el paso número uno es, normalmente en sus funciones, archivo .PHP, o puede, por supuesto, registrarlo en otro lugar, tal vez un complemento que está desarrollando. Pero va a registrar la página de opciones en sí, y hay algunas pequeñas configuraciones en la configuración que puede hacer. Puede tener una sola página de opciones, pero también puede tener múltiples, y las tiene como anidadas, por lo tanto, páginas secundarias o páginas principales y cosas así, para que pueda hacer cosas interesantes.

Para el nuestro, el nuestro es bastante simple. Solo estamos configurando una barra de notificación aquí, por lo que solo necesitamos la página única, por lo que el primer paso es registrar esa página de Opciones. Paso dos, como lo haríamos normalmente, crearíamos un grupo de campo. Lo llamaríamos campos de barra de promoción, o algo así, o campos de barra de notificación, y pueden ver que tengo mi campo booleano en la parte superior, así que verdadero o falso es la barra de promoción activa. Y luego tengo un campo de texto para el mensaje, un campo de texto para el texto del botón, un campo de URL para el enlace del botón, y luego también podríamos tener un tipo de aviso, pero tal vez queramos tener alertas o estilo promocional. avisos, y tal vez hagamos un estilo condicional interesante basado en lo que se seleccione allí.

Así que agregamos nuestro grupo de campos, y agregamos nuestros campos, y el paso tres está justo debajo de eso. Como saben, en las reglas de ubicación, ahora podemos seleccionar que la página de opciones es igual a, y ven la configuración del sitio que tengo allí, esa es la página de opciones que registré en el paso número uno. Y así, con todo eso hecho, en el administrador de WordPress ahora vemos en el lado izquierdo, en nuestra barra de administración tenemos Configuración del sitio, y hacemos clic en eso, y vemos todos los campos, como era de esperar.

Y podemos activar o desactivar la barra de notificaciones. Podemos actualizar el texto, actualizar el botón y luego esos datos estarán disponibles para nuestra plantilla, por lo que la experiencia de creación de plantillas con campos de datos dentro de una página de opciones es básicamente la misma que haría de otra manera. Hay un par de pequeños matices sobre cómo apunta específicamente al hecho de que esta es una página de opciones y no una publicación, pero salte a la documentación en advancedcustomfields.com, y lo guiará a través de cómo manejar eso. Número cuatro, te lo devolveré, Iain.

Iain Poulson: Gracias, Rob, sí. Ahora solo quiero hablar sobre cómo registramos campos mediante programación con ACF. Por lo tanto, crear campos en ACF es muy fácil con la interfaz de usuario de Field Editor, el tipo de cosas que conocemos y amamos, que hemos visto anteriormente, pero hay otras formas de definir campos. ACF nos permite exportar archivos JSON y PHP con definiciones de campo, y eso se puede usar para crear campos.

Pero, ¿sabía que, en realidad, existe en la comunidad ACF un paquete llamado ACF builder que le permite crear campos utilizando una especie de API fluida con código PHP? En realidad, es un paquete de terceros y se llama ACF Builder Package de StoutLogic. Sí, el enlace de GitHub está ahí. Básicamente, le permite crear campos directamente desde el código sin conocer las complejidades de cómo ACF necesita los datos de campo en PHP. Utiliza una forma realmente expresiva de hacerlo. Lo hace reutilizable y portátil.

Puede confirmar las definiciones de campo porque con los archivos PHP en su control de versión, es fácil colaborar. Es fácil de enviar a su mecanismo de implementación, y también elimina la interfaz de usuario del editor de grupos de campo, por lo que está definiendo esos campos en código que luego evita que los clientes tengan que tocar la interfaz de usuario, así que echemos un vistazo rápido a cómo hazlo. Para instalarlo, porque es un paquete, hemos hablado de Composer anteriormente. Este es un paquete de Composer que puede instalar con el siguiente comando, Composer adquiere StartLogic, el proveedor, ACF Builder, y luego este es el aspecto del código.

Está creando una instancia de Fields Builder, y le está dando el slug de lo que sería el grupo de campo. Y luego está diciendo, en este grupo de campos, agreguemos un campo de texto llamado Director. Agreguemos un campo numérico llamado Año y, lo que es más importante, vamos a establecer la ubicación para que el grupo de campos aparezca en el tipo de publicación de la película.

Y todo esto hace mucho por ti sin que tengas que pensar en ello, así que le das el nombre de director para la etiqueta de campo, y seguirá adelante y, obviamente, creará el slug o la clave para el campo sin que tengas que para agregar eso, por lo que quita mucho tipeo, mucho pensamiento y mucha creación propensa a errores. Y luego, la segunda parte es donde carga esa definición de campo en ACF, y creará el grupo de campo para usted.

Rob Stinson: Muy bien, el número 5 aquí, relaciones bidireccionales. Ahora, esto es interesante. Creo que recuerdo este proyecto específico en el que trabajé en el pasado en mis días de agencia donde realmente descubrí esto, y fue una especie de cambio de juego. Entonces, si esto no es algo que haya hecho antes con ACF, preste atención, porque esto es algo realmente útil, así que veamos un ejemplo. Mirando, por supuesto, nuestro sitio de premios VHS, tenemos una lista de, digamos, 100 películas, y hay diferentes formas de, obviamente, conectar estas cosas.

Tenemos nuestra taxonomía personalizada de género antes. Es posible que tengamos un par de campos diferentes que manejan cosas como etiquetas o agrupaciones, por lo que las relaciones bidireccionales son útiles cuando desea crear un tipo específico de conexión bidireccional entre dos publicaciones o, en nuestro caso, dos películas. Entonces, para nuestro ejemplo, digamos que tenemos estas tres películas en nuestra base de datos y todas están animadas, por lo que queremos crear una relación bidireccional con ellas.

Ahora, lo que eso significa es que tenemos nuestra primera película aquí, "Toy Story", una gran película, e identificamos que hay otras dos películas relacionadas que queremos asociar. Así que podríamos crear un campo de relación para nuestro tipo de publicación personalizada, que es películas, y tendríamos un campo de relación allí, y seleccionaríamos la película, "El rey león" y Princes Monon, lo siento mucho. Sigo tropezando con esta palabra. Lo estoy destrozando, pero la película se llama "La princesa Mononoke". Jajaja. Por favor, no me odies. Solo me cuesta pronunciar esa palabra por alguna razón.

E identificamos que estas dos películas están relacionadas, por lo que las seleccionamos del Campo Relación. Ahora, en este caso, tendría sentido que, sí, "El Rey León", por ejemplo, esté relacionado con "Toy Story" y, por lo tanto, "Toy Story" esté relacionado con "El Rey León". Entonces, tal vez normalmente iríamos a la pantalla de edición de "El Rey León", y luego encontraríamos "Toy Story", y la agregaríamos allí, pero estamos duplicando nuestro trabajo allí. Entonces, lo que hace una relación bidireccional es que automáticamente crea esa conexión para nosotros, lo cual es muy, muy útil.

Entonces, una vez que agregamos, por ejemplo, "El Rey León" a "Toy Story", "Toy Story" se agrega automáticamente al "Rey León", y eso es muy, muy útil. Ahorra mucho tiempo a los creadores y administradores de contenido. Reduce el riesgo de olvidar, o tal vez podría eliminar uno de una publicación y luego olvidarse de eliminarlo de la otra. Realmente, realmente simplifica la experiencia de edición de contenido, por lo que es algo realmente útil que se puede usar, especialmente en sitios interesantes como este. ¿Entonces cómo hacemos eso? Bueno, hay dos formas de hacer esto actualmente, y hablaré de una tercera cosa, tal vez, que vendrá más adelante este año.

Entonces, cómo se hace es, número uno, puedes hacer esto en código. Entonces, solo con el complemento ACF Pro instalado, puede escribir código para hacer esto. Y puede escribir una función que se conecte al filtro de valor de actualización de ACF, y este filtro se ejecuta antes de que se guarde un valor y básicamente lo que hace es tomar la publicación actual que está editando e identifica la ID de la publicación. que se agregó, y luego actualiza la otra publicación, y hace ese tipo de coincidencia en segundo plano para usted, por lo que es bastante útil.

Un poco de código, así que mientras te sientas cómodo con eso, no es un trabajo demasiado pesado. Pero nuevamente, hay un enlace allí, o una URL, que puede consultar en los documentos de Campos personalizados avanzados para ver cómo puede hacerlo. La opción dos, sin embargo, es sin código, lo cual es bueno algunas veces. Entonces, este es en realidad un complemento de ecosistema llamado ACF Extended. Está disponible en WordPress.org, y lo que hace es traer esa función a la propia interfaz de usuario de ACF.

Entonces, si instaló esta extensión, ACF Extended, y tiene instalado ACF Pro, verá una opción que cuando crea un campo de relación, hay un interruptor bidireccional que puede activar, y luego puede establezca eso en una colección allí mismo desde la interfaz de usuario, lo cual es bastante útil. Ahora las cosas están saliendo realmente interesantes con este proyecto, pero no perdamos la cabeza con él, ¿o deberíamos? Iain, hacia ti.

Iain Poulson: Sí, gracias Rob. Vale la pena llamar sin cabeza cuando se trata de ACF. ACF tiene soporte sin cabeza, así que sí, sitios subyacentes sin cabeza, naturaleza desacoplada de los sitios. Hay mucha comunicación de API en curso, y ACF tiene soporte de API. La API REST la agregamos de forma nativa en ACF a partir de 5.11 o 5.11, y admitimos GraphQL con el complemento WP GraphQL, que tiene un complemento ACF para WP GraphQL, por lo que ACF admite sitios sin cabeza. Tiene integración con el programa WP Engine Atlas para sitios de WordPress sin cabeza adecuados, pero hablemos solo de una especie de ejemplo del mundo real de cómo tomaría los datos que están en nuestro sitio de VHS WordPress y los usaría de forma desacoplada.

Entonces, por ejemplo, escúchame, la gente básicamente está votando en el sitio de premios de VHS, y van a ser, creo que pusimos una fecha arbitraria, tienen que votar hasta el final de la fecha determinada, y nosotros Veré cuál es el más popular. Tenemos nuestro cine local, y está haciendo una cartelera doble de las películas de los 90 más votadas. Así que tienen, en el cine, tienen su cartelera, y está en línea. Está conectado a la web y podemos potenciar dinámicamente lo que se muestra en esa cartelera, por lo que debemos conectarnos a nuestro sitio de WordPress.

Por ejemplo, la cartelera es una aplicación de nodo simple, necesitamos obtener los datos del sitio de VHS, así que echemos un vistazo rápido a cómo podemos hacerlo con un punto final de API REST personalizado, y como dije antes, hemos obtuve soporte de GraphQL. Se puede hacer en ambos sentidos, pero este es probablemente un ejemplo más simple de mostrar. Entonces, antes que nada, crearemos una función que básicamente obtenga los datos que necesitamos, así que solo revisando esto, es una consulta de WP que dice, quiero películas o tipos de publicación de un tipo de película, pero solo quiero dos Pero también quiero ordenarlo por el Campo ACF, que es el nombre del campo votos, y lo estamos ordenando en orden descendente, así que vamos a obtener la parte superior y la parte superior. dos.

Y luego, crearemos un punto final REST personalizado, que utiliza la función de devolución de llamada que creamos en la diapositiva anterior, y eso solo nos dará un punto final al que podemos acceder para obtener las dos películas. Entonces, cómo se ve eso en realidad, y esto es solo una prueba, entonces la URL es vhsawards.com, el WP-JSON, y luego le dimos un espacio de nombres de VHS Versión 1 en caso de que alguna vez queramos cambiar la API, y solo tenemos una estructura de URL muy simple de popular.

Y eso es solo devolver un objeto JSON con dos elementos, los dos más votados, que resultó ser "Fight Club" y "Goodfellas", que son bastante buenos, así que sí. Eso definitivamente es bueno para mostrar cómo ACF potencia los sitios desacoplados y sin cabeza, pero es bastante difícil hablar de WordPress en este momento sin mencionar los bloques. No puedo creer que hayamos llegado tan lejos sin siquiera mencionar los bloques. ¿Qué tienes para nosotros, Rob, para cambiar eso?

Rob Stinson: Definitivamente tenemos que hablar de bloques. Antes de hacerlo, me di cuenta de que justo antes, cuando estábamos viendo el número cinco sobre las relaciones bidireccionales, insinué una tercera forma de hacerlo. No lo cubrí, así que todo lo que quiero decir es que mire este espacio porque estamos planeando, tenemos en la hoja de ruta, para ver cómo agregar un mejor soporte de relación bidireccional de forma nativa en el propio complemento, para que pueda facilitar esas cosas simplemente dentro del complemento ACF sin la necesidad de material de terceros, así que solo mire este espacio, sin compromisos de tiempo. Eso es algo que estamos viendo.

Así que número siete, sí. Veamos cómo crear un bloque personalizado con ACF. Ahora, la mayoría de la gente sabe que puede hacer esto en ACF ahora, pero no necesariamente todos lo han probado. Entonces, si está en ese campamento y es un usuario de ACF desde hace mucho tiempo, y no ha usado la funcionalidad de bloqueo personalizado ahora, mire esto, porque puede que le pida que vea el valor de esta característica. Pero, ¿cómo vamos a usar esto para los VHS Awards? Tal vez queramos tener un componente de bloque para nuestro sitio que podamos agregar en varios lugares, y esa es la belleza de un bloque personalizado, o cualquier bloque, es que se puede usar y colocar en páginas y publicaciones en todo el sitio, y queremos para crear un bloque de llamada a la acción personalizado.

Ahora bien, este es un bloque bastante simple, y definitivamente puedes hacer cosas más interesantes con bloques personalizados. Lo mantendremos simple ahora. Pero este banner azul, llamada al bloque de acción, queremos poder colocarlo en la página de inicio, o tal vez en algunas publicaciones de blog y cosas por el estilo, alentando a los lectores y visitantes del sitio a hacer clic en ese botón, y continuar, y vota por su película favorita de los 90. Entonces, ¿cómo construiríamos este bloque personalizado con ACF? Y la razón por la que lo estamos haciendo como un bloque personalizado es que tiene un diseño único.

Tiene este gradiente de fondo interesante para este patrón de puntos repetitivos, y nos dimos cuenta de que es más fácil para nosotros construirlo como un bloque personalizado con ese control ajustado que nos brinda, en comparación con lo que quizás podríamos hacer con bloques que están fuera del estantería con núcleo de WordPress. ¿Entonces como hacemos esto? El paso número uno es registrar nuestro bloque personalizado, generalmente en functions.PHP, o donde sea que esté escribiendo este tipo de código. Agradable y simple, y apuntamos al directorio donde finalmente estarán los archivos de plantilla para nuestro bloque personalizado, así que ese es el paso número uno.

Paso número dos, creamos nuestro grupo de campos y agregamos nuestros campos. Entonces, para nuestro bloque de acción llamada, también queremos tener texto, texto de botón, enlace de botón y color de fondo. Tal vez queramos dar la opción de alguna variación en el estilo para esto. El número tres es que vamos a, en las reglas de ubicación, vamos a seleccionar bloque, y vamos a decir es igual a, y hemos registrado el bloque de CTA anteriormente, y es por eso que está disponible para nosotros allí en ese menú desplegable. Ahora pasamos a nuestro archivo de plantilla, por lo que todos los campos y todo está configurado, y ahora vamos a hacer algunas de nuestras plantillas. Ahora, la creación de plantillas es diferente en algunos aspectos a la forma en que, quizás, tradicionalmente crearía una plantilla con ACF.

Pero en muchas otras formas, es muy, muy similar, por lo que muchos de los patrones que normalmente emplea para su desarrollo, los usará a medida que construye sus bloques personalizados, lo cual es fantástico. Entonces, en nuestro proyecto, diremos que es nuestro tema personalizado. Tenemos un directorio de bloques, luego tenemos un directorio CTA, que coincide con el bloque que hemos registrado, y luego normalmente tendría tres archivos de plantilla, block.JSONsomething.PHP, que es nuestro marcado HTML, y luego punto CSS para nuestro estilismo

Así que este es el tipo de bloque JSON, y aquí es donde hemos registrado el bloque, pero así es como podemos resolver las cosas un poco más, y hay mucho que puede hacer aquí en torno a la configuración y varias características nativas de Core que puede activar o desactivar, poner a disposición de su bloque personalizado. Así que definitivamente revise la documentación sobre esto y comprenda lo que se puede hacer, porque aquí es realmente donde puede, como dije, configurar cómo ese bloque está disponible, y se muestra, y las funciones, las funciones principales que puede pasar. a su bloque personalizado.

Entonces tenemos nuestro archivo de plantilla, nuestro archivo PHP, y pueden ver aquí que estoy configurando variables que interactúan con el campo Obtener, interactuando con nuestros datos de campo allí, un poco de lógica condicional muy simple en nuestro estilo allí, y luego nuestro HTML para nuestro propio bloque. Y luego no voy a caminar a través del CSS. Sabes lo que es CSS, y estoy seguro de que probablemente podrías escribir mejor CSS que el que he escrito aquí, pero entiendes la idea. Tiene un archivo CSS para el estilo de su bloque, y puede ver que tenemos algunas cosas interesantes sobre las fuentes y el fondo degradado radial para ese tipo de fondo de puntos, que es divertido.

Pero nuevamente, la razón por la que estamos creando este bloque personalizado es porque queremos que ajuste nuestro CSS, nuestro estilo, para que podamos implementar el diseño en el que estamos trabajando. Y solo para mostrarle cómo se ve esto en el Editor, puede ver, podemos seleccionar nuestro bloque de Acción llamada, puede iluminar de par en par. Podemos interactuar con nuestros campos, agregar el texto para el texto y el botón, y también agregar un enlace para el botón, y ese es un bloque personalizado muy atractivo que podemos pasar a nuestros editores de contenido.

Iain Poulson: Sí, gracias, Rob. Que buena vista. Realmente necesitamos poner eso en vivo. Eso es increíble. Bien, repasemos lo que hemos hablado hoy. Así que analizamos cómo instalar ACF Pro, pero con Composer. Hablamos sobre cómo registrar tipos de publicaciones personalizadas y taxonomías en ACF. Analizamos el registro de campos globales, o de todo el sitio, con una página de opciones, y analizamos una forma diferente de registrar campos mediante programación con un paquete.

Rob profundizó en las relaciones y cómo crear relaciones bidireccionales. Hemos tocado el headless con ACF, y Rob acaba de hacer un gran ejemplo de creación de un bloque personalizado con ACF sin casi nada aparte de algo de PHP, HTML y CSS, y no reacciona en absoluto, así que eso es realmente bueno. Esto ha sido genial, Rob. ¿Qué son los votos? ¿Cómo hemos salido?

Rob Stinson: Mire, para mí, todo se reduce a esto: la mejor película de los 90 es, sin lugar a dudas, "Hook" de Robin Williams. Mucha nostalgia envuelta para mí en eso, me encanta esa película. ¿Y tú, Ian?

Iain Poulson: Para mí, tiene que ser "Robin Hood, Prince of Thieves" de Kevin Costner. Es un clásico. Olvídese del mal pelo, los salmonetes, el acento inglés poco fiable que ni siquiera es un acento inglés. Es la mejor película de Robin Hood de todos los tiempos, y esa es una colina en la que estoy dispuesto a morir.

Rob Stinson: Ja, ja, no, es justo. Miren, gracias a todos por pasar el rato. Espero que hayas aprendido algo, y estamos ansiosos por ver lo que construyes con ACF, saludos.