Skip to main content

How to implement Made with Intent

Learn how to implement Made with Intent onto your site

Written by Charley Bader

We want to make it as easy as possible for you to configure the Made with Intent script and are always evolving our implementation stack.

For all installations, you will need a unique ingestionID. This is created through signing up to the platform and creating your account. You will be provided with a link during the onboarding process to do this.

How to find your ingestion ID?

Your ingestionID can be found by navigating to 'Property Management' in the Settings area of the platform.

Within here, you will see all the properties you have within your organisation (you may have multiple if you have Intent across multiple sites), and their corresponding ingestionIDs

Here are some guides to installing the tracking script depending on your site tech.

Native Installation

Dispatch tracking events through code

Google Tag Manager

Install the tracking script in GTM using our pre-built GTM templates for tags

Shopify

Shopify customers should also create a custom web pixel. As simple as copy and pasting some code into your store.

Content Security Policies

Please add the following to your content security policy allowed hosts:

  • mwiassets.com

    • Images are hosted on this domain

    • Multiple image types are supported including webp

  • intentclientscriptslon.s3.eu-west-2.amazonaws.com

    • images and static scripts are hosted on this domain

  • *.inference.madewithintent.ai

    • Ensure that requests can be sent to this domain

Content-Security Policy directives:

Content-Security-Policy:

  img-src
    https://mwiassets.com
    https://intentclientscriptslon.s3.eu-west-2.amazonaws.com
    data:;
  script-src
    https://intentclientscriptslon.s3.eu-west-2.amazonaws.com
  connect-src
    https://*.inference.madewithintent.ai;

Content Security Policy for the Visual Editor

The Visual Editor has additional requirements beyond the tracking tag. If your site sends a Content Security Policy (CSP) or X-Frame-Options header, you'll need to make the changes below before the editor can open.

Not sure if your site has a CSP? Ask your developer to check the HTTP response headers on your homepage. If your site has no CSP, none of these changes are needed.

1. Allow your site to be framed

Required for all sites with a CSP.

The Visual Editor loads your page inside a frame so it can display and edit it. If your site blocks framing, the editor can't open.

If your site uses a Content-Security-Policy header, add 'self' to the frame-ancestors directive:

Content-Security-Policy: frame-ancestors 'self' ...

If frame-ancestors is currently set to 'none', change it to 'self':

# Before Content-Security-Policy: frame-ancestors 'none';  # After Content-Security-Policy: frame-ancestors 'self';

If your site uses an X-Frame-Options header, change DENY to SAMEORIGIN:

# Before X-Frame-Options: DENY  # After X-Frame-Options: SAMEORIGIN

If both headers are present, frame-ancestors takes precedence in modern browsers — update both to be safe.

2. Allow the editor script to load

Required if your site has a script-src directive.

The editor loads its main script from https://editor.madewithintent.ai. If your script-src directive doesn't already cover this origin, add it:

Content-Security-Policy: script-src 'self' https://editor.madewithintent.ai ...;

3. Allow the editor to connect to Intent

Required if your site has a frame-src or child-src directive.

The editor needs to make a secure connection back to Intent during startup. Add the editor origin to frame-src (or child-src if you use that instead):

Content-Security-Policy: frame-src 'self' https://editor.madewithintent.ai ...;

4. Cross-Origin-Opener-Policy

Required if your site sends this header.

If your site sends a Cross-Origin-Opener-Policy: same-origin header, the editor won't be able to verify your session when it opens. Change the value to unsafe-none, or remove the header entirely:

# Before Cross-Origin-Opener-Policy: same-origin  # After Cross-Origin-Opener-Policy: unsafe-none

This header is less common, but is typically set by sites using Shopify Plus, certain CDN security presets, or custom security hardening.

Putting it all together

A site with a full CSP that needs all four changes would end up with something like:

Content-Security-Policy:   script-src      'self' https://editor.madewithintent.ai ...;   frame-src       'self' https://editor.madewithintent.ai ...;   frame-ancestors 'self';  Cross-Origin-Opener-Policy: unsafe-none

Only add directives that your site already restricts — don't add a directive just because it appears in this example.

Alternative: use the Intent browser extension

If you can't modify your site's headers — for example, because they're managed by a third-party platform — the Intent extension handles these restrictions automatically. Install it from the Chrome Web Store and the editor will work without any site changes.

Did this answer your question?