Tab open by default on Impulse Theme

[HelenVAC]

UPDATE: SOLUTION FOUND! Thanks to everyone who responded so fast 🙂

Hello! Would love some help with coding, please.

How do I make the first tab open by default on my product page? My website theme is Impulse. I'm not confident with which code to edit - please help!

[BSSCommerce-B2B · Accepted solution]

@HelenVAC,
Step 1: Go to Admin -> Online store -> Theme > Edit code

Step 2: Search for the file theme.liquid

Step 3: Add this code before </body> tag

<script>
document.addEventListener("DOMContentLoaded", (event) => {
  const firstTab = document.querySelector(".product-block--tab .collapsibles-wrapper:first-child > button");
  if (firstTab) {
    firstTab.click()
  }
});
</script>

If it helps you, please like and mark it as the solution.

Best Regards 😊

[HelenVAC]

ah you're the best! Thanks for responding so quickly - this worked a treat 🙂

[Moeed]

Hey @HelenVAC 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<script>
document.addEventListener("DOMContentLoaded", function() {
  var firstCollapsibleButton = document.querySelector('.collapsible-trigger');
  var firstCollapsibleContent = document.querySelector('.collapsible-content');

  if (firstCollapsibleButton && firstCollapsibleContent) {
    firstCollapsibleButton.setAttribute('aria-expanded', 'true');
    firstCollapsibleContent.style.height = 'auto';
  }
});
</script>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed