Webflow Accordion Toggle Script

Enhance your Webflow projects with interactive accordion functionality. This script is designed to work seamlessly with Webflow, allowing for easy integration and customization.

Features

• Open Specific Toggle: Choose a specific accordion item to be open on initial load.
• Close Others: Option to close other items when a new item is opened.
• Open All Toggles: Set all accordion items to be open by default.
• Error Handling: Robust error checks for configuration issues.

Installation

Include the script in your Webflow project:

<!-- Accordion Toggle by Delta Clan -->
<script
  defer
  src="https://cdn.jsdelivr.net/npm/@deltaclan/attributes-accordiontoggle@1/dist/accordiontoggle.js"
></script>

Usage

1. Set Accordion Attributes:

   • Use dc-accordion="list" to denote an accordion container.
   • Assign dc-accordion-toggle="CLASS-NAME" where CLASS-NAME is the class of your toggle elements.

2. Optional Attributes:

   • dc-accordion-default="NUMBER": Open a specific item by default (1-indexed).
   • dc-accordion-close="false": Keep multiple items open at once.
   • dc-accordion-open-all="true": Open all items by default.

Compatibility

Designed for Webflow. Ensure you have set up your toggle elements and content within Webflow accordingly.

License

This script is copyrighted by Delta Clan. All rights reserved.