How to add Advanced Custom Fields (ACF) to a frontend form?

Parth Shah
Techcompose
Published in
2 min readOct 3, 2018

Advanced Custom Fields is a WordPress plugin which allows you to add extra content fields to your WordPress edit screens. ACF provides custom fields in the backend to your WordPress posts, pages, and custom post types, but if you want those ACF fields into front-end forms you have to use filters provided with ACF plugin. Here we will use acf_form() for display form and acf/save_post for saving ACF fields.

So, here are the steps that how to add your ACF fields into your front-end forms that add posts from the front-end.

Step 1: Add ACF Fields into form:

Use below code into your theme template file where your form is placed. Here is some necessary argument passed in an array for acf_form(), you can use arguments as per need which is listed in below table.

Here is the table that describes all arguments to the acf_form() where you want the form to appear.

Step 2: After adding form, We have to save those value to backend posts. So ACF provides filter acf/pre_save_post to save custom fields. Below is code snippet that places into theme’s functions.php

That’s it, now your form is ready and you can post your posts from frontend with ACF fields.

WordPress is the most used platform to create new websites, Any Customization is possible either by using available plugins or by adding code to achieve a particular functionality. You will receive a fully functional, error-free, amazing design, website if you choose Top WordPress Development Company for your website development requirement. Contact us to discuss your project or to Hire Dedicated WordPress Developer you can reach us at inquiry@techcompose.com

--

--