Resumen de IA
¿Estás interesado en crear etiquetas inteligentes personalizadas basadas en campos generados con ACF (Advanced Custom Fields)? En este tutorial, te guiaremos a través del proceso de creación de estas etiquetas inteligentes especializadas utilizando un fragmento de código conciso.
Para la ilustración de este tutorial, consideremos un sitio de WordPress que utiliza publicaciones como elementos de cartera de ventas. Diseñaremos un único formulario que se mostrará en cada página de publicación, integrándolo perfectamente en la plantilla PHP.
Sin embargo, para que los autores puedan enumerar eficazmente sus artículos en venta, necesitarán introducir los precios correspondientes. Aprovechando el plugin ACF, hemos incorporado un campo de Precio en la configuración de la publicación.
Este campo de Precio se rellenará previamente en el formulario y se actualizará dinámicamente en función de la publicación que se esté viendo. Dado que el formulario permanece constante en todas las publicaciones, pero el precio varía, emplearemos una etiqueta inteligente para este campo para garantizar su adaptabilidad con cada actualización de información de la publicación.
Creación del campo personalizado con ACF
Primero, comenzaremos creando nuestro campo personalizado con el plugin Advanced Custom Fields.
Siguiendo la documentación de ACF, hemos añadido un nuevo campo a nuestras publicaciones llamado portfolio_price.
Este tutorial asume que ya has añadido tus campos a tu publicación. Si necesitas ayuda para añadir campos a las publicaciones de WordPress utilizando el plugin Advanced Custom Fields, consulta su documentación.
Creación de una etiqueta inteligente a partir del campo ACF
Normalmente crearíamos el formulario primero. Sin embargo, como sabemos que queremos usar esta nueva etiqueta inteligente dentro de nuestro constructor de formularios, vamos a añadir el fragmento antes de crear el formulario.
Si necesitas ayuda para añadir fragmentos a tu sitio, consulta este tutorial.
/**
* Register the Smart Tag so it will be available to select in the form builder.
*
* @link https://wpforms.com/developers/how-to-create-a-smart-tag-from-an-acf-field/
*/
function wpf_dev_register_smarttag( $tags ) {
// Key is the tag, item is the tag name.
$tags[ 'portfolio_price' ] = 'Portfolio Price';
return $tags;
}
add_filter( 'wpforms_smart_tags', 'wpf_dev_register_smarttag' );
/**
* Process the Smart Tag.
*
* @link https://wpforms.com/developers/how-to-create-a-smart-tag-from-an-acf-field/
*/
function wpf_dev_process_smarttag( $content, $tag ) {
// Only run if it is our desired tag.
if ( 'portfolio_price' === $tag ) {
//Get the field name from ACF
$my_acf_field = get_field( 'portfolio_price', get_the_ID() );
// Replace the tag with our link.
$content = str_replace( '{portfolio_price}', $my_acf_field, $content );
}
return $content;
}
add_filter( 'wpforms_smart_tag_process', 'wpf_dev_process_smarttag', 10, 2 );
Vamos a desglosar estas dos funciones.
La primera función crea una etiqueta inteligente vacía con el nombre ‘Portfolio Price’. Aún no se asignará nada a esta etiqueta, solo la estamos creando con esta función.
La siguiente función es donde definiremos la etiqueta inteligente y de dónde debe extraer la información.
Con la línea $my_acf_field = get_field( ‘portfolio_price’, get_the_ID() ); le estamos diciendo al código que debe ir a Advance Custom Fields y obtener el valor de este campo. Deberás introducir el nombre del campo aquí. Para nuestro tutorial, nombramos nuestro campo portfolio_price.
Si necesitas ayuda para encontrar el nombre de tu campo, simplemente edita el campo que creaste en ACF y busca la etiqueta Field Name.
Creación del formulario
Hemos creado nuestro formulario para que tenga los campos de formulario Nombre, Correo electrónico, Título del producto (Texto de una sola línea), Precio del producto (Texto de una sola línea) y Comentarios (Texto de párrafo).
Si necesitas ayuda para crear un formulario, consulta este tutorial.
Añadiendo las etiquetas inteligentes
Para nuestro formulario, vamos a incluir el Título del producto, que es el título de la publicación. Podemos usar una etiqueta inteligente incorporada que WPForms ya proporciona para esto.
Una vez que agregues el campo Texto de una sola línea para el Título del producto, simplemente haz clic en la pestaña Avanzado. En el Valor predeterminado para el campo, haz clic en el enlace Mostrar etiquetas inteligentes y selecciona el Título de la publicación/página incrustada para que el título de la publicación rellene automáticamente este campo del formulario.
A continuación, repetiremos este paso de nuevo para el campo Precio del producto.
En la pestaña Avanzado del campo Precio del producto, selecciona la etiqueta inteligente {portfolio_price} de las etiquetas inteligentes disponibles.
Añadir el shortcode de WPForms a una plantilla PHP
Si necesitas ayuda para añadir un shortcode a una plantilla PHP, revisa este tutorial.
Para este tutorial, hemos añadido nuestro shortcode al final de la plantilla de la página de entrada única.
Ahora puedes ver cómo, a medida que tus entradas cambian, también lo harán el Precio del producto y el Título del producto de tu formulario.
¿Te gustaría crear más etiquetas inteligentes personalizadas? Echa un vistazo a nuestro tutorial sobre Cómo crear una etiqueta inteligente personalizada.