Components
Dynamic accordion

Dynamic accordion

Published
July 23, 2024
Category

Dynamic accordion - Posts

The Slider Framework is a wrapper code for the Breakdance Builder that allows users to easily create and customize responsive sliders using the Swiper.js library. It integrates seamlessly, offering extensive options for layout, navigation, and effects, event for making highly customizable slider creation simple and flexible even for non-developers. For developers we are providing code […]

An a11y-friendly Dynamic Tabs component is designed to be accessible and responsive, offering a seamless user experience across devices. It adapts to different screen sizes by transforming traditional tabs into a dropdown menu or accordion on smaller screens. This component ensures keyboard accessibility, proper ARIA roles and attributes, and focus management, making it easy to […]

Whiskey template is being shipped as a whole “site” via Updraft plugin. Getting Started You always need to start with a fresh install of WordPress. As a first step, install plugin UpdraftPlus: WP Backup & Migration Plugin and activate it. Then go and download files from Whiskey template – you should be able to see […]

There are two variations Dynamic Lightbox component: Configuration Dynamic data Configuration for dynamic data is the same as pulling any post within Breakdance. We’ll have Post loop element inside page or template and adjust query to our needs. Global code block In modal code you will find div named Global code block. You’ll need to […]

The renderer is stuck in an inifite loop, because…’post’ with ID 5581 renders ‘post’ 5983 (edit)’post’ with ID 5983 renders ‘post’ 5983 (edit)And so on… a ‘post’ could be a Breakdance template, global block, WP post, page, or any other content

Dynamic accordion - Repeater

Sometimes it’s nice to put in text just to get an idea of how text will fill in a space on your website.
There are other placeholder text alternatives like Hipster Ipsum, Zombie Ipsum, Bacon Ipsum, and many more. While often hilarious, these placeholder passages can also lead to much of the same confusion.
This is just placeholder text. Don’t be alarmed, this is just here to fill up space since your finalized copy isn’t ready yet. Once we have your content finalized, we’ll replace this placeholder text with your real content.

Overview

With dynamic accordion you can easily fetch dynamic data from posts or repeater field (ACF or Metabox). It comes with few predefined attributes so you can control its behavior. These attributes can be found on the Post Loop Builder or Repeater element under Advanced > Attributes:

Attributes

  1. hs-expand-first - set this to true or false, if you want first accordion item to be opened / closed.
  2. hs-expand-all - set this to true or false, if you want all accordion item to be opened / closed. This option will override hs-expand-first.
  3. hs-close-siblings - set this to true, if you want to close other siblings when opening one item.
  4. hs-header-scroll - set a maximum viewport where it will apply scroll to header when accordion header is being clicked (handy when you have long content and scrolling on mobile). If you want it 767px and below, just type 767. If you want to disable it => set it to false.
  5. hs-faq-schema - by default this option is false. Set this to true if you want to enable FAQ Schema.

You might also like

Headspin Logo
1.2.3
Built with
Breakdance
and
Headspinui
@ 2024 HeadspinUI. All rights reserved.