An accordion is a toggle-based layout element that hides and reveals content when clicked. You see a heading, click it, and the rest of the content slides down. Click it again, and it hides. It’s like a dropdown but for content instead of menus.
Now, what happens if you implement accordions correctly? Your content becomes easier to explore, users stay focused, mobile navigation improves, and search engines may reward you with better visibility. If you do everything right, they will work like a table of contents that answers questions before users even ask.
This guide will show you how to implement accordions in WordPress using editor-friendly tools that keep the process simple and clean, without any need for coding.
Add Accordions in WordPress
There’s more than one way to add accordions in WordPress, but not all of them are easy to use inside the Block Editor. In the next sections, we’ll start with a basic method using a built-in block, then move on to a more flexible option with a plugin.
Method 1: Using the Native Details Block
The easiest way to create an accordion in WordPress is by using the built-in Details block. Let’s see how it works.
Step 1: Add the Details Block
Open your post or page in the Block Editor. Click the plus (+) icon, search for Details, and insert the block.
Step 2: Add the Title and Content
Enter your accordion title in the “Write summary” placeholder. Then, click the arrow icon next to it to expand the section. Once expanded, a content area will appear below where you can add text, images, lists, or any other blocks.
Step 3: Add Additional Toggles
To add more accordion items, repeat the same process by inserting new Details blocks. For a nested layout, expand the content area of an existing Details block, click the plus (+) icon inside it, and add another Details block.
This method is perfect for quick FAQs or minimal setups. Just keep in mind, it offers basic styling only and doesn’t include advanced design options.
Method 2: Using the Ultimate Blocks Plugin
If you want more styling options and better control over your accordion, the Ultimate Blocks plugin is a great choice. It offers a Content Toggle block that works perfectly in the Block Editor.
Step 1: Add the Plugin to Your Site
From your WordPress dashboard, head to the Plugins menu and click on Add New. In the search bar, type Ultimate Blocks, then click Install Now on the plugin card. Once the installation finishes, activate it to make the new blocks available in the editor.
Step 2: Insert the Content Toggle Block
Open the page or post where you want the accordion. Click the plus (+) icon, search for Content Toggle, and add it. This block creates an expandable section with a title and content area.
Step 3: Add Title and Content
Type your accordion title in the label field, then add your content below. You can include any type of block inside the toggle, such as text, images, buttons, lists, or even another Content Toggle block inside the content area to create a nested accordion.
To add more toggle sections, simply click on the (+) icon when you hover over the existing panels. To remove a panel, do the same except that instead of clicking the (+) icon, you choose the (x) icon from the top right corner.
Step 4: Customize the Accordion
From the block settings panel on the right, you can control the panel title, adjust the toggle state, enable FAQ Schema, add a built-in search option for your accordion, choose a status icon, change text or background colors, and much more.
If you’re using it for FAQs, you can also enable FAQ Schema markup from the settings to help your content qualify for rich snippets in Google search.
Conclusion
If your goal is to make long content easier to scan, accordions deliver a clean solution. You learned two approaches: the native Details block offers a lightweight setup with no extra plugins and fast loading. The Content Toggle block from Ultimate Blocks adds advanced styling controls, nested panels, and built-in FAQ schema. Both methods enhance mobile usability engagement and SEO potential. Choose the approach that best fits your workflow and content needs.
