Documentation

Display Accordion Items from ACF Repeater

Follow these steps to display accordion items from an ACF Repeater field using the Dynamic Accordion widget:

  1. Make sure the Advanced Custom Fields Pro plugin is installed and activated.
  2. Create or edit an ACF Field Group.
  3. Add a Repeater field. This will be the parent field used by the accordion.
  4. Inside the repeater, add at least one text-based sub field for the accordion title, for example question or title.
  5. Add one or more sub fields for the accordion content, such as text, textarea, wysiwyg, or image, depending on what you want to show in each item.
  6. Assign the ACF Field Group to the post type, page, term, or options page where the accordion data should come from.
  7. Open the post, page, term, or options page that has this field group and add repeater rows with your accordion content.
  8. Edit the page with Elementor where you want to show the accordion.
  9. Drag the Dynamic Accordion widget into the page.
  10. In the widget General section, set Source to ACF Repeater.
  11. Select your parent repeater in ACF Repeater Field.
  12. Choose the correct Field Location so the widget reads data from the right place:
  13. Use Current Post when the repeater is saved on the page or post being viewed.
  14. Use Current Term when the repeater is attached to a taxonomy term archive.
  15. Use Options Page when the repeater is saved in ACF Options.
  16. In the Items section, choose the sub field to use for ACF Repeater Sub field - Title.
  17. In Content Fields, add one repeater item for each sub field you want to display inside the accordion body.
  18. For each Content Fields item, select the ACF sub field in ACF Repeater Sub Field.
  19. Choose the matching Field Type such as Text, Textarea, WYSIWYG, or Image.
  20. Optionally set the HTML Tag and link settings for each content field item.
  21. Style the accordion as needed in the widget Style tab.
  22. Save or publish the page and preview it on the frontend.

Important notes:

  • The widget will not output repeater items until both the parent repeater field and the title sub field are selected.
  • If no repeater rows are added in ACF, the accordion will stay empty.
  • The accordion body can display multiple ACF sub fields per row, because Content Fields lets you stack several sub field outputs inside each accordion item.

Not the solution you are looking for?

Please check other articles or open a support ticket.