Add this html code to trigger open accordion… or tab! See CWIO site for accordion

				
					<script>
/* Control the Elementor Tabs from the URL
* Code from https://element.how/elementor-open-specific-tab-toggle-accordion/
* Copyright 2023 Element.how
* Updated 2023/12/05
*/
window.addEventListener('load', () => {
setTimeout(function () {

let scrollOffset = 100; /* scroll offset from the top of title */

const tabsAccordionToggleTitles = document.querySelectorAll('.e-n-accordion-item-title, .e-n-tab-title, .elementor-tab-title');

const clickTitleWithAnchor = (anchor) => {
tabsAccordionToggleTitles.forEach(title => {
if (title.querySelector(`#${anchor}`) != null || title.id === anchor || (title.closest('details') && title.closest('details').id === anchor)) {
if (title.getAttribute('aria-expanded') !== 'true' && !title.classList.contains('elementor-active')) title.click();
let timing = 0;
let scrollTarget = title;
if (getComputedStyle(title.closest('.elementor-element')).getPropertyValue('--n-tabs-direction') == 'row') scrollTarget = title.closest('.elementor-element');
if (title.closest('.e-n-accordion, .elementor-accordion-item, .elementor-toggle-item')) {
timing = 400;
}
setTimeout(function () {
jQuery('html, body').animate({
scrollTop: jQuery(scrollTarget).offset().top - scrollOffset,
}, 'slow');
}, timing);
}
});
};

document.addEventListener('click', (event) => {
if (event.target.closest('a') && event.target.closest('a').href.includes('#')) {
const anchor = extractAnchor(event.target.closest('a').href);
if (anchor && isAnchorInTitles(anchor, tabsAccordionToggleTitles)) {
event.preventDefault();
clickTitleWithAnchor(anchor);
}
}
});

const currentAnchor = extractAnchor(window.location.href);
if (currentAnchor) {
clickTitleWithAnchor(currentAnchor);
}

function extractAnchor(url) {
const match = url.match(/#([^?]+)/);
return match ? match[1] : null;
};

function isAnchorInTitles(anchor, titles) {
return Array.from(titles).some(title => {
return title.querySelector(`#${anchor}`) !== null || title.id === anchor || (title.closest('details') && title.closest('details').id === anchor);
});
};

}, 300);
});
</script>

				
			
Old Accordions: Load Closed

Add this HTML right above the accordion:

				
					<style class="accordion-closed-on-load">
body:not(.elementor-editor-active) .elementor-widget-accordion .elementor-tab-content {
display: none!important;
}
</style>
<script>
window.addEventListener('load', function() {
setTimeout(function(){
document.querySelector('.accordion-closed-on-load').remove();
let accordionsElems = document.querySelectorAll('.elementor-widget-accordion')
accordionsElems.forEach(e => {
let activeTitle = e.querySelector('.elementor-tab-title.elementor-active');
let activeContent = e.querySelector('.elementor-tab-content.elementor-active')
jQuery(activeContent).hide();
activeTitle.classList.remove('elementor-active');
activeContent.classList.remove('elementor-active');
activeContent.setAttribute('hidden','hidden');
activeTitle.setAttribute('aria-expanded',false);
activeTitle.setAttribute('aria-selected',false);
activeTitle.setAttribute('tabindex',-1);
});
},100);
});
</script>
				
			
Skip to content