Cart Attribute Toggle

A one-tap toggle that writes a preset cart attribute, like marking an order as a gift.

Last updated

Cart Attribute Toggle icon

How to use

  1. Place this component in the cart.

  2. Set the Attribute Key — the name of the cart attribute this writes to — and the preset Order Note copy applied when the toggle is on. Its default Attribute Key is "Gift," independent of Cart Attribute Input's "Cart Order Note" default — leave them different unless you want the two components to share one value.

  3. Set the Default state and connect your ⦿ Selected and ⦿ Unselected designs.

Optionally set Tracking to record these interactions in Framer Analytics.

How the toggle writes to the order

Turning the toggle on writes the preset Order Note copy to the cart under the Attribute Key you set; turning it off removes it. By default that's a key of its own — independent from Cart Attribute Input — making it a one-tap way to attach preset text, like marking an order as a gift, without touching any other cart attribute.

Combining with Cart Attribute Input

By default, Cart Attribute Toggle writes to its own key — independent from Cart Attribute Input, so switching this off never clears text the customer typed into a separate field. Give both components the same Attribute Key only if you want them to act as alternate UIs for one shared value.

Questions? Join our Slack community