How to: Create an Accordion Using Advanced Custom Fields Pro Repeater Field and Bootstrap

11th October 2018

A bit niche, but may be a useful snippet of code for some. First I’ve setup a repeater field in ACF Pro, and called it ‘accordion’. The sub fields are ‘title’ and ‘content’. The title sub field is going to label the accordion button that controls the toggle, the content sub field is what drops out. Then in the page template within my theme, I’m adding this code:

Of course, this relies on you already having called the Bootstrap stylesheet and other dependencies, but I’m guessing you won’t be looking at this unless you’re already working with it.

Jo was completely fantastic! I’d been struggling to make a WordPress blog deisgn work and was completely stumped. I made an enquiry to Jo about some help, and she replied within 24 hours. It was easy to agree on a price for the things that needed to be done, and she had fixed everything within 48 hours of the original enquiry. I had thought my problem was too small for someone to help with it, but I was pleasantly surprised that Jo was happy to sort out the small issues with my site for an extremely reasonable fee. Throughout the process, Jo was efficient, effective and stayed in regular communication. She answered all of my questions, even the really idiotic ones, and nothing was too much trouble. The entire experience was great and I would recommend her in a heartbeat to anyone who needs help with a website project – big or small. She is, in short, superb at what she does.

Imogen Goold