AaronRutley.com

Save ACF Repeater Field Data to the WordPress content area

Posted in WordPress on the 26th of March 2017 by @aaronrutley

Here’s a quick tutorial on how to save the data from an Advanced Custom Fields Repeater field into the standard WordPress content area.

Let’s imagine we’re working on a new website that has a “Testimonials” page and we’d like to have all of our data stored in a ACF Repeater Field, then saved to the standard WordPress content area.

Firstly, why would we want to do this ?

  • We’d like to hide the default content area and instead show an ACF Field group
  • We’d like the user interface & structured data benefits that ACF provides
  • We’d like to speed up page loading times on the front end
  • We’d like the option to deactivate ACF without effecting the front end
  • We’d like the option to switch themes and have our Testimonials still appear
  • We’d like the default WordPress search to search within our Testimonials
  • We’d like WordPress SEO plugins to analyse our Testimonials for keywords etc
  • We’d like our Testimonials to appear in the REST API / RSS feed with no extra work
  • We’d like to reduce the number of page templates within our theme

How to:

The first step would be to create a page called “Testimonials”.

The next step is to create an ACF field group for this page, we’d set the content area to be hidden then create a repeater for Testimonials.

We could setup the Repeater Field to include a textarea field for the ‘quote’ and text fields for things like the ‘client name’ and the ‘business name’.

Here’s an example, filled with Hipster Ipsum:

Next, we can create a function that runs on acf/save_post (this could go in your functions or a project specific plugin). We need this function to loop over all items in our Testimonial repeater, wrap it in the appropriate HTML and then update the page/post.

See an example of how to do this in the gist below. Note: this code will only run on if the post has an ID of 1234. However, you could easily change this to run on page template or an entire post type.

Now, when we publish or update the post, all of our Testimonial HTML will be saved to the post_content column in the database (this overwrites anything that was there previously).

We don’t need to edit any of our theme template files to see the output of the repeater field, the standard the_content() function found in almost every theme will now display all of our Testimonials.

Here’s an example of how this content could look in the ‘twentyseventeen’ default theme:

Some considerations

One disadvantage of this approach is our ‘template’ markup is mixed into our function. So if in the future we wanted to change any of the HTML or if we add a new field, we’d need to edit the function then re-save the page(s) to see the changes.

In summary

I won’t be using this approach on every project going forward however it does provide quite a few benefits and it could be very useful for particular projects!

Share this post

Menu