Use QCDS Custom CSS Safely

QCDS Custom CSS is a Max / All Access feature for frontend presentation overrides without editing extension files. Saved rules are stored separately from the QCDS code and can be enabled or disabled from the administrator.

Scope your rules beneath the stable .qcds-frontend root and keep the saved CSS within QCDS's 250,000-byte limit.

Open the Custom CSS Tab

  1. Go to Components > QC Digital Signature > Custom CSS.
  2. Confirm the current Effective tier is Max or All Access.
  3. Select Enable Custom CSS when you want the saved rules to be delivered on the frontend.
  4. Enter CSS rules only and select Save Custom CSS.
  5. Reload the affected QCDS frontend pages and test at desktop and mobile widths.

Always Scope Rules to QCDS

Use .qcds-frontend as the outer selector so the override stays inside the QCDS frontend. For example:

.qcds-frontend .qcds-front-card {
    border-radius: 10px;
}

The Custom CSS screen includes selector helpers for common QCDS areas such as primary tabs, sub-tabs, buttons, filters, Request rows, Template rows, Contact rows, cards, and form fields.

Content and Size Restrictions

  • Paste CSS rules only; do not wrap the content in HTML <style> tags.
  • The saved value is limited to 250,000 bytes.
  • QCDS rejects content containing a closing </style> sequence.
  • The frontend also refuses to deliver saved CSS that is oversized or fails the same safety check.

These checks are designed to keep the same-origin CSS endpoint as CSS-only content rather than an HTML injection surface.

Enable vs. Save

Saved CSS and enabled state are separate. You can turn Enable Custom CSS off temporarily without deleting the saved rules. When disabled, QCDS returns no custom frontend CSS even though the saved content remains available to an entitled administrator.

What Happens After a Downgrade

If the Effective tier is no longer Max or All Access, QCDS preserves the saved CSS but does not apply it and does not allow editing from the Custom CSS tab. If Max/All Access access returns later, the saved rules are available again.

Because QCDS checks the current validated Effective tier when serving the stylesheet, cached premium access is not enough to keep Custom CSS active after entitlement is no longer valid.

Why Custom CSS Survives Extension Updates

Current QCDS stores Custom CSS in dedicated database storage and serves it through the QCDS frontend instead of modifying extension files. That keeps your overrides separate from files replaced by a normal Joomla extension update.

Safe Testing Checklist

  • Test Dashboard, Requests, Templates, Contacts, Email Templates, and Settings.
  • Check narrow/mobile widths as well as desktop.
  • Avoid broad selectors such as unscoped button, table, or input rules.
  • If a change appears not to apply, confirm Custom CSS is enabled and the Effective tier is still Max/All Access before changing the selector.
  • After large CSS changes, test signer-facing and authenticated frontend pages separately so an override does not reduce readability or hide controls.

Community Discussion

Want to compare workflows, share practical tips, or discuss how you use this QCDS feature? Visit the QC Digital Signature Community. For private support, bug reports, account-specific issues, or feature requests, use the QuantaCade support system.