Multiple active toggles

marinos13Mar 16, 2021

Hello,

I implemented multiple toggles on my page but I want the to be open/active in order for their contents to be showing without having to collapse them first. I tried adding the toggle-active class but it didn't work. Is there a way to do it?

Here is my code:

<div class="toggle toggle-border">
  <div class="toggle-header">
    <div class="toggle-icon">
      <i class="toggle-closed icon-line-plus"></i>
      <i class="toggle-open icon-line-minus"></i>
    </div>
    <div class="toggle-title">title</div>
  </div>
  <div class="toggle-content" style="padding:0;">
    <div class="list-group-item list-group-item-action flex-column align-items-start">
      <div class="d-flex w-100 justify-content-between">
        <div>
          <h4 class="mb-2">text</h4>
          <small>text</small>
        </div>
        <a class="button button-medium button-rounded" href="book.php">
          <small style="width: 100%;display: block;text-align: center;">some text</small>
        </a>
      </div>
    </div>
  </div>
</div>

<div class="toggle toggle-border">
  <div class="toggle-header">
    <div class="toggle-icon">
      <i class="toggle-closed icon-line-plus"></i>
      <i class="toggle-open icon-line-minus"></i>
    </div>
    <div class="toggle-title">title</div>
  </div>
  <div class="toggle-content" style="padding:0;">
    <div class="list-group-item list-group-item-action flex-column align-items-start">
      <div class="d-flex w-100 justify-content-between">
        <div>
          <h4 class="mb-2">text</h4>
          <small>text</small>
        </div>
        <a class="button button-medium button-rounded" href="book.php">
          <small style="width: 100%;display: block;text-align: center;">some text</small>
        </a>
      </div>
    </div>
  </div>
</div>

SemiColonWebSTAFFMar 17, 2021

Hello,

You can simply add the data-state="open" Attribute to the .toggle Element. More Documentations can be found here: http://docs.semicolonweb.com/docs/shortcodes/toggles/ .

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

marinos13Mar 17, 2021

Thank you! it works perfectly!