Set attributes on the script element to provide initial configuration:
| Attribute | Required | Default | Description |
|---|---|---|---|
data-key | Yes | — | Project key used to load configuration and submit reports. |
data-environment | No | default | Environment label attached to reports. |
data-user-id | No | — | Reporter ID in your application. |
data-user-email | No | — | Reporter email. |
data-user-name | No | — | Reporter display name. |
data-user-image | No | — | Reporter image URL. |
data-meta-* | No | — | Custom string metadata; the suffix is used as the metadata key. |
data-default-visible | No | true | Set to false to hide the trigger when the widget starts. |
Example:
<script
type="module"
src="https://cdn.snappa.dev/widget/v1/snappa-widget.js"
data-key="YOUR_PROJECT_KEY"
data-environment="production"
data-user-id="user-123"
data-user-email="user@example.com"
data-user-name="Jane Doe"
data-meta-plan="team"
data-meta-page="billing"
data-default-visible="true"
></script>
All script attributes are visible to users of the page. Do not include secrets or sensitive personal information in custom metadata.
Attributes provide initial values. To update user, environment, or metadata after initialization, use the JavaScript API.