1st Jul '22
/
6 comments

Dynamic Accordion in WordPress using Meta Box and Alpine.js

This Pro tutorial provides the steps to implement an accordion using Alpine.js in WordPress that pulls the values of sub fields of a Meta Box group for a dynamic FAQ accordion.

Step 1

Install Meta Box and Meta Box AIO plugins.

Create a new field group having a group-type of field with two sub fields or import this.

In this example, faq group field having question text-type sub field and answer wysiwyg-type field.

Set the field group to appear on your desired post type, in this example: page.

Step 2

Edit your Page(s) and populate the field group.

Step 3

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 633 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Auto-Scroll to the New Open Accordion Item

Auto-Scroll to the New Open Accordion Item

How we can make sure the scroll position is always synced with the accordion when opened.
Categories:
Tags:
Pro
Accordion Grid Query Loop in Bricks

Accordion Grid Query Loop in Bricks

How to set up a accordion in Bricks such that the "titles" are arranged in a grid with the full width content opening below.
Categories:
Pro
Dynamic Source for Video Element in Bricks Using Meta Box Post Field

Dynamic Source for Video Element in Bricks Using Meta Box Post Field

This Pro tutorial provides the steps to set the source of a Bricks video element on single CPT pages to be the URL of a…
Categories:
Pro
Meta Box Settings Fields in Bricks

Meta Box Settings Fields in Bricks

This Pro tutorial is the equivalent of our earlier ACF Options Fields in Bricks article but when using Meta Box. While retrieving the values of…
Categories:
Tags:
Pro
Dynamic Posts Side Menu with Expandable and Collapsible Accordion Submenus in WordPress

Dynamic Posts Side Menu with Expandable and Collapsible Accordion Submenus in WordPress

This Pro tutorial provides the steps to show all the posts of a specified post type as menu items with accordion functionality for submenus. This…
Categories:
Pro
Meta Box Relationship Posts Filtered by a Taxonomy Term in Bricks

Meta Box Relationship Posts Filtered by a Taxonomy Term in Bricks

Updated on 17 Feb 2025 In the Inner Circle a user asks: Hello, I have a relationship made in metabox between two Post Types “Travel”…
Categories:
Pro
Dynamic Post-specific Templates in Bricks using Meta Box/ACF Select Field

Dynamic Post-specific Templates in Bricks using Meta Box/ACF Select Field

Update on 23 Aug 2023: Added steps for ACF. Bricks builder v1.8.4 introduced an pretty useful filter called bricks/active_templates that flew under the radar. This…
Pro
Bricks Dynamic Condition – Check if today falls within 5 days before any holiday date

Bricks Dynamic Condition – Check if today falls within 5 days before any holiday date

Creating a custom condition that returns true or false depending on whether today falls within 5 days before any holiday dates selected on a Meta…
Categories:
Tags: