# Install Vynix - Website Feedback Widget in 2 Minutes

> Two ways to run Vynix on any site: drop in one script tag, or add the Chrome extension for no-code capture. Works on WordPress, Laravel, React, Vue and Next.js.

Install

# Run Vynix on any site

Two ways, the same agent-ready capture: drop in one dependency-free script tag, or add the Chrome extension and capture with no code. Pick whichever fits.

[Create your project](/register)

[

### Embed the widget

Drop one script tag onto your own site. Always on for your whole team and your visitors. Best for your production or staging site.

Get the snippet](#widget)

[

### Add the Chrome extension

No code. Click the icon and capture on any page, even one you do not own. Best for QA, agencies, and reviewing client or staging sites.

Add to Chrome](https://chromewebstore.google.com/detail/hgddehkmjibbhkhapihlpocoefdjeibf)

Both capture the same agent-ready context and feed the same dashboard, MCP server and GitHub handoff.

Embed the widget

## One script tag. Any stack.

Best for your own production or staging site: always on for your whole team and your visitors.

✓Create a project

2Add the script

3Start annotating

```
<script
  sr
```

✓Widget connected. Launcher is live on your site.

Point at any element and leave a note.1

### Add the widget script

Paste this just before your closing `</body>` tag on every page you want to capture, then swap `YOUR_PROJECT_KEY` for your project’s key from the dashboard.

index.html

<script
  src\="https://cdn.vynix.in/widget.js"
  data-project-key\="YOUR\_PROJECT\_KEY"
  data-api\="https://www.vynix.in"
  defer
\></script>

Copy

Loads deferred from our CDN and runs isolated in a Shadow DOM, so it never blocks rendering or clashes with your site’s styles.

Three steps

## Live in under two minutes

01

### Create a project

Sign in, create a project for your site, and copy its public project key from the dashboard.

02

### Add one script tag

Paste the snippet just before your closing </body> tag. It loads deferred and never blocks rendering.

03

### Start annotating

Open your site, click the Vynix launcher, point at any element and leave a note. That’s it.

Compatibility

## Works with your stack

Because it’s a plain script isolated in a Shadow DOM, Vynix runs the same everywhere: no plugin, no build step.

Static HTML

PHP

WordPress

Laravel

React

Vue

Next.js

Svelte

Configuration

## Script attributes

`data-project-key`required

Your project’s public key from the dashboard. Tells Vynix where annotations belong.

`data-api`required

Your Vynix API base URL.

`data-capture-diagnostics`optional

Set to "false" to disable console & network capture. Defaults to true.

`data-theme`optional

"auto" (default), "light" or "dark" to match your site.

`defer`optional

Recommended. Loads the widget without blocking your page.

Or skip the code

## Prefer no setup? Add the extension.

Same Vynix, nothing to install on your site. Pin the extension and capture on any page, even one you do not own.

No code, any site

## Vynix lives in your browser

Pin the extension and point-and-capture on any page: your own app, a staging build, a client’s site, even one you do not own. No snippet, no deploy.

-   Works on any website, the moment you click the icon.
    
-   Nothing to add to your site. Perfect for QA and agencies.
    
-   The same agent-ready capture as the embedded widget.
    

[Add to Chrome](https://chromewebstore.google.com/detail/hgddehkmjibbhkhapihlpocoefdjeibf)Free · Works in Chrome, Edge & Brave

app.acme.io/checkout

Checkout

1

#1 button.checkout

“make this primary and a larger tap target”

Connect your agent

## Add the MCP server

Register the Vynix MCP server with any compatible client to let your agent read and resolve annotations directly. Add this to your client’s MCP config and restart it.

-   Use a personal token from your dashboard.
-   Point VYNIX\_API at your Vynix instance.
-   Then ask your agent: “what feedback do I have?”

mcp.json

{
  "mcpServers": {
    "vynix": {
      "command": "npx",
      "args": \["-y", "@usevynix/mcp-server"\],
      "env": {
        "VYNIX\_API\_URL": "https://www.vynix.in",
        "VYNIX\_API\_TOKEN": "your\_personal\_token"
      }
    }
  }
}

Copy

## Stop describing bugs. Point at them.

Add one script tag and give your AI agent the context it has been missing. Free while we grow.

[Get started free](/register)[Read the install guide](/install/)

---

Source: https://www.vynix.in/install/ | Markdown version for AI agents. Full site index: https://www.vynix.in/llms.txt