Formidable Forms

Formidable Forms

  • Features
  • Pricing
  • Resources
    • Docs & Support
    • Blog
    • Community
  • Solutions
    • Web Applications
    • Calculators
    • Surveys
    • Directories
    • Payments
    • Contact forms
  • Login
  • Get Formidable Forms

Kyle Cash / Last Updated January 20, 2023

How to Create an ACF Frontend Form [No Code!]

Looking to use Advanced Custom Forms on your WordPress site but don’t know how to code? This guide will help you create an ACF frontend form in no time!

How to Create an ACF Frontend Form

Approximate read time: 6 minutes

Advanced Custom Fields (ACF) is a powerful tool.

With the ability to customize your fields and build your forms exactly how you want, your possibilities are almost endless.

But there’s one problem. You have to know how to code to get your ACF forms on the front end of your website.

Formidable Forms is the best WordPress Form Builder plugin. Get it for free!

Or do you?

This post will show you how to create an ACF frontend form in WordPress with no code effortlessly! And it’s all done using Formidable Forms, the perfect ACF form builder.

Let’s get into it.

What’s wrong with using the Advanced Custom Fields front end form?

Actually, there’s nothing wrong with using ACF to create your Advanced Custom Fields frontend form!

ACF is a powerful tool; if you know how to code in PHP, you can create unique forms quickly. 

But, if you don’t know how to code, you’re left scratching your head at the foreign language in front of you.

Just check out this ACF form example code below:

ACF's front end forms require coding knowledge

So, you have two options:

  1. Learn to code and create your frontend forms with ACF
  2. Let Formidable Forms do all the hard work for you

While we have a team of excellent developers here at Formidable, we imagine you don’t.

So, we’ll focus on option #2 today for our Advanced Custom Fields frontend form tutorial.

👉 Want to update an ACF repeater field with no code?: How to Update Repeater Fields in ACF [The Easy Way!]

How to display ACF frontend form with Formidable

Subscribe on YouTube

To get started, you’ll need a few things:

  1. Formidable Forms Business plan
  2. ACF plugin (free or pro)

 Get Formidable Forms now!

To use some of the more advanced fields with the ACF frontend, the pro version is required. However, for basic fields, you can use the free version.

If you want more info, be sure to check out our ACF Knowledgebase docs!

So, once you get Formidable Forms installed and activated, go to Formidable → Add-ons and click the Install button for the ACF Forms.

Then, it’s just a few easy steps:

  1. Create ACF form fields
  2. Create your ACF frontend form in Formidable
  3. Map your fields

    Let’s get started.

    Formidable Forms pro plans

    Step 1: Create ACF form fields

    For our example, we have a bird-watching blog named Here Birdie Birdie.

    Here Birdie Birdie Example Website

    We want a way for users to have their bird-watching submissions that will automatically display as a custom post type on the blog.

    So, we want to create a few fields for users to enter information:

    1. Name
    2. Date
    3. Time
    4. List of birds saw
    5. Additional comments

    So, the first thing we want to do is head into ACF to customize the fields. Luckily, Formidable supports mapping for 19 different ACF field types. So, you’ve got plenty of options.

    To do this, go to Custom Fields → Field Groups and click Add New.

    Click the Add New Button to create your ACF fields

    Next, you can add your fields by clicking the Add Field button.

    So, we’ll create the fields listed above and customize them to fit our needs.

    ACF Example Fields

    We'll use an ACF Repeater field to make it easier for visitors to show all the birds they saw. The repeater field allows users to add or remove as many entries as they want.

    We’ll use a Dropdown (Select in ACF) field in these fields so the visitor can choose from a list of birds. We’ll also add a number field to enter how long they saw each bird.

    ACF Select Menu examples

    Feel free to customize this to your own needs. But, to get more advanced features (like the Repeaters, you must purchase ACF Pro).

    Once you’re finished, click Save Changes.

    Step 2: Create your ACF frontend form in Formidable

    Now, we’ll create the form that will show on the front end of your website.

    So, go to Formidable → Forms in your WordPress admin panel.

    Next, click Add New at the top of the page, then choose to start from a Blank Form or one of Formidable’s templates.

    Click add new to create a new form

    Feel free to select the option that’s best for your situation. We’ll start with a Blank Form to customize it to our liking.

    Next, give your form a name, then click Create.

    The plugin will take you to Formidable's drag-and-drop form builder, where you can add any form elements. Name, email, number, address — you name it, it’s here.

    Formidable's drag and drop form builder

    Since we already created our form fields in ACF, we just have to add matching fields to make it easy to connect them.

    Example Bird-Watching Form

    We added a field at the top so users can name their blog posts to make them unique!

    Once you’ve finished creating your form, click Update to save your changes. 

    Nothing reminds you of the 90s more than losing everything you created because you didn’t save.

    Step 3: Map your fields

    Now that we’ve created our form, we need to enable ACF field mapping. 

    So, click the Settings tab at the top of the page, and go to Actions & Notifications.

    Next, choose the Create Post action to customize how the form fields will display.

    Click the Create Post form action

    In the Create Post form action, scroll down to the Custom Fields section and click the Map form fields to Advanced Custom Fields toggle.

    Toggle on ACF form functionality

    Choose your ACF field group from the dropdown, and begin mapping your custom fields with the Formidable fields by clicking Add.

    Map your ACF fields to your Formidable fields

    Also, if you use a repeater field, you’ll have to match the repeaters correctly and the sub-fields.

    Once you’ve mapped your fields, click Update to save your changes.

    And that's it! Users can now submit their entries to your WordPress ACF frontend form, and your ACF and Formidable Forms fields will map and send the information.

    From here, you can display the information on the frontend with a View or use a theme that supports ACF, then edit the post, post title, content, and more!

    What else can this ACF frontend form plugin do?

    Formidable Forms banner

    Formidable may seem like a simple form builder for ACF, but it’s much more than that.

    With dozens of ACF form functions, template files, and compatibility with all the top themes (including Elementor), Formidable does it all.

    And it’s got plenty of additional features and options to supercharge your form:

    • Multi-step forms, quizzes, and conversational forms
    • Multiple spam protection options
    • Built-in Visual Form Styler
    • 100+ form templates
    • Formidable Views

    These are just a few of the features you get. And they’re pretty great if we do say so ourselves.

    So, with how easy it is to put an ACF form on the frontend and the wealth of features you get, what are you waiting for?

    Formidable is ready to take your website up a notch today.

    Ready to make your ACF front form?

    If you were wondering, “How do I add an ACF field to the frontend?” You’ve now got your answer.

    With Formidable’s simple no-code solution, you can get up and running in minutes. And this post showed you exactly how to do it.

    Whether you use WordPress ACF pro or the free version, Formidable is the perfect partner plugin.

    So, if you’re ready to start, grab Formidable Forms now and get it on your website. Or, maybe you're wondering how you would update an ACF field from the frontend? In that case, we have the perfect ACF update guide for you!

     Get ACF front end forms now!

    And follow us on Facebook, Twitter, and YouTube for more incredible WordPress tips & tricks.

    Read more about WordPress forms!

    • How to Use a WordPress Contact Form to Redirect after Submit How to Use a WordPress Contact Form to Redirect After Submit
      Read More
      Formidable Anniversary 2023 Formidable Anniversary 2023: 13 Features for 13 Years!
      Read More
      How to Link to a WordPress Form How to Link to a WordPress Form [4 Different Ways!]
      Read More

    Using WordPress and want to get Formidable Forms for free?

    Get Formidable Forms Lite Now

    This article may contain affiliate links. Once in a while, we earn commissions from those links. But we only recommend products we like, with or without commissions.

    Leave a Reply Cancel reply

    Your email address will not be published. Required fields are marked *

    Get Email Updates

    Popular Resources

      • How to Create a Searchable Database on a WordPress Site
      • Create a WordPress Custom Calculator: Easy, Powerful Results
      • How to Create a Fitness Tracker in WordPress
      • Formidable Views: The Best WordPress Custom Application Plugin
      • How To Require Email To Download Files in WordPress
      • How to Create Conditional Drop Down Lists in WordPress Forms
      • The Best Gravity Forms Alternative: Formidable Forms vs Gravity Forms
      • How to Make a Quiz in WordPress
      • WPForms Alternative: Formidable Forms vs. WPForms Compared

    Take on bigger projects Right Now

    Get the tools you need to revolutionize your workflow and architect a masterpiece. Build the most advanced WordPress forms and actually use the data you collect in meaningful ways.

    Get the most advanced WordPress form plugin and the only form builder with integrated Views.

    Get Formidable Forms Now

    Resources

    • Community
    • Affiliates
    • Contact
    • Free Online Form Builder

    Top Features

    • Application Builder
    • Calculator Forms
    • Surveys & Polls
    • Quiz Maker
    • Form Templates
    • Application Templates
    • Directories
    • Donation Plugin

    Company

    • About Us
    • Giving Back
    • Careers
    • Newsletter
    • WP Tasty
    • Nutrifox

    Copyright © 2023 Strategy11, LLC. Formidable Forms® is a registered trademark Strategy11, LLC.
    Privacy Policy | Terms of Service | Sitemap

    Join 300,000+ using Formidable Forms to create form-focused solutions fast. Get Started See User Reviews