Embed Script

The embed.js script renders a live policy (or all policies) directly on your website. When you update a policy in your dashboard, the embedded version refreshes automatically.

Embed a policy

<script
  src="https://policifyai.com/embed.js"
  data-site-key="YOUR_SITE_KEY"
  async>
</script>

The script detects which policy to render from the page URL (/privacy-policy, /terms, /refund-policy, …) and renders it where the tag sits. Force a specific policy type with data-policy (e.g. data-policy="privacy-policy"). Your site key is generated for you in Dashboard → Integrations.

Legal hub embed

Display all policies for your site in a navigable hub — ideal for a /legal page. Paste the snippet on a page whose URL contains /legal, or force hub mode:

<script
  src="https://policifyai.com/embed.js"
  data-site-key="YOUR_SITE_KEY"
  data-policy="hub"
  async>
</script>

All data attributes

Attribute	Required for	Description
data-site-key	Required	Your site key (pk_…) from Dashboard → Integrations. Named agency keys (pak_live_…) also work
data-policy	Optional	Force a policy type slug ("privacy-policy", "terms-of-service", …) or "hub". Auto-detected from the URL otherwise
data-container	Optional	ID of an existing element to render into (default: renders where the script tag sits)
data-theme	Optional	"light" \| "dark" \| "auto" (default: "auto")

Content Security Policy

If your site uses a CSP header, add the following directives to allow the embed script:

script-src 'self' https://policifyai.com;
connect-src 'self' https://policifyai.com;
style-src 'self' 'unsafe-inline' https://policifyai.com;

Multiple embeds

You can embed multiple policies on the same page by adding multiple script tags, each with its own container and data-policy:

<div id="policy-privacy"></div>
<script src="https://policifyai.com/embed.js"
  data-site-key="YOUR_SITE_KEY"
  data-policy="privacy-policy"
  data-container="policy-privacy">
</script>

<div id="policy-cookies"></div>
<script src="https://policifyai.com/embed.js"
  data-site-key="YOUR_SITE_KEY"
  data-policy="cookie-policy"
  data-container="policy-cookies">
</script>

Programmatic rendering

For SPAs and frameworks like React or Vue, you can fetch the policy HTML directly from the API and render it yourself:

// Server-side or client-side fetch
const res = await fetch('https://policifyai.com/api/v1/policies/pol_abc123', {
  headers: { 'Authorization': `Bearer ${API_KEY}` }
})
const { content_html } = await res.json()

// React
<div dangerouslySetInnerHTML={{ __html: content_html }} />

💡 Policy HTML is sanitised server-side. However, always apply your own CSP and consider wrapping in a shadow DOM to prevent style bleed.

Caching behaviour

The embed script caches policy content for 5 minutes in the browser. Server-side, policies are edge-cached globally for low latency. After you update a policy in your dashboard, the live embed reflects the change within 5 minutes.

← Webhooks Error reference →User embed guide →