Set Elementor Accordion Closed by Default along. The first item of the accordion is set to open and Elementor offers no default setting to make it closed. For some users, it is a bit annoying as the main purpose of adding accordion is to hide information and requires user to display the information.

1. Create a Duplicate Accordion Item to Make Elementor Accordion Closed by Default (Using CSS Code)

• Step 1: Duplicate the very first accordion item
• Step 2: Copy of the below-provided CSS code
• Step 3: Navigate to the advanced settings of the accordion widget & paste of the above CSS codes inside the Custom CSS option.

.elementor-accordion .elementor-accordion-item:first-of-type {
display: none;}
.elementor-accordion {
border-top: 1px solid;
}

Once you’re done adding the CSS code, Update the page & see the magic. The very first accordion item will be hidden.

2. An Widget that helps you Keep Elementor Accordion Closed by Default.
You can use the following JavaScript to do so.

• Step 1: Copy the below-provided Javascript code…
• Step 2: Just above your accordion widget, place an “HTML Widget” from the elements panel & paste the above-provided Javascript code inside the HTML Code.

<script>
jQuery(document).ready(function($) {
var delay = 100; setTimeout(function() {
$(‘.elementor-tab-title’).removeClass(‘elementor-active’);
$(‘.elementor-tab-content’).css(‘display’, ‘none’); }, delay);
});
</script>

www.kuldeeprathore.com