Widget CSS Override Reference Guides
Alerts Widget —
alerts_widget_css_overrides.pdfCalendar Widget —
calendar_widget_css_overrides.pdfGroups Widget —
groups_widget_css_overrides.pdfSignups Widget —
signups_widget_css_overrides.pdf
You can often update the look of the signups widget by adding CSS on your own website and targeting the classes already rendered by the widget.
To make changes safely and cleanly:
Start with the signup root class so your CSS only affects the widget.
Target the card and popup classes listed in this guide.
Test your changes on desktop and mobile after publishing them on your site.
Root Class Naming
The signups widget renders with these important root classes:
.dce-signup.dce_signup__<widget-uuid>
Examples:
.dce-signup { } .dce_signup__12345678-abcd-1234-abcd-123456789abc { }Naming Schema
Class | Description |
| Global widget root |
| One specific widget instance |
| Signup card layout and content |
Some popup/detail pieces reuse groups-style modal classes such as .dce-groups-modal--...
Common Targets
Useful classes that appear in the signups output:
.dce--signups-cards .dce--signups-cards-card .dce--signups-cards-card_cover .dce--signups-cards-card_content .dce--signups-cards-card_content-body .dce--signups-cards-card_header-image .dce--signups-cards-card_featured-badge
Popup/detail output may also include:
.dce-groups-modal--wrapper .dce-groups-modal--container .dce--groups-card--cta-btn
Best Practices
Scope overrides to the signup root first to avoid affecting other elements on the page:
.dce-signup .dce--signups-cards-card { border-radius: 20px; } .dce-signup .dce--signups-cards-card_featured-badge { background: #111; color: #fff; }To target a single widget instance, use the UUID-specific class:
.dce_signup__12345678-abcd-1234-abcd-123456789abc .dce--signups-cards-card { background: #fcf7ef; }Notes
Signups uses its own card class family, but some modal and button pieces reuse classes originally used by the groups widget.
Keep overrides anchored to
.dce-signupor.dce_signup__<uuid>so they do not leak into unrelated page content.Present this as a client-side workaround rather than official support.