# Quick Start
Drop the Otter snippet into your site and start running tests.
Add the Otter snippet to your site, verify it loaded, and you're ready to launch your first test in minutes.
Otter runs as a single JavaScript file that you load in the head of every page on your site. Once it's there, the SDK fetches the visitor's active tests, assigns them to variants deterministically, applies any DOM changes the variants require, and tracks conversions back to the right variant — all without you writing a single line of application code.
The snippet below ships with an inline anti-flicker style that hides the page body (`opacity: 0`) until variants are resolved. That removes the "flash of original content" that visitors usually see with other A/B testing tools, and a 3 second failsafe guarantees the page still becomes visible if the SDK ever fails to load.
```html
```
## Step-by-step installation
1. **Grab your project API key.** Sign in to Otter, open the project you want to instrument, and copy the key from Project Settings. Each project (website) gets its own key.
2. **Paste the snippet into your site's ``.** Replace `YOUR_API_KEY` with the key you copied, then add the snippet to your global layout, theme template, or every page's head. Place it as early as possible so the SDK starts loading before other scripts.
3. **Deploy and verify.** Open any page on your site and add `?optimo-verify=YOUR_API_KEY` to the URL. Otter pings the active endpoint and marks your project as verified in the dashboard.
4. **Build your first test.** Head to the dashboard and click **New Test**. The six-step wizard walks you from picking a test type to launching, including a sample-size estimate.
> **Install tips**
>
> **Install once, run everywhere.** Put the snippet in your shared layout, template, or theme header. Per-page installs are an anti-pattern and risk forgetting coverage.
>
> **Don't install via Google Tag Manager unless you have to.** GTM injects scripts after page load, which means visitors see the unmodified page before variants apply. Direct `` installs avoid this.
>
> **Use a separate project per environment.** Create a Staging project with its own API key so dev traffic and reporting stay clean from production.
## Frequently asked questions
### Where exactly should I put the snippet?
As close to the top of the as possible — ideally before any other scripts. The earlier the SDK loads, the less chance a visitor sees the unmodified page before a variant is applied. The included anti-flicker style hides the body until the SDK has resolved variants, so placing the snippet late doesn't cause a flash, but it can delay the first paint.
### Will the snippet slow my site down?
The SDK is a small (around 28 KB gzipped) script served from our edge. It loads with the async attribute so it never blocks rendering, and the browser caches it after the first hit — so subsequent page loads add essentially no latency. The anti-flicker style only stays applied for a few hundred milliseconds in normal conditions, and is force-cleared after 3 seconds if the SDK fails to load for any reason.
### Do I need to install anything per page?
No. One snippet on every page is enough. If your site shares a layout, header, or theme template, install it there once and you're done. The SDK detects route changes in single-page apps automatically.
### How do I confirm the snippet is working?
Open your site and add ?optimo-verify=YOUR_API_KEY to the URL. Otter will hit the SDK's active endpoint and show a verified status on your project page. You can also append ?optimo-debug to see verbose [Optimo] log messages in the browser console.
### What happens before the SDK loads on a slow connection?
The anti-flicker style (body { opacity: 0 }) keeps the page invisible while the SDK initializes, so visitors never see the control version flash before the variant. If the SDK fails to load entirely — network issue, ad blocker, etc. — a 3 second failsafe automatically removes the style and shows the page so the visitor isn't stuck on a blank screen.
### Can I use Google Tag Manager to install Otter?
Yes, but we strongly recommend installing the snippet directly in your instead. GTM injects scripts after page load, which means variants flash visibly before being applied. The Integrations page covers GTM as a last-resort option with mitigation steps.
---
Canonical page: https://www.otterab.com/docs/getting-started/quick-start