On-demand Functionality: Standalone vs. Toggle-Driven Components

Each CMS Plus component is designed for a specific function. Some components work automatically, while others require interactions to trigger their function. Below are the two types of CMS Plus components.

Standalone Components

These components apply their functionality automatically, making them versatile for use in any environment. Click on any components to read more about it:

Toggle-Driven Components

Toggle-driven components must be inserted into a design component to fully leverage their functionality. These components rely on at least two variants within the design component:

Handle on-demand actions via variant transitions

The idea is simple:

  1. Insert a toggle-driven CMS Plus component into any design with at least two variants.

  2. Configure the CMS Plus component in the primary variant.

  3. In the other variant, simply override its trigger toggle control.

    Each trigger control is named after its CMS Plus component. For example, Filter+ uses the Filter control, and Clear+ uses the Clear control. Check each component's documentation for detailed guidance.

Example

Here’s a custom toggle integrated with Filter+ Option. The primary variant, Inactive, has Filter+ Option configured, while the Active variant overrides the Filter+ trigger control, Filter, to Apply. Learn how to integrate CMS Plus into your components.

Example toggle component with CMS Plus Filter+ Option showing the primary variant set to clear the filter.

↑ Inactive Variant: Configure all properties in the primary variant.

↓ Active Variant: Only override Filter to trigger the function. Overrides are identified by their purple text.

Example toggle component with CMS Plus Filter+ Option showing the "Active" variant set to apply the filter.

By using Framer’s variant transitions, these toggle-driven components enable dynamic interactivity, giving users precise control over filtering, sorting, and other actions. Depending on the CMS Plus component, the name of the control to trigger its functionality can be named differently. Explore each component to get the full details.

Empowering Designers with Versatile Interaction Tools

This shows how flexible CMS Plus is, empowering designers to choose between automation and interactive customization. Standalone components offer effortless automation for tasks like counting, searching, and dynamic updates, ideal for simple, efficient setups.

Meanwhile, toggle-driven components provide enhanced interactivity, allowing users to engage directly with filtering, sorting, or clearing options. By integrating Framer’s variant transitions, designers can seamlessly combine functionality with custom designs, delivering intuitive and dynamic user experiences.

This flexibility makes CMS Plus an adaptable tool for any Framer project.