How to display ACF Repeater data using DataTables

This members-only tutorial provides the steps to

• add a custom field group having a `venue` repeater field with `date` and `venue` sub fields using ACF Pro
• add the PHP necessary to display the rows of data in a Code Block in the Template for single posts in the HTML structure needed by DataTables
• load DataTables on single posts and initialize it on the table

to display rows of repeater field in the frontend in an instantly searchable responsive table with pagination support in Oxygen.

By the end of this tutorial, you would have something like this:

Backend:

Frontend:

Step 1

Install and activate ACF Pro.

Go to Custom Fields > Add New.

Add a Field Group named say, "Post Meta".

Add a venue repeater-type field having date and location sub fields.

Here (mirror) is an export of the field group from my test site so you can import the entire field group in just a few clicks.

Step 2

Edit your Posts and add as many rows of venue data (date and location) as you need.

Step 3

Install and activate My Custom Functionality plugin.

Connect to your hosting account using a FTP client and navigate to site's /wp-content/plugins/my-custom-functionality-master.

Upload datatables.min.css to the plugin's assets/css directory.

Upload datatables.min.js to the plugin's assets/js directory.

Edit plugin.php and replace the content of custom_enqueue_files() function with