Advanced Accordion Gutenberg Block is a custom native Gutenberg Block that allows you to build a
FAQs Section or
Accordion easily on your site post and page using
Gutenberg Editor.
Video Overview
[youtube
https://www.youtube.com/watch?v=UQDLpqro9yU]
🔗 USEFUL LINKS
Key Features
- Custom Minimal Design: Experience a sleek, modern interface designed to enhance user engagement with a clean and minimalistic look.
- Super Fast: Lightweight, and Optimized: Ensure quick loading times and smooth performance with a highly optimized, lightweight build.
- Linked Accordion: Seamlessly connect accordion items for interconnected content, providing a streamlined user experience.
- Built with Gutenberg Native Components: Enjoy full integration with Gutenberg, ensuring compatibility and ease of use with WordPress's native block editor.
- Unlimited Nested Accordion: Create complex, multi-level accordions effortlessly, allowing for detailed and organized content structures.
- Unlimited Styling Options: Customize your accordion with extensive styling options, including margin, padding, border radius, color, background, and tag selection.
- Highly Customizable: Benefit from extensive customization possibilities, offering flexibility to suit any design requirement.
- All Content Types Supported: Insert any type of content, including text, images, videos, and more, within the accordion body for versatility.
- Custom Color Palette: Personalize your accordion's appearance by selecting from a customizable color palette, aligning with your brand's aesthetics.
- Active Accordion on Page Load: Automatically expand the desired section when the page loads, ensuring immediate visibility of important content.
- Responsive and SEO Friendly: Maintain a seamless user experience across devices with a responsive design, while also optimizing your content for search engines.
- Unlimited FAQs: Create and manage as many FAQs as needed, ensuring all user queries are addressed comprehensively.
- Infinite Reusability: Reuse accordion items across different pages, making content management more efficient and consistent.
- Pattern Design: Pre-built stylish accordion patterns to enhance your layout instantly, with exclusive premium designs available in the Pro version.
- Keyboard Accessibility: Navigate and interact with accordions using keyboard keys—Tab, Shift+Tab, and Enter/Space—for a smoother and more accessible user experience.
- Horizontal Accordion block: Display accordions side by side with support for titles, subtitles, icons, and all inner blocks—perfect for creating dynamic, content-rich layouts.
- Global Style Settings: Easily manage and apply global styles to all your accordions from a single toolbar setting.
PRO Features
- Instant Search: Enable a search bar to help users find specific FAQs quickly. It's useful when you have a long list of FAQs.
- QA (Question and Answer) Style: Display FAQs in a structured question-and-answer format for easy readability and user engagement.
- Voting Feedback: Add feedback voting buttons to each FAQ item. From the total vote count, you can understand how helpful an accordion is.
- Anchor Link: Generate unique links for each FAQ item. It's handy for directing users to specific FAQs from external sources or within the same page.
- Open All / Close All: A functionality that lets users expand or collapse all accordion items simultaneously. It provides convenience, especially when users want to view or hide all FAQ items at once.
- Read More button: Expand the accordion content beyond a certain character limit or line count, displaying a "Read More" button or link to reveal the entire content.
- Activator Event: Choose the event type to activate the accordion. You can choose from Click and Hover.
- Steps Layout: Sequentially open accordions, marking previously opened ones as checked, guiding users through a step-by-step process.
- Checklist Layout: Convert accordions into a checklist format, allowing users to tick off completed items, ensuring thorough task management.
- Featured Icon: Integrate custom icons/images into your accordion title to represent different types of themes visually. This enhances user experience and helps quickly differentiate content.
- Subheading support: Add unique subheadings to each accordion section for better content organization. This improves user navigation, making it easy for visitors to find and engage with specific information.
- Custom CSS Field: With full custom CSS support, you can tailor your accordion’s colors, fonts, and animations to seamlessly align with your website’s style.
- Filter Tab by Category: Easily filter and view specific content within your accordion sections. Set custom tags in the parent accordion, and watch the magic happen with dynamic filtering for a more organized and user-friendly experience.
- Show More Button: Enhance user experience by enabling the "Show More" button in Group Accordion. Control how many items are displayed per click, keeping content organized and accessible.
- Labelling Option: User can add custom text label beside the Single accordion title, making it easier to highlight key information and categorize content effectively.
- Autoplay Functionality: Enable automatic section switching in Group Accordion blocks. Accordions will rotate between sections without user clicks, improving engagement and saving time.
- Feature Image Support: Add a custom image to each Group Accordion block for a more visually appealing and easily recognizable layout.
- Auto-Numbering with Color Support: Automatically number accordion items with customizable colors, giving your content a cleaner and more organized appearance.
See All Features.
Creating an Accordion FAQ with Advanced Accordion
[youtube
https://www.youtube.com/watch?v=K40z8KxojxE]
It's really easy and super simple to install
Quick Edit plugin.
Automatic Installation
- Go to
Plugins > Add New
screen in WordPress.
- Search for
Advanced Accordion Block
.
- Install and activate the plugin, that's it.
Manual Installation
- Download Advanced Accordion Block.
- Extract the
advanced-accordion-block.zip
file. You'll get plugin files inside Advanced Accordion Block
directory.
- Upload the plugin files to the
/wp-content/plugins/advanced-accordion-block
directory.
- Activate the plugin through the 'Plugins' screen in WordPress.
5.1.0 (14 August 2025)
Fixed: Editor slow performance issue
Fixed: Accordion style options spacing control issue (Margin & Padding)
Tweaked: Replaced inline styles with class-based styling
Updated: Accordion block Patterns
Updated: Freemius SDK to version 2.12.1
5.0.4 (05 June 2025)
New: Added Global Style settings (Set a global design for all accordions from one place. Just click the AAB icon in the editor toolbar to style them all at once)
Updated: Freemius SDK updated to 2.12.0
5.0.3 (26 April 2025)
Fixed: Vulnerability issues resolved
5.0.2 (25 April 2025)
New: Introduced Horizontal Accordion Block – Easily create side-by-side accordions with support for titles, subtitles, icons, and full inner block customization
Fixed: Vulnerability issues resolved
Fixed: Resolved the enter/space key issue in nested accordions
Tweaked: Improve keyboard accessibility (ArrowUp/ArrowLeft → Moves to the previous accordion, ArrowDown/ArrowRight → Moves to the next accordion)
Tweaked: Keeping the scroll position at the same place while an accordion expands/collapses
5.0.1 (11 April 2025)
New: Keyboard Accessibility for Better Navigation (Tab Key → Moves focus to the next accordion, Shift + Tab → Moves focus to the previous accordion, Space/Enter Key → Expands the focused accordion)
Tweaked: Hide global labels color if no accordion has labels enabled
5.0.0 (12 March 2025)
New: language file added
New: Added a default background color in every single accordion title
Tweaked: Reorganized controls & structure
Tweaked: Improved default accordion design
Tweaked: Improved custom colorpicker
Tweaked: lib folder name renamed to assets to organize all CSS and JS files in a single folder
4.8.2 (12 February 2025)
New: Nested Accordion Support (Now, you can use an accordion within another accordion, allowing for better content structuring and organization)
New: Accordion Usage Table Dashboard added on admin panel (Now, you can see where your accordions are used in pages or posts and track how many times a specific accordion appears on a single page/post)
New: Added Custom Recovery Button On top toolbar that recovers all recovery block in a single click (If you see the attempt recovery notice, you'll find a button on the top toolbar. Clicking it will dismiss all recovery notices instantly)
New: Added Pattern Design (We've added pre-designed patterns to make your accordions look more stylish and visually appealing with just a few clicks)
Tweaked: Improved the color picker (We've made the color picker more intuitive and compact, simplifying the design for a smoother user experience)
Updated: Freemius SDK to 2.11.0
4.8.1 (18 January 2025)
New: You can now set a unique ID in the Group/Separate accordion block
Fixed: HTML anchor issue
Fixed: Translatable accordion title (previously it was not translatable with the WPML plugin)
Tweaked: Removed the 'Active accordion border' option from "Q/A" style
Tweaked: Now you can set separate IDs in every accordion
4.8.0 (03 January 2025)
Fixed: Icon change option of group accordion
Tweaked: Focus border color removed from Separate Accordion block
Tweaked: Added padding support in accordion body (Previously, padding support was only available for the header. Now, it has been added to both the header and body)
Tweaked: Moved the styling options to parent in the Group Accordion
Tweaked: Adding some padding in the content are of every single accordion
Tweaked: Deprecated function updated
Updated: Freemius SDK to 2.10.1