Skip to content
You Don't Know GA

⚡ URL › Transformer Generator — GTM Variable Template for URL

VARIABLES › URL
⚡ URL › Transformer EXTENDED URL
Direct (.tpl)

Transforms a URL by applying functions to its search and hash parameters independently, then reassembles the result.

When to Use This

Section titled “When to Use This”
URL Processing

Parse, build, decode, and manipulate URLs and query parameters.

Type Conversion

Safely convert between data types — strings, numbers, booleans, arrays, objects.

Examples

Section titled “Examples”
Remove fbclid from URL
INPUT
URL String: https://example.com/page?utm_source=fb&fbclid=abc123
Search Param Functions: [omitParamsFromString(fbclid)]
OUTPUT
https://example.com/page?utm_source=fb
Add UTM params to URL
INPUT
URL String: https://example.com/page?page=1
Search Param Functions: [assignParamsToString(utm_source=website&utm_medium=cpc)]
OUTPUT
https://example.com/page?page=1&utm_source=website&utm_medium=cpc
Transform both search and hash
INPUT
URL String: https://example.com/page?utm_source=fb&fbclid=abc#debug=true&view=full
Search Param Functions: [omit fbclid]
Hash Param Functions: [omit debug]
OUTPUT
https://example.com/page?utm_source=fb#view=full
Passthrough with no functions
INPUT
URL String: https://example.com/page?q=1#top
Search Param Functions: (none)
Hash Param Functions: (none)
OUTPUT
https://example.com/page?q=1#top

GTM Configuration

Section titled “GTM Configuration”

This is what you'll see when you open this variable in Google Tag Manager. Hover the icons for details.

Read-only Preview
⚡ URL › Transformer
URL String
💾 The full URL to transform (e.g., "https://example.com/page?utm_source=fb&fbclid=abc#section").

Supported formats:
  ✓ Full URL: https://example.com/page?q=1#top
  ✓ Relative URL: /page?q=1#top
Search Param Functions
📋 Apply-mode functions to run on the search parameters (?key=value). Each function receives the search string (e.g. "?utm_source=fb&fbclid=abc") and must return a transformed search string. Functions are applied sequentially — each receives the output of the previous one.

Leave empty to pass search params through unchanged.
⊖
Hash Param Functions
📋 Apply-mode functions to run on the hash parameters (#key=value). Each function receives the hash string (e.g. "#section=intro") and must return a transformed hash string. Functions are applied sequentially.

Leave empty to pass hash params through unchanged.
⊖
Input Setup
Input Function (optional)
⚙️ Optional pre-processing function applied to the URL string before parsing (e.g., trim whitespace, normalize protocol).
Result Handling
Output Function (optional)
⚙️ Optional function to apply to the reassembled URL before returning it (e.g., encode, lowercase hostname).
Section titled “Related Variables”

Same category: URL

→ assignParamsToString → buildUrlFromParts → completeUrl → decodeUri → decodeUriComponent → encodeURIComponent → encodeUri → extractHash → extractHashParams → extractHost → extractHostname → extractOrigin → extractPasword → extractPathname → extractPort → extractProtocol → extractSearch → extractSearchParams → extractSegmentByIndex → extractUserName → hasFragment → hasParameterWithValue → hasQueryString → omitParamsFromString → parseUrlComponents → pickParamsFromString → stringToPath

Under the Hood

Section titled “Under the Hood”
📜 View Implementation Code
/**
 * Transforms a URL by applying functions to its search and hash parameters
 * independently, then reassembles the result into a clean URL string.
 *
 * @param {string} data.src - The full URL to transform.
 * @param {Array<{fn: Function}>} [data.sfn] - Apply-functions for search params, applied sequentially.
 * @param {Array<{fn: Function}>} [data.hfn] - Apply-functions for hash params, applied sequentially.
 * @param {Function|string} [data.out] - Optional output handler.
 *
 * Direct-mode specific parameters:
 * @param {Function} [data.pre] - Optional pre-processor function to transform src before parsing.
 *
 * @returns {string} The reassembled URL with transformed search and hash parameters.
 *
 * @framework ggLowCodeGTMKit
 */
const parseUrl = require('parseUrl');


const applyFnPipeline = function(input, fnTable) {
    if (!fnTable || !fnTable.length) return input;
    let result = input;
    for (let i = 0; i < fnTable.length; i++) {
        const fn = fnTable[i].fn;
        if (typeof fn === 'function') {
            result = fn(result);
        }
    }
    return result;
};


const reassembleUrl = function(parsed, search, hash) {
    let url = '';


    if (parsed.protocol) {
        url += parsed.protocol + '//';
    }


    if (parsed.username) {
        url += parsed.username;
        if (parsed.password) {
            url += ':' + parsed.password;
        }
        url += '@';
    }


    if (parsed.hostname) {
        url += parsed.hostname;
        if (parsed.port) {
            url += ':' + parsed.port;
        }
    }


    if (parsed.pathname) {
        url += parsed.pathname;
    }


    if (search) {
        url += search;
    }


    if (hash) {
        url += hash;
    }


    return url;
};


const transformUrl = function(url, searchFns, hashFns) {
    const parsed = parseUrl(url);
    if (!parsed) return url;


    const search = applyFnPipeline(parsed.search || '', searchFns);
    const hash = applyFnPipeline(parsed.hash || '', hashFns);


    return reassembleUrl(parsed, search, hash);
};


const safeFunction = fn => typeof fn === 'function' ? fn : x => x;
const out = safeFunction(data.out);
// ===============================================================================
// ⚡ URL › Transformer - Direct mode
// ===============================================================================
const applyCast = (castFn, value) => safeFunction(castFn)(value);
const value = applyCast(data.pre, data.src);
return out(transformUrl(value, data.sfn, data.hfn));
// ===============================================================================
// ⚡ URL › Transformer – Apply Mode
// ===============================================================================
/*
return function(url) {
    return out(transformUrl(url, data.sfn, data.hfn));
};
*/
🧪 View Test Scenarios (7 tests)
✅ '[example] Remove fbclid from URL'
✅ '[example] Add UTM params to URL'
✅ '[example] Transform both search and hash'
✅ '[example] Passthrough with no functions'
✅ URL with no search params - functions still apply
✅ Chained search functions (pipeline)
✅ URL with port and credentials preserved