UTM Codes – Everything You Need to Know

Contents

Guide to Implementing UTM Tracking for Forms and Phone Numbers

This step-by-step guide will walk you through creating and implementing a UTM that works properly for both form submissions and phone calls, including all the necessary code and details on where to place it.

Step 1: Create the UTM Code Using a UTM Generator

Create the UTM Link for your campaign using a UTM generator. You’ll need to generate a unique URL for each marketing channel or campaign (e.g., Facebook, Google Ads, email).

Use the Google Campaign URL Builder:

Google UTM Builder

Fill in the following fields:

Campaign Source: Where the traffic is coming from (e.g., facebook, google, email).
Campaign Medium: The type of traffic (e.g., cpc, social, email).
Campaign Name: The specific campaign name (e.g., summer_sale, fall_promotion).
Campaign Term (optional): For paid search campaigns, use the targeted keywords.
Campaign Content (optional): For A/B testing different ads or creatives.

Example UTM URL:

https://www.hanfordfamilydentistry.com?utm_source=facebook&utm_medium=cpc&utm_campaign=fall_promotion

What is it? The Campaign ID is used to track specific ads or campaigns within a broader marketing initiative, especially for paid campaigns like Google Ads.

When should you use it? If you’re running multiple ads under the same campaign (e.g., summer_sale_ad1, summer_sale_ad2), the Campaign ID helps you track which version of the ad is performing better.

Example:

Campaign ID: summer_sale_ad1
Campaign Source: facebook
Campaign Medium: cpc
Campaign Name: summer_sale

Do you need to fill it in? No, it’s optional. You only need to fill it in when you’re dealing with multiple ads or paid campaigns within the same campaign.

Share the Generated UTM URL with the marketing team so they can use it in their campaign links.

Step 2: Set Up the Tracking Phone Numbers in Call Tracking Metrics (CTM)

Team TNT needs to ensure that appropriate phone numbers are created for each UTM campaign in Call Tracking Metrics (CTM).

Log in to CTM and create a unique tracking phone number for each campaign (e.g., a different number for Facebook, Google Ads, etc.).

For example:

Facebook Campaign: 111-222-3456
Google Ads Campaign: 111-222-7890

Ensure these numbers are associated with the correct UTM source (e.g., utm_source=facebook).

Verify the phone numbers are linked to the correct UTM parameters in the CTM dashboard. This will ensure that when users click on the UTM-based campaign links, the correct tracking number is displayed dynamically on the website.

Step 3: Modify Form HTML to Include Hidden UTM Fields

Add hidden fields for UTM parameters to your form to capture UTM data when the form is submitted.

Code to add to your form HTML:

<form class="standard-form" method="post" action="assets/php/validator.php">
    <input type="text" name="name" required="true" placeholder="Name" />
    <input type="email" name="email" required="true" placeholder="Email" />
    <input type="tel" name="phone" required="true" placeholder="Phone Number" />
    <textarea name="message" placeholder="Questions/ Comments"></textarea>

    <!-- Hidden fields for UTM parameters -->
    <input type="hidden" name="utm_source" id="utm_source" />
    <input type="hidden" name="utm_medium" id="utm_medium" />
    <input type="hidden" name="utm_campaign" id="utm_campaign" />
    <input type="hidden" name="utm_term" id="utm_term" />
    <input type="hidden" name="utm_content" id="utm_content" />

    <input type="submit" name="submit" value="Ask Question" class="btn">
    <input type="hidden" name="token_generate" id="token_generate">
    <input type="hidden" name="_subject" value="Have Questions?" />
    <input type="hidden" name="_redirect" value="thanks.html" />
</form>

Explanation: The hidden fields (utm_source, utm_medium, utm_campaign, etc.) will store the UTM parameters from the URL when the user submits the form.

Step 4: Capture UTM Parameters with JavaScript

You need to add JavaScript to your page so that it reads the UTM parameters from the URL and fills the hidden fields.

Place this JavaScript at the bottom of the HTML file, just before the closing </body> tag, or inside a separate JavaScript file linked to your template.

JavaScript code:

<script>
    // Function to get UTM parameters from the URL
    function getUTMParameter(name) {
        const urlParams = new URLSearchParams(window.location.search);
        return urlParams.get(name);
    }

    // Set UTM parameters in hidden fields
    document.getElementById('utm_source').value = getUTMParameter('utm_source') || '';
    document.getElementById('utm_medium').value = getUTMParameter('utm_medium') || '';
    document.getElementById('utm_campaign').value = getUTMParameter('utm_campaign') || '';
    document.getElementById('utm_term').value = getUTMParameter('utm_term') || '';
    document.getElementById('utm_content').value = getUTMParameter('utm_content') || '';
</script>

Explanation: This script reads the UTM parameters from the URL and fills the hidden form fields (utm_source, utm_medium, etc.) with the corresponding values.

Step 5: Modify the PHP Validator to Handle UTM Parameters

Edit validator.php to ensure UTM parameters are included with the form submission and passed to the external service via cURL.

PHP code to add in validator.php:

<?php
date_default_timezone_set('America/Los_Angeles');

if (isset($_POST['submit'])) {
    $url = 'https://www.google.com/recaptcha/api/siteverify';
    $secret = '6LexYtYmAAAAAKf7d9CTAW-z5hm5yWropoMzz8VA';
    $response = $_POST['token_generate'];
    $remoteip = $_SERVER['REMOTE_ADDR'];

    $request = file_get_contents($url.'?secret='.$secret.'&response='.$response);
    $result = json_decode($request);

    $adderURL = 'https://tnt-adder.herokuapp.com/submit/c6fd9a17-9189-44a5-a08e-b6c1e03b2dc4';

    $referrer = $_SERVER['HTTP_REFERER'];
    $userAgent = $_SERVER['HTTP_USER_AGENT'];

    if ($result->success == true AND $result->score >= 0.5) {
        // Capture UTM parameters
        $utm_source = $_POST['utm_source'];
        $utm_medium = $_POST['utm_medium'];
        $utm_campaign = $_POST['utm_campaign'];
        $utm_term = $_POST['utm_term'];
        $utm_content = $_POST['utm_content'];

        // Format the submission data
        $submission = $_POST;
        unset($submission['token_generate']);
        $submission_formatted = array();
        foreach ($submission as $key => $value) {
            if (is_array($value)) {
                $string_value = implode(', ', $value);
                $submission_formatted[$key] = $string_value;
            } else {
                $submission_formatted[$key] = $value;
            }
        }

        // Add UTM parameters to the formatted submission
        $submission_formatted['utm_source'] = $utm_source;
        $submission_formatted['utm_medium'] = $utm_medium;
        $submission_formatted['utm_campaign'] = $utm_campaign;
        $submission_formatted['utm_term'] = $utm_term;
        $submission_formatted['utm_content'] = $utm_content;

        // Open cURL connection to send data
        $ch = curl_init($adderURL);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        curl_setopt($ch, CURLOPT_POST, true);
        curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        curl_setopt($ch, CURLOPT_REFERER, $referrer);
        curl_setopt($ch, CURLOPT_USERAGENT, $userAgent);
        curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query($submission_formatted));

        // Execute the cURL request
        $adderResponse = curl_exec($ch);
        curl_close($ch);

        // Output the response
        echo $adderResponse;

        // Handle redirect if a redirect link is found in the response
        preg_match_all('/<a[^>]+href=([\'"])(?<href>.+?)\1[^>]*>/i', $adderResponse, $result);
        if (!empty($result)) {
            $redirect = $result['href'][0];
            header('Location: '.$redirect);
        }
    } else {
        echo "<p>CAPTCHA failed!</p>";
    }
}
?>

Explanation: The PHP script captures the UTM parameters from the form submission and adds them to the data being sent to the external service. It also processes the form data and handles reCAPTCHA validation.

Step 6: Implement the CTM Script for Dynamic Phone Number Swapping

Add the Call Tracking Metrics (CTM) script to your page to dynamically change the phone number based on UTM parameters.

Code to add to the <head> section or right before the closing </body> tag:

<script async src="//437647.tctm.xyz/t.js"></script>

Explanation: This script reads the UTM parameters from the URL and dynamically updates the phone number on the page based on the campaign. It’s crucial for attributing phone calls to the correct source.

Step 7: Test the Setup

Test the entire process: Create a campaign link with UTM parameters, such as:

https://www.hanfordfamilydentistry.com?utm_source=facebook&utm_medium=cpc&utm_campaign=fall_promotion

Submit a form while visiting the page with the UTM parameters in the URL.

Check the backend: Ensure the UTM parameters are included with the form submission and sent to the external service.

Verify phone number tracking: Make sure the correct phone number is displayed based on the UTM parameters.

Summary

By following these steps, you will:

Create UTM links for tracking campaigns.
Set up tracking phone numbers in CTM for each UTM campaign.
Capture and submit UTM parameters with form submissions.
Dynamically swap the phone number on the site based on UTM parameters.
Ensure proper tracking and attribution for both forms and phone calls.

Updated on November 16, 2025

Was this article helpful?

Yes No