cartdance banner

CartDance

$49.99/year unlimited sites

Lifetime Deal: $249.99

Why this is hard without CartDance

SureCart's checkout components are encapsulated in Shadow DOM. To style them you need CSS custom properties and ::part() selectors, which are non-trivial to discover and apply manually. CartDance handles this automatically, translating your Breakdance brand colors and typography settings into the correct CSS targets including the Shadow DOM layer, so your store stays visually consistent with the rest of your site.
If you are running Breakdance as your page builder and SureCart as your e-commerce platform, you have likely run into the same wall: styling SureCart's checkout components from Breakdance is not straightforward. SureCart uses Shadow DOM architecture for its checkout elements, which means standard CSS overrides do not reach them. CartDance bridges that gap.

CartDance is not a CSS snippet. It is a full integration layer connecting Breakdance's visual editing workflow, Global Settings, and Display Conditions to SureCart's products, collections, cart, and checkout. You get a visually consistent store without touching a line of CSS.

What CartDance Provides

Global Settings Integration

Set your brand colors and typography once in Breakdance Global Settings. CartDance reads those values and applies them across your entire SureCart storefront: buttons, inputs, labels, checkout fields, and the cart drawer. Or use the admin settings from CartDance instead. (Recommended)

Shop and Product Pages

Build your shop page and product detail pages with ease. With CartDance you now have an all-in-one area for CSS customization and proper styling. No custom code required.

Collections

Display SureCart product collections on any Breakdance page using the shortcode and Breakdance templates.

Related Products

Add a related products section to any product page. CartDance outputs a configurable grid that inherits your product card styles and color settings.

Cart Icon and Cart Drawer

Drop a cart icon anywhere in your Breakdance layout. CartDance connects it to SureCart's cart drawer and applies your brand colors, including a dark mode fix that corrects text rendering inside the drawer on dark backgrounds.

Shortcode Support

All SureCart shortcodes work on Breakdance-built pages. CartDance ensures they render correctly inside Breakdance's output structure.

Admin Settings

A dedicated settings panel lets you configure brand colors, manage typography settings for product cards and quantity inputs, and control CSS cache behavior. Settings are organized into three tabs: Brand & Colors, Typography, and Advanced.

CSS Caching

CartDance generates your integration CSS dynamically and caches it using WordPress transients.
previewtutorial
© 2026 BD Boogie. All Rights Reserved.