Closing the toggleable
Custom Attributes you can control all toggleable elements using Custom Attribute
data-x-toggle-close=1 on another element. This can be useful if you have an element inside the element that needs to close the element as well as do something else. Internally the close button uses this.
Opening the Toggleable
First off the attribute you need is
data-x-toggle. This tells the toggleable library to treat this as an open request. There are different types of opening in our theme.
data-x-toggle=1default and direct open. Most of the time this is all you need.
data-x-toggle=collapsedefault same as 1.
data-x-toggle=layeredsame as 1, but opens inner toggles and has layer effects. Disabling scroll is a layer effect.
data-x-toggle=collapse-bFor use in X / Pro built in headers for collapsing.
data-x-toggle=tabIf trying to open a specific tab
The next you need is the ID of the toggleable you are trying to open. This can be set as well from a custom attribute. Internally this is the Style ID plus the Element ID (EX
e356-e9). So in your custom element you would place something like
We offer a couple of functions to control the state of a toggleable.
Hiding the default mobile menu by nav touch
See something inaccurate? Let us know