How to Create a Smart Tag from an ACF Field

Introduction

Would you like to create custom Smart Tags from fields you created with ACF (Advanced Custom Fields)? In this tutorial, we’re going to walk you through how to create these unique Smart Tags with just a little snippet.

For the purpose of this tutorial, this site is using WordPress posts as portfolio items for sale. We will create one form that will be shown on every post page by inserting this form into the PHP Template.

However, when the authors create their posts to sell, they’ll need to be able to enter a price for their item. We’ve used the ACF plugin to add a field to the post named Price.

This will be pre-populated on the form and will change depending on the post you are viewing.

Since the form will not change from post to post but the Price will change, we want to use a Smart Tag for this field so that the price will change as the post does.

Creating the custom field with ACF

First, we’ll start with creating our custom field with the Advanced Custom Fields plugin.

Following along with the ACF documentation, we have added a new field to our posts called portfolio_price.

Adding the snippet to create a Smart Tag from the ACF field

Normally we would create the form first. However, since we know we want to use this new Smart Tag inside our form builder, we’re going to add the snippet before creating the form.

If you need help in adding snippets to your site, please see this 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 );

Let’s break down these two functions.

The first function is creating an empty Smart Tag with the name ‘Portfolio Price’. Nothing will be assigned to this tag yet, we’re just creating it with this function.

The next function is where we will define the Smart Tag and where it should pull the information from.

With the line $my_acf_field = get_field( ‘portfolio_price’, get_the_ID() ); we’re telling the code that it needs to go to Advance Custom Fields and get this field value. You’ll need to enter the field name here. For our tutorial, we named our field portfolio_price.

If you need help in finding your field name, simply edit the field you created in ACF and look for the label Field Name.

Creating the form

We’ve created our form to have the Name, Email, Product Title (Single Line Text), Product Price (Single Line Text), and Comments (Paragraph Text) form fields.

Adding the Smart Tags

For our form, we’re going to bring in the Product Title, which is the post title. We can use a built-in Smart Tag that WPForms already provides for this.

Once you add the Single Line Text field for the Product Title, just click on the Advanced tab. In the Default Value for the field, click the Show Smart Tags link and select the Embedded Post/Page Title to have the post title automatically fill in this form field.

Next, we’ll repeat this step again for the Product Price field.

On the Advanced tab of the Product Price field, select the {portfolio_price} Smart Tag from the available Smart Tags.

Adding the WPForms shortcode to a PHP template

If you need help with adding a shortcode to a PHP template, please review this tutorial.

For this tutorial, we’ve added our shortcode to the bottom of the single post page template.

Now you can see as your posts change, so will your form’s Product Price and Product Title.

Would you like to create more custom Smart Tags? Take a look at our tutorial on How to Create a Custom Smart Tag.

Related

Filter References:

• wpforms_smart_tags
• wpforms_smart_tag_process