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

# Install the loader

> One click adds a single script tag to your Webflow site that delivers every Cairn script.

The loader is the only thing you embed in Webflow. Once it's in — and you've published your site once — every Cairn script you publish to that site ships through this one tag. No more embeds, and no more republishing in Webflow.

## How it works

Cairn uses Webflow's [Data API v2](https://developers.webflow.com/data/docs/working-with-custom-code) to write a single `<script>` tag into your site's project-level custom code. From then on, Cairn delivers your scripts through that loader on every page load.

## One-click install

1. In Cairn, open a site.
2. Click **Install loader**.
3. Cairn confirms the loader is in place and shows the embed snippet for reference.
4. **Publish your site in Webflow.** This is the step that puts the loader on your live pages — see below.

<Tip>
  It's safe to click **Install loader** more than once. If the loader is already there, Cairn just checks it's up to date and leaves it alone.
</Tip>

## Publish once in Webflow

<Warning>
  After installing the loader, you must **publish your site in Webflow** before it appears on your live pages. Webflow only ships custom-code changes when the site is published — the install itself updates your site's configuration, not the published pages.
</Warning>

The good news: this is a **one-time step per site**. Once that publish bakes the loader tag into your pages, everything you do in Cairn — adding scripts, editing, publishing, rolling back — goes live through the loader instantly, with no Webflow publish ever needed again.

You'd only need to republish in Webflow if you uninstall and later reinstall the loader.

## Verify it's working

Open any page of your **published** site and open the browser console (right-click → Inspect → Console). The loader announces itself on every page load with a green version badge:

```
⚡ Cairn Script vthx3jg
```

The letters after `v` are the current delivery version — they change whenever you publish scripts in Cairn.

If you don't see the badge:

* Make sure you **published the site in Webflow** after installing the loader.
* Hard-refresh the page (the previous version may be cached).
* Check you're on the domain you expect — staging (`*.webflow.io`) and production domains each need the site published to them.

<Note>
  Prefer a quieter console? Each site's settings has a **subtle banner** option that swaps the green badge for a plain, unstyled `Cairn Script` line.
</Note>

## Manual install (fallback)

Prefer to paste the loader yourself? Copy the snippet from the site's settings page in Cairn and add it to Webflow under **Project settings → Custom code → Head**. It's the same loader one-click install uses, so your scripts deliver the same either way. Here's what it looks like:

```html theme={null}
<!-- Powered by Cairn Script (https://cairnscript.com)
     This snippet loads the custom JS & CSS that power this site.
     Manage these scripts: https://app.cairnscript.com/go/{your-site-key} -->
<script src="https://cdn.cairnscript.com/loader/{your-site-key}" defer></script>
```

`{your-site-key}` is the site's unique delivery key. Always copy the exact snippet from the app instead of typing it out by hand. The comment is optional, but it's handy: anyone who views the page source later can follow the link straight to the script editor.

A manual install needs the same one-time publish in Webflow before the loader is live.

<Note>
  Editing custom code in Webflow needs at least Build/design access, and
  site-level custom code needs a paid Webflow site plan.
</Note>