Widget Installation

The Genesis widget is a lightweight JavaScript snippet (3KB gzipped) that adds a feedback button to your site. It uses Shadow DOM for style isolation — it won’t affect your page styles.

Script tag

Add this before the closing </body> tag:

<script
  src="https://widget.usegenesis.dev/genesis.js"
  data-key="YOUR_API_KEY"
></script>

Replace YOUR_API_KEY with the API key from your app settings in the dashboard.

With user identity

If you know who the current user is, pass their details via data attributes:

<script
  src="https://widget.usegenesis.dev/genesis.js"
  data-key="YOUR_API_KEY"
  data-user-id="usr_12345"
  data-user-email="jane@example.com"
  data-user-name="Jane Smith"
></script>

Custom metadata

Pass arbitrary metadata as a JSON string:

<script
  src="https://widget.usegenesis.dev/genesis.js"
  data-key="YOUR_API_KEY"
  data-meta='{"plan": "enterprise", "org_id": "org_789"}'
></script>

This metadata is included in the submitter context for every request.

Self-hosted API

If your Genesis backend runs at a custom URL:

<script
  src="https://widget.usegenesis.dev/genesis.js"
  data-key="YOUR_API_KEY"
  data-base-url="https://api.yourcompany.com"
></script>