Build UTM-tagged campaign URLs to track your marketing efforts in Google Analytics.
UTM (Urchin Tracking Module) parameters are tags added to your URL. When someone clicks a tagged link, the parameters are sent to Google Analytics so you can identify which campaigns drive traffic.
| Parameter | Purpose |
|---|---|
utm_source | Traffic source (google, newsletter) |
utm_medium | Marketing medium (cpc, email) |
utm_campaign | Campaign name |
utm_term | Paid keywords |
utm_content | Ad variation / link ID |
UTM parameters (Urchin Tracking Module) are short text tags appended to a URL. When a visitor clicks a link containing UTM tags, those tags are sent to your analytics platform — most commonly Google Analytics — allowing you to see exactly which campaigns, channels, and creatives drive traffic and conversions.
There are five standard UTM parameters defined by Google Analytics:
Identifies where the traffic comes from. Examples: google, facebook, newsletter, partner_site. Think of this as the name of the referring website or platform.
Describes the marketing medium or channel type. Examples: cpc (cost-per-click), email, social, referral, display. Stick to a small, consistent set of values.
The name of the specific campaign, promotion, or initiative. Examples: spring_sale, product_launch_2025, black_friday. Use descriptive, human-readable names.
Used for paid search keywords. If you are running Google Ads, this captures the keyword that triggered your ad. Example: running+shoes.
Differentiates similar content or links within the same campaign. Use it to A/B-test ad creatives: banner_v1 vs. banner_v2, or header_link vs. footer_link.
UTM parameters are case-sensitive. utm_source=Google and utm_source=google appear as two separate sources in your reports. Always use lowercase to keep your data clean and avoid fragmented reporting.
Spaces in URLs are encoded as %20 or +, which makes reports harder to read. Use underscores (spring_sale) or hyphens (spring-sale) instead. Pick one convention and stick to it across your entire organization.
Maintain a shared spreadsheet or wiki page listing your approved values for source, medium, and campaign. This prevents inconsistencies like one team using fb while another uses facebook. A small investment in documentation saves hours of data cleanup later.
Campaign names like q2_2025_email_promo_v3 tell you what you need to know at a glance. Avoid cryptic codes like c47x — your future self (and your colleagues) will thank you when reviewing reports months later.
UTM parameters should only be used on links that bring traffic to your site from external sources. Using them on internal links (e.g., navigation, sidebar) overwrites the original source attribution and corrupts your analytics data. For internal campaign tracking, use events or content grouping instead.
Always click your generated URL to verify it loads the correct page. Check your analytics real-time view to confirm the parameters appear correctly. A broken link or misspelled parameter can waste your entire campaign budget.
Once visitors start clicking your UTM-tagged links, the data flows into Google Analytics automatically. Here is where to find it:
UTM parameters are short text tags you add to the end of a URL. They tell your analytics tool (like Google Analytics) where a visitor came from, which campaign brought them, and what link they clicked. For example, adding ?utm_source=newsletter&utm_medium=email&utm_campaign=spring_sale to a URL lets you track how many visitors came from that specific email campaign.
Yes. Google Analytics treats utm_source=Facebook and utm_source=facebook as two completely different sources. Always use lowercase to prevent your data from being split across multiple entries, making analysis harder and less accurate.
No. UTM parameters do not affect your search engine rankings. Google's crawler ignores UTM parameters when evaluating page content and relevance. However, it is best practice to use a canonical tag on your pages (which most CMS platforms do by default) to ensure search engines consolidate any duplicate URLs that differ only by query parameters.
UTM parameters are a widely adopted standard. Google Analytics (both Universal Analytics and GA4), Matomo, Adobe Analytics, Mixpanel, HubSpot, and most other analytics platforms recognize and process UTM parameters automatically. If your platform supports campaign tracking via URL parameters, UTM tags will work.
At minimum, use the three required parameters: utm_source, utm_medium, and utm_campaign. Add utm_term if you are running paid search campaigns, and utm_content if you need to differentiate between multiple links in the same campaign (e.g., A/B testing ad creatives). Using all five gives you the most granular data, but the first three cover most use cases.
No. UTM parameters should only be used on links that bring traffic to your site from external sources. Using UTM tags on internal links (like navigation menus or cross-page promotions) will overwrite the visitor's original source attribution, making it impossible to know how they actually found your site. Use event tracking or content groupings for internal campaigns instead.
The UTM builder handles this automatically. If your URL already contains query parameters (like ?page=2), the UTM tags are appended with & instead of ?. For example: https://example.com/products?page=2&utm_source=google&utm_medium=cpc. Your existing parameters remain untouched.
Most modern browsers support URLs up to 2,048 characters or more. However, some email clients, social media platforms, and older systems may truncate very long URLs. This tool will warn you if your generated URL exceeds 2,048 characters. If that happens, consider shortening your parameter values or using a URL shortener for distribution.
UTM parameters are simply part of the URL text — they are not registered or locked anywhere. You can edit them at any time by modifying the URL string. However, once visitors have clicked a tagged link, the data is already recorded in your analytics platform. Changing the URL after distribution only affects future clicks, not historical data.
Use MapMyVisitors to see where your visitors are geographically, and UTM parameters in Google Analytics to see how they found your site. Together, you can answer questions like "Which countries responded best to my email campaign?" or "Are my social media ads reaching the right geographic markets?"
Here are practical code examples showing how to use UTM-tagged links in your marketing channels. Click the copy button to grab any snippet instantly.
The simplest way — a standard anchor tag with UTM parameters:
<a href="https://example.com/sale?utm_source=newsletter&utm_medium=email&utm_campaign=spring_sale">
Shop the Spring Sale
</a>When building email templates, tag every outbound link:
https://example.com/pricing?utm_source=mailchimp&utm_medium=email&utm_campaign=onboarding_drip&utm_content=cta_buttonTrack each social platform and post separately:
https://example.com/blog/new-feature?utm_source=linkedin&utm_medium=social&utm_campaign=feature_launch&utm_content=carousel_postFor paid search, include the keyword term parameter:
https://example.com/landing?utm_source=google&utm_medium=cpc&utm_campaign=brand_awareness&utm_term=project+management+tool&utm_content=headline_v2Even offline campaigns benefit from UTM tracking — add parameters to the URL behind a QR code:
https://example.com/promo?utm_source=qr_code&utm_medium=print&utm_campaign=conference_2025&utm_content=booth_flyerWe built this UTM builder following a structured, phase-by-phase implementation plan — from routing and HTML structure through JavaScript logic, styling, SEO content, and deployment. Below is a transparent look at the methodology, the decisions we made, and the checks we put in place. We believe tools should be built with care, and users deserve to know what goes on under the hood.
The tool runs on our custom PHP engine framework. No backend processing is needed — the page is served as a static template through our SimpleTrait routing system, which automatically maps URL paths to template files. The blog layout wrapper provides the shared header, footer, Bootstrap 5.3 CSS, and analytics. No new controllers, no database queries, no server-side form handling. The result is a fast, lightweight page that loads in a single HTTP request with zero API dependencies.
The entire URL building logic runs in your browser using vanilla JavaScript — no jQuery, no external libraries, no data ever leaves your machine. We use the native URL() constructor and URLSearchParams API to parse and build URLs. This means the tool correctly handles edge cases that string concatenation would miss:
?page=2) — UTM tags are appended with &, not ?#section) — the fragment is preserved at the end:8080) — handled natively by the URL parserWe implemented multiple layers of validation, each designed to catch a specific class of error:
Four fields are mandatory: URL, source, medium, and campaign. Each uses Bootstrap's .is-invalid state with an inline error message — no alert boxes, no page reloads. Validation clears automatically as you type.
The URL is parsed through new URL() inside a try/catch. If the parser throws, the field is marked invalid. We also auto-prepend https:// when no protocol is provided, showing an informational notice rather than a false positive green checkmark.
We explicitly reject javascript:, data:, file:, and ftp: URIs. These protocols have no legitimate use in UTM tracking and could be misused for injection attacks.
If the URL already contains UTM parameters, we strip them and replace with your new values — and show an explicit warning so you know it happened. No silent overwrites.
Generated URLs exceeding 2,048 characters trigger a visible warning. While modern browsers handle longer URLs, many email clients and social platforms silently truncate them.
The parameter breakdown table shows both the original value and the percent-encoded version side by side. If they differ (e.g., spaces become %20), both are shown so you can verify correctness before distributing.
After the first URL generation, the output updates live as you edit any field. We debounce input events by 150ms to prevent excessive DOM updates during rapid typing. This gives you instant feedback without performance penalties — the URL regenerates, the parameter table redraws, and warnings update in real time.
We use the native navigator.clipboard.writeText() API with an execCommand('copy') fallback for older browsers and non-HTTPS contexts. Every copy action produces visual feedback: a green flash animation on the URL field, a "Copied!" confirmation with aria-live="polite" so screen readers announce it too. Code example blocks have their own copy buttons that switch to a checkmark icon for 2 seconds after copying.
Generated URLs are stored in your browser's localStorage (key: mmv_utm_history) — never on our servers. Each entry records the URL, a timestamp, and the campaign name as a label. The history holds up to 10 entries with FIFO eviction, deduplicates by URL, and supports individual deletion or full clearing. Click any history entry to copy it instantly.
Every form field has a <label> with a for attribute, aria-describedby linking to helper text, and inline error messages that appear as Bootstrap's .invalid-feedback elements. Touch targets are at least 44×44px. Keyboard navigation works throughout — all buttons have visible :focus-visible styles. The FAQ uses native <details>/<summary> elements, which are keyboard-accessible by default with no JavaScript required.
The page includes two JSON-LD schema blocks: a WebApplication schema for the tool itself (with free pricing) and a FAQPage schema for rich FAQ results in Google. We set canonical URLs, hreflang tags for English/Spanish localization, Open Graph and Twitter Card meta tags, and a robots: index, follow directive. The page is included in our XML sitemap with hreflang cross-references.
The layout uses Bootstrap 5.3's grid system — the form and info panel sit side by side on desktop (7/5 column split) and stack vertically on mobile. On smaller screens, the copy bar becomes sticky at the bottom for easy access. We added @media print rules that hide the form and show only the generated URL. Dark mode is supported via prefers-color-scheme: dark with adjusted colors for code highlights and UI elements.
Zero data is sent to any server. No analytics events are fired from the tool itself. No cookies are set. The URL you build stays entirely in your browser — in the form fields, in the output area, and optionally in localStorage. If you clear your browser data, every trace is gone. We built it this way on purpose: a marketing tool should not itself be a tracking concern.
Create a free visitor map widget and visualize your UTM-tagged traffic on a real-time geographic map.
Create Your Free Widget