Serving

Krispy Widget

The canonical accessibility panel and cookie consent manager for the fleet. One script tag per site. This host is internal tooling, not a product page.

Install

One tag, nothing else. Brand color, font, radius and color scheme are inherited from the host page.

<script src="https://krispy-widget.pages.dev/v1/krispy-widget.js" defer
  data-site-name="Site Name"
  data-ga-id="G-XXXXXXXX"
  data-privacy-url="/privacy.html"></script>

Sites track /v1/, which always serves the current build. Version folders such as /v1.2.2/ are immutable archives kept as a rollback lever, not pin targets.

Attributes

  • data-site-namerequiredUsed in the consent banner copy.
  • data-ga-idThe site's real GA measurement ID. Analytics stay off until the visitor accepts. Carry this across when migrating a site, or you silently kill analytics the visitor already agreed to.
  • data-privacy-urlLinked from the consent banner.
  • data-statement-urlAccessibility statement, linked in the panel footer.
  • data-consentSet to off to mount the accessibility panel with no consent banner. For internal tools that set no cookies.
  • data-langen or es. Read once at load. For a same URL language toggle call window.KrispyWidget.setLang(lang) instead.
  • data-positionright or left. Default right.
  • data-accent, data-brand, data-font, data-radius, data-schemeOverrides for the inherited look. Only needed when inheritance picks the wrong token.

Gated embeds

Scripts and iframes carrying data-consent-src are held inert until consent is granted. That markup is handled natively, so never hand roll a second gate over it. Add data-consent-decorative to an ambient embed, such as a background hero video, to suppress the visible placeholder while keeping it gated.

Pages

What this widget is not

An overlay does not make a site compliant, and no copy on a client site should say it does. The FTC fined accessiBe $1M for claiming otherwise, and sites that carry overlays still get sued.

What actually defends a client is WCAG conformance in the page itself plus an accessibility statement with a real contact route. Treat this widget as a convenience layer on top of that work, never as a substitute for it.