> ## Documentation Index
> Fetch the complete documentation index at: https://sleekplan.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Use the widget with a Content Security Policy

> The Content Security Policy directives and Sleekplan domains you need to allowlist so the feedback widget loads, styles, and connects correctly on a site that enforces a CSP.

A Content Security Policy (CSP) is a browser security feature that limits which domains a page may load scripts, styles, images, and network requests from. It helps protect against cross-site scripting (XSS) attacks. If your site sends a CSP header and does not allowlist Sleekplan, the browser will block the widget and you may see console errors like `Refused to load the script`.

To let the widget work, add the Sleekplan domains below to the matching directives in your policy.

<Info>
  This only applies if your site actively enforces a CSP (a `Content-Security-Policy` header or `<meta http-equiv="Content-Security-Policy">` tag). Most sites do not, and the widget works without any changes. If you are unsure, you probably do not have one.
</Info>

## Required directives

Add these sources to your existing policy. If you do not already declare a given directive, you only need to add it if your policy sets a restrictive `default-src`.

| Directive     | Sources to allow                                                                                                            |
| ------------- | --------------------------------------------------------------------------------------------------------------------------- |
| `script-src`  | `'unsafe-inline'` `blob:` `https://client.sleekplan.com` `https://api-client.sleekplan.com` `https://storage.sleekplan.com` |
| `style-src`   | `'unsafe-inline'` `https://client.sleekplan.com` `https://storage.sleekplan.com`                                            |
| `connect-src` | `https://api-client.sleekplan.com` `https://ingest.sleekplan.com` `https://storage.sleekplan.com`                           |
| `img-src`     | `blob:` `data:` `https://client.sleekplan.com` `https://storage.sleekplan.com`                                              |
| `font-src`    | `https://storage.sleekplan.com`                                                                                             |
| `frame-src`   | `'self'`                                                                                                                    |

## Example policy

A complete `Content-Security-Policy` header that allows the widget looks like this (combine it with your own existing sources):

```
Content-Security-Policy:
  default-src 'self';
  script-src 'self' 'unsafe-inline' blob: https://client.sleekplan.com https://api-client.sleekplan.com https://storage.sleekplan.com;
  style-src 'self' 'unsafe-inline' https://client.sleekplan.com https://storage.sleekplan.com;
  connect-src 'self' https://api-client.sleekplan.com https://ingest.sleekplan.com https://storage.sleekplan.com;
  img-src 'self' blob: data: https://client.sleekplan.com https://storage.sleekplan.com;
  font-src 'self' https://storage.sleekplan.com;
  frame-src 'self';
```

<Warning>
  The widget requires `'unsafe-inline'` for `script-src` and `style-src`, so it does not yet support a strict, nonce-based CSP Level 3 policy. If your security requirements mandate a strict CSP, contact support so we can advise on your setup.
</Warning>

## Standalone portal on a custom domain

If you host your feedback portal on your own domain instead of embedding the widget, the CSP is served by Sleekplan and you can extend it from the portal settings. That is a separate flow: see [Add custom CSP rules](/help/portal-widget/custom-csp-rules).

## Next steps

<CardGroup cols={2}>
  <Card title="Back to install overview" icon="arrow-left" href="/help/getting-started/install-widget">
    The snippet, user identification, and other platforms.
  </Card>

  <Card title="Custom domain" icon="globe" href="/help/portal-widget/custom-domain">
    Host your feedback portal on your own subdomain.
  </Card>
</CardGroup>