Sites & snippet

Install the snippet

After you add a site, adfit gives you a small snippet to install. You add it once to the <head> of your site and adfit takes care of the rest. It loads asynchronously and won't slow your pages.

Where to find your snippet

You'll see the snippet right after you add a site, and anytime later on the site's Snippet tab. Use the copy button to grab the exact embed code; it's generated for your site, so copy it rather than typing it out.

Always paste it into the <head>

Wherever your platform lets you add code, the snippet goes into the <head> of your pages, not the body or the footer. Placing it in the <head> lets adfit personalize content before it's shown.

Screenshot coming soon
The Snippet tab showing the embed code with a copy button and the platform install steps.

Choose your platform

Jump straight to the steps for how your site is built:

Static HTML

Paste the snippet into the <head> of every page you want adfit to personalize.

  1. Step 1

    Open your site's HTML template (the file that renders the <head>).

  2. Step 2

    Paste the snippet just before the closing </head> tag.

  3. Step 3

    Save and re-deploy your site.

WordPress

Add the snippet to the site <head> via your theme or a header-scripts plugin.

  1. Step 1

    In your WordPress admin, open Appearance → Theme File Editor (or a plugin like "WPCode" / "Insert Headers and Footers").

  2. Step 2

    Paste the snippet into the <head> section (header) area.

  3. Step 3

    Save your changes.

Good to know

If you use WP Rocket, add the adfit script to "Excluded JavaScript Files" so it isn't delayed or combined. The snippet already carries data-no-defer and data-no-optimize attributes, but some optimizers need an explicit exclusion.

Framer

Add the snippet as a custom script that loads at the start of your site's <head>.

  1. Step 1

    In your Framer project, open Settings → Code, then click "Add Script".

  2. Step 2

    In the dialog, give the script a Name you'll recognize, e.g. "adfit".

  3. Step 3

    Set Placement to "Start of <head>". This is critical: the default "End of <body>" runs the snippet only after the page has painted, which causes a visible flash of the original content.

  4. Step 4

    Leave Page set to "All" so every page loads the snippet.

  5. Step 5

    Set Run to "On every page visit". This is critical: Framer moves between pages without a full reload, so "Once" would personalize only the first page a visitor lands on.

  6. Step 6

    Paste the snippet into the Code field, then click "Add".

  7. Step 7

    Publish your site. Custom code only runs on the published site, not in the Framer canvas.

Webflow

Add the snippet to the site-wide custom code in your <head>.

  1. Step 1

    In Webflow, open Project Settings → Custom Code.

  2. Step 2

    Paste the snippet into the "Head Code" field.

  3. Step 3

    Save changes and publish your site.

Shopify

Add the snippet to your theme's layout <head>.

  1. Step 1

    In your Shopify admin, go to Online Store → Themes → … → Edit code.

  2. Step 2

    Open Layout → theme.liquid and paste the snippet just before the closing </head> tag.

  3. Step 3

    Save the file.

After you install

After installing, open your site once in a new tab. adfit verifies the connection automatically.

If the status doesn't turn to Connected on its own, you can run a check yourself. See Verify your connection. If it still won't connect, Troubleshooting covers the usual causes.