Install guide: Webflow

Before you start

• You have completed the earlier onboarding steps and verified that you control the site.
• You have your own snippet from the dashboard. The one on this page is a sample and will not work.
• A Webflow site you own, on a Site or Workspace plan that allows custom code. Access depends on those features.
• Your installation snippet from the LinkShare dashboard, available after ownership verification.

Steps

A footer component holds the mount element, and either site-level footer custom code or a Code Embed element holds the loader, on a plan that allows custom code.

1. Add the mount to the footer

   Add a Code Embed element to your footer component and paste the mount element.

2. Add the loader

   Paste the script tag into the site-level footer custom code, or into the same Code Embed.

3. Publish to test

   Custom code may not run in the designer. Publish the site and check the live page.

4. Check on your own domain

   Check the page on the domain you verified, not only on a Webflow-provided address.

5. Run Check installation

   In the dashboard, run the check. It reports whether code was found, the box rendered, the origin is approved, eligibility passed and telemetry was observed.

6. Activate

   Activate the installation once every check passes.

Sample snippet

The installation ID, content hash and integrity value below are fictional. The dashboard generates the real ones for your installation. Copy the snippet from there and never assemble the address or hash yourself.

<div data-nosa-linkshare="EXAMPLE_INSTALLATION_ID"></div>

<script src="https://linkshare.nationalonlinesellers.org/widget/v1/EXAMPLE_CONTENT_HASH.js" integrity="sha384-EXAMPLE_GENERATED_BY_DASHBOARD" crossorigin="anonymous" defer></script>

Strict Content Security Policy

If your site sends a Content Security Policy, the box needs two exact entries for the LinkShare address. The box styles itself without an external stylesheet or inline style, so no style-src entry is needed for it.

Add only these exact entries. Do not add 'unsafe-eval', and do not add a wildcard such as https://*.

script-src 'self' https://linkshare.nationalonlinesellers.org;
connect-src 'self' https://linkshare.nationalonlinesellers.org;

Updating the snippet

The script address and integrity value pin one exact release, so a new release needs a new snippet. When an update is available, copy the new snippet from the dashboard and replace the old one. Nothing updates itself silently.

Removal

• Delete the Code Embed element from the footer component.
• Remove the script tag from site-level footer custom code, then publish.
• Pausing the installation in the LinkShare dashboard hides the box without editing the site.

If something goes wrong

1. The box does not appear

   Confirm the mount element is on the page you are viewing, then run Check installation. A cached page, an unpublished change or a missing mount element are the usual causes.

2. Code found but the box is not visible

   Check that the script loaded without being blocked by a Content Security Policy, an ad blocker or a privacy plugin. The browser console names the blocked address.

3. Origin not approved

   The box renders only on websites you verified. A preview or staging address is a different origin. Verify the address you are testing or test on your live address.

4. The integrity check fails

   The script was altered or the snippet was edited or truncated. Copy the whole snippet again from the dashboard. Also exclude the script from any minifying or combining plugin.

5. The box shows a neutral state or fewer than four businesses

   That is expected when few businesses qualify, and rules are never relaxed to fill the box. It also appears if LinkShare is unavailable; the page itself is not affected.

6. Two boxes appear

   More than one mount element is on the page, often because a layout and a page both include the snippet. Remove the extra one.

Tested environment and date

None recorded yet.

Platform page and caveats