Aleš Sýkora / November 28, 2023 / 0 comments

Set Tabs to closed on page load in Oxygen Builder

Post summary: If you want to bypass the default state of tabs in Oxygen which is – first tab opened by default, then you need to use some jQuery. Don’t forget to change the .class-of-your-tabs-element and oxy-tabs-active-tab-class to your classes. You will find them with site inspector in browser.

If you want to bypass the default state of tabs in Oxygen which is – first tab opened by default, then you need to use some jQuery.

  1. load tabs element to the variable let OxyTabs.
  2. remove active class from all children elements (tabs)
  3. add hidden class to the first tab content
jQuery(document).ready(function($) {
    let OxyTabs = $('.class-of-your-tabs-element');  
   	OxyTabs.children('.oxy-tab').first().removeClass(OxyTabs.data('oxy-tabs-active-tab-class'));
	OxyTabs.next('.oxy-tabs-contents').children('.oxy-tab-content').first().addClass('oxy-tabs-contents-content-hidden');
});

Don’t forget to change the .class-of-your-tabs-element and oxy-tabs-active-tab-class to your classes. You will find them with site inspector in browser.

Fuel my passion for writing with a beer🍺

Your support not only makes me drunk but also greatly motivates me to continue creating content that helps. Cheers to more discoveries and shared success. 🍻

0 comments

Share Your Thoughts