Pages > Create

Custom Code

Add tracking, pixels, and other integrations to your pages and quizzes.

Overview

Custom code lets you inject scripts into your pages and quizzes, in the header or body. Common uses include:

  • Tracking tools, such as Google Tag Manager (GTM) or Meta Pixel.
  • Changing text on the page, such as swapping in copy based on a lookup value or translating it.
  • Adding a third-party widget, such as a floating live chat bubble or cookie consent banner.

Custom code runs in your visitor's browser. To call an external API from a form or quiz instead, for example to validate an answer or look up data, use an API Call Step.

Don't paste tracking code into page content

Avoid adding custom code, especially tracking and conversion code like a Pixel or GTM, directly into HTML on the page, and especially not on quiz or form steps. Code placed there is easy to lose track of and can cause confusion such as duplicate or missing events. Add it in Custom Code instead, where it is named, visible, easily modified and can be turned on or off.

Three Levels

Custom code can be added at three levels, from highest to lowest:

  • Workspace — applies to every page and quiz. Go to Settings → Website → Custom Code.
  • Page / Quiz — applies to one page or quiz. Open page or quiz settings, then the Custom Code tab.
  • Variant / Experiment variation — applies to one variant or variation only.
    • For example, one Landing Page may have a Google variant and a Meta variant with their own code.

Code is inherited from higher levels, but you can enable or disable it at a lower level to override the default. So a variant's on/off setting overrides its page, and a page setting overrides the workspace.

Workspace Custom Code

Page or Quiz Custom Code

Name the code you add consistently

Give each code a name that includes the team, industry, or conversion it is for, such as "Meta Pixel - Lead - Healthcare". Clear names let you, and your Agents, turn the right code on or off automatically.

Add code at the workspace level only

Keeping every snippet in one place means you only edit it once when it changes. Use the page or variant level only for code that truly belongs to just one of them.

Leave it off by default

Only leave a snippet on for every page if it is needed on most or all of them. Otherwise, keep it off and turn it on for the pages and quizzes that need it, either by hand or by letting Memory and Agents remember which pages get which code.

Adding a Custom Code Snippet

A snippet is one block of custom code, with its own name, location, and on/off toggle. The steps are the same at every level. On the Custom Code tab:

Click + Add Code

A popup appears to configure the new snippet.

Name it and set enabled or disabled

Enter a name, then toggle the snippet on or off. Disabled snippets are saved but not injected.

Add your code and choose where it goes

Paste your script and select where it is injected:

  • Header — in the <head>, for scripts that load before content (e.g. GTM, analytics).
  • Body — in the <body>, for scripts that interact with page elements.

Wait

Add a 1 ms delay to body scripts, since they may reference elements that have not rendered yet. Consider more delay if your script touches many elements.

Click Add Code

The snippet is added to the Custom Code tab at this level.

Save and Publish

Save your changes, then publish every page and quiz that should use the code. Nothing goes live until the asset it applies to is published.

Workspace changes need publishing on each asset

Use Bulk Publish to publish many changes at once.

Summary

Add custom code once at the workspace level, keep it off unless most pages need it, and name it clearly so it is easy to turn on where it belongs.

The SuperAgent can assist with code maintenance on any level. Ask SuperAgent if you have questions about code, or want it to scan your assets.