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

# Custom code

> Add custom code into your Fillout forms to inject analytics tracking scripts, add HTML widgets, and more.

export const SupportBanner = () => {
  const titleId = React.useId();
  return <div className="support-banner" role="region" aria-labelledby={titleId}>
      <span className="support-banner__ring support-banner__ring--outer" aria-hidden="true" />
      <span className="support-banner__ring support-banner__ring--middle" aria-hidden="true" />
      <span className="support-banner__ring support-banner__ring--inner" aria-hidden="true" />
      <span className="support-banner__ring support-banner__ring--center" aria-hidden="true" />

      <div className="support-banner__content">
        <div className="support-banner__title" id={titleId} role="heading" aria-level="2">Still have questions?</div>

        <div className="support-banner__copy">
          <span className="support-banner__line">Our team is happy to help. Start a live chat using the</span>
          <span className="support-banner__line">
            chat bubble <span className="support-banner__chat-icon" aria-hidden="true" /> in the bottom right, or email us at
          </span>
          <span className="support-banner__line">
            <a href="mailto:support@fillout.com">support{'@'}fillout.com</a>
          </span>
        </div>

        <a className="support-banner__cta" href="mailto:support@fillout.com">Contact us</a>
      </div>
    </div>;
};

## Overview

Adding **custom code** into your Fillout forms can be useful to:

* Inject analytics tracking scripts like Google Tag Manager
* Add HTML widgets like Intercom to the page

If you’re looking to style your form, use the [custom CSS feature](/help/custom-css) instead.

<Info>
  Custom CSS is available on the **Business** and **Enterprise** plans. For more details on pricing, click [**here**](https://www.fillout.com/pricing).
</Info>

## How to add a custom code

<Steps>
  <Step title="Go to the Settings page">
    Click <Icon icon="gear-complex" /> in the top menu followed by `Custom code`.

    <img src="https://mintcdn.com/fillout-005a867b/l4gMey8g6jqUgniw/images/Screenshot2025-10-10at4.42.42PM.png?fit=max&auto=format&n=l4gMey8g6jqUgniw&q=85&s=eda75aa89db11c98ed3618d59167ff65" alt="Screenshot 2025-10-10 at 4.42.42 PM.png" width="2630" height="1437" data-path="images/Screenshot2025-10-10at4.42.42PM.png" />

    <Warning>
      To run a custom code, you’ll first need to connect a [custom domain](/help/custom-domains). Custom code will only run on live forms (not in preview mode) on your custom domain.
    </Warning>
  </Step>

  <Step title="Type your code">
    Enter your code in the field.

    <img src="https://mintcdn.com/fillout-005a867b/l4gMey8g6jqUgniw/images/Screenshot2025-10-10at4.43.59PM.png?fit=max&auto=format&n=l4gMey8g6jqUgniw&q=85&s=08d6a6a2a5b1f8ced1b8c646d6b982ff" alt="Screenshot 2025-10-10 at 4.43.59 PM.png" width="2558" height="793" data-path="images/Screenshot2025-10-10at4.43.59PM.png" />
  </Step>

  <Step title="Publish and share">
    `Publish` your form and try it out!
  </Step>
</Steps>

## Sample use cases

**Facebook pixel**

You can add Facebook pixel tracking to your form either through our [native Facebook pixel integration](/help/meta-pixel), or through custom code:

<Card title="Find the code for injecting a facebook pixel" icon="facebook" iconType="regular" color="#FFC738" horizontal href="https://developers.facebook.com/docs/meta-pixel/get-started" />

**Google Tag Manager**

Google Tag Manager can be a great way to add custom analytics to your form.

<Card title="Find the code for injecting your Tag Manager" icon="google" iconType="regular" color="#FFC738" horizontal href="https://developers.google.com/tag-platform/tag-manager/web" />

## Related articles

<CardGroup cols={3}>
  <Card title="HTML and CSS" icon="display-code" iconType="regular" color="#FFC738" href="/help/html-css">
    Display testimonials, banners, or any static object.
  </Card>

  <Card title="Custom CSS" icon="paint-roller" iconType="regular" color="#FFC738" href="/help/custom-css">
    Style your form and apply changes to forms with the same theme.
  </Card>
</CardGroup>

<SupportBanner />
