12% off of LTD using this coupon: TWELVEPERCENTOFF. Promo ends on 2 Dec midnight UTC.
Published on Sep 26, 2018

Custom Post Type with FAQs using ACF Pro Repeater Field and Expand Collapse Functionality

Sridhar Katakam

This members-only tutorial provides the steps to develop an Oxygen template for single pages of a "service" Custom Post Type with an attached "faq" ACF Pro Repeater field automatically appearing with expand-collapse functionality using jQuery Collapse.



Step 1

Install and activate Custom Post Type UI.

Go to CPT UI > Add/Edit Post Types.

Add service post type like so:

Click "Add Post Type" button.

Step 2

Install and activate Advanced Custom Fields Pro.

Go to Custom Fields > Tools and import this field group.

This should add a "FAQ" field group having questions_and_answers repeater field with question and answer sub fields.

Ensure that the field group is attached to the service CPT.

Step 3

Go to Services > Add New.

Add your service post type entries with Title, Content, Featured image and as many Question and Answer pairs as you want for each.

Step 4

Go to Oxygen > Templates.

Add a new template named say, "Service CPT Single".

Set it to inherit from your Main template having the site header and footer.

Apply it to Singular > Services with a priority of 1 (or more depending on how your template for sitewide single entries is setup).

Edit it with Oxygen.

Step 5

Add a Section and add your desired elements like the Post Title, Featured image and Content.

Let's loop through the questions_and_answers field and output the question and answer sub fields for each row.

Add a Code Block.

Go to Advanced > Size & Spacing and set Width to 100%.


This is a premium members-only content.

To view the rest of the content, please sign up for membership ($47/month or $599 one-time).

Already a member? Log in below or here.