Support

Account

Home Forums General Issues Organize fields in acf_form()

Solving

Organize fields in acf_form()

  • Hey guys,

    I’m using acf_form(), and it’s structured like this:

      $edit_post = array(
        'post_id'            => 'user_50', // Get the post ID
        'field_groups'       => array(10), // Create post field group ID(s)
        'fields'             => array(
          //        'field_54dfc93e35ec4', // Title
          'field_573d7ef0d6321', // Date of Birth
          'field_573d7eb6d6320', // Contact Number
          'field_573d84b07da66', // Address Line 1
          'field_573d84be7da69', // Address Line 2
          'field_573d84bd7da68', // Address Line 3
          'field_573d84d67da6a', // City
          'field_573d84db7da6b', // State/Province
          'field_573d84e97da6c', // Country
          'field_574465681849a', // Post Code
        ),
        'form'               => true,
        'return'             => add_query_arg( 'details', 'updated', get_permalink() ),
        'html_before_fields' => '',
        // 'html_after_fields' => '<button class="edit-cancel" type="button">Cancel</button>',
        'submit_value'       => 'Save Changes',
      );
    
      acf_form( $edit_post );

    At the moment all the fields are clumped together which is quite untidy. Is there a way to organize the fields to make it more clean? For example, add a heading before the address fields, so that it would be more like:

          'field_573d7ef0d6321', // Date of Birth
          'field_573d7eb6d6320', // Contact Number
          'field_5744695625f8e', // ID Number
    <h2>Address</h2>
          'field_573d84b07da66', // Address Line 1
          'field_573d84be7da69', // Address Line 2
          'field_573d84bd7da68', // Address Line 3
          'field_573d84d67da6a', // City
          'field_573d84db7da6b', // State/Province
          'field_573d84e97da6c', // Country
          'field_574465681849a', // Post Code

    Thanks in advance!

  • Use the acf/render_field hook https://www.advancedcustomfields.com/resources/acf-render_field/

    
    add_action('acf/render_field/key=field_573d84b07da66', 'add_address_heading', 1, 1);
    function add_address_heading($field) {
      if (is_admin()) {
        // only on the front end
        return;
      }
      ?><h2>Address</h2><?php 
    }
    
  • Hi there John,

    Unfortunately that didn’t work. If I remove the (is_admin) check, it still doesn’t show backend either. I’m a bit stumped at the moment

  • What version of ACF are you using?

  • My mistake, you can’t do render field based on the field key. You can only do it generically for every field or for a specific field type. You need to check for the field you want to add the html to in the function.

    
    add_action('acf/render_field', 'add_address_heading', 1, 1);
    function add_address_heading($field) {
      if (is_admin()) {
        // only on the front end
        return;
      }
      if ($field['key'] == 'field_573d84b07da66') {
        ?><h2>Address</h2><?php 
      }
    }
    
  • Thanks so much, that is working correctly. Is it possible to place the H2 before the label as opposed to the input field?

  • You could try putting it after the previous field. Make the priority of the add_action > 10 and check for the other field. The possibilities are a little limited, but this is the only method that I know of to add html into the fields.

  • Thanks for the help. What I’ve ended up doing is making a Message field and then inserting that with a bit of styling. Works for now!:) Ha ha.

    Thanks again, appreciate your time!

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.