Overview
Introduction
Sharing the same link across an email newsletter, a paid ad, and a social post looks identical in analytics unless each version carries a way to tell them apart - that's what UTM parameters are for, and getting them wrong (typos, inconsistent casing, missing a parameter) quietly breaks attribution instead of failing loudly.
This tool builds a correctly formatted, tagged URL from a base link and campaign fields, so every link you generate for a campaign uses the same parameter names and encoding.
What Is UTM Builder?
A URL generator that appends the five standard UTM (Urchin Tracking Module) query parameters, utm_source, utm_medium, utm_campaign, utm_term, and utm_content, to a base website URL you provide.
Only fields you actually fill in get appended; leaving utm_term or utm_content blank produces a shorter, cleaner URL rather than an empty parameter.
How UTM Builder Works
The base URL is parsed with the browser's native URL constructor, which both validates it and gives access to its existing query string.
Each non-empty UTM field is set on that query string via URLSearchParams, which handles proper URL-encoding automatically (spaces, ampersands, and other special characters in campaign names come out correctly encoded), then the parameters are re-attached to produce the final URL.
When To Use UTM Builder
Before launching an email campaign, paid ad, or social post, to generate a consistent, correctly encoded tracking link instead of hand-typing query parameters.
When standardizing how a team tags links, since typing the same source/medium naming conventions here avoids the inconsistent capitalization or spelling that splits a single channel's traffic across several rows in a report.
Often used alongside UTM Parser.
Features
Advantages
- Handles URL-encoding automatically, so spaces or special characters in a campaign name don't produce a broken link.
- Overwrites existing UTM parameters instead of duplicating them, so re-tagging a link that already has UTM params still produces a single clean URL.
- Only appends parameters that actually have a value, keeping the generated URL as short as the campaign needs it to be.
Limitations
- This tool can't verify that the source/medium/campaign values you enter match what your analytics platform's dashboards expect; consistent naming is on you.
- It only validates that the base URL is well-formed, not that the page it points to actually exists.
Examples
Best Practices & Notes
Best Practices
- Pick a fixed, lowercase naming convention for source and medium (e.g. always "email" not sometimes "Email" or "e-mail") since analytics platforms treat different casings as different values.
- Use utm_content to distinguish between multiple links pointing to the same destination from the same campaign, like two different call-to-action buttons in the same email.
Developer Notes
buildUtmUrl() only appends a parameter when its trimmed value is non-empty, and calls URLSearchParams.set() rather than append() so re-running it on an already-tagged URL overwrites in place instead of duplicating keys.
UTM Builder Use Cases
- Generating a tracking link for a specific email newsletter send
- Tagging a paid ad's destination URL to separate its traffic from organic traffic in analytics
- Building distinct links for multiple placements of the same campaign (e.g. a homepage banner versus a footer link) to compare click performance
Common Mistakes
- Using inconsistent source/medium naming across campaigns ("newsletter" one month, "Newsletter" or "email-newsletter" the next), which splits what should be one channel's traffic across multiple report rows.
- Tagging an internal link (e.g. a link from one page on your own site to another), which resets the visitor's session attribution and makes it look like they arrived from a new campaign instead of continuing to browse.
Tips
- Keep a shared spreadsheet or naming doc of the exact source/medium/campaign values your team uses, since a typo here is invisible until you notice traffic missing from a report.