Elementor Customisation
How to Keep All Accordion Sections Expanded in Elementor by Default
Share
How to Keep All Accordion Sections Expanded in Elementor by Default
If you’ve used Elementor’s Accordion widget, you’ve probably noticed there’s only one option to have the first item expanded by default — and no setting to open all items when the page loads.
This can be frustrating if you want visitors to see all your content without clicking each section. Luckily, with a small JavaScript snippet, you can make every accordion item expanded by default.
The Problem
By default, Elementor allows:
All accordion items collapsed.
Only one accordion item open at a time.
Or first item open by default.
But what if you want all of them open at once?
The Solution
You can use a little JavaScript code to force all Elementor accordion panels to open automatically when the page loads.
Step-by-Step Guide
Step 1: Go to WordPress Dashboard → Elementor → Custom Code.
Step 2: Click Add New and choose Footer as the location.
Step 3: Paste the following code:
document.addEventListener("DOMContentLoaded", function() {
document.querySelectorAll(".e-n-accordion-item").forEach(function(item) {
item.setAttribute("open", true);
item.querySelector("summary").setAttribute("aria-expanded", "true");
});
});
Step 4: Click Publish and clear your cache.
Step 5: Refresh your page — now all accordion sections should be open by default.
Why This Works
Elementor’s accordion items are built with HTML <details> and <summary> elements.
By adding the open attribute to each accordion item, we’re telling the browser to display the content immediately instead of waiting for a click.
Extra Tips
If you want the sections to stay open and prevent closing, you can disable clicks with a small CSS tweak.
Works with both classic and nested Elementor Accordions.
Always clear cache after making changes.
đź’ˇ Final Thought:
This is a simple but effective tweak for Elementor users who want to improve readability and reduce clicks for visitors. Whether you’re building a services list, FAQs, or product details, keeping all accordion sections expanded can make your content easier to browse.
