substringBefore — GTM Variable Template for String

VARIABLES › STRING

substringBefore EXTENDED String

Direct (.tpl) Apply (.tpl) Add to GTM

Returns the substring before the first occurrence of a delimiter. If the delimiter is not found, it returns the original string.

---

When to Use This

String Manipulation

Transform, clean, and normalize text data for consistent downstream processing.

Extraction

Pull specific values, segments, or patterns from complex data structures.

---

Examples

Get email username▶ Try

INPUT

String To Process: [email protected]
Delimiter: @

OUTPUT

jane.doe

Delimiter not found▶ Try

INPUT

String To Process: no-delimiter-here
Delimiter: @

OUTPUT

no-delimiter-here

---

Live Sandbox

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

substringBefore

Read-Only Try Live

String To Process

💾 The string to process.

Supported formats:
  ✓ String

Delimiter

✂️ The delimiter to search for.

Supported formats:
  ✓ String

Input Setup

Input Function (optional)

⚙️ Optional pre-processing function applied to the input before internal logic (e.g., convert object to string, normalize case). Internal transformations such as case handling will still apply afterward.

Result Handling

Output Function (optional)

⚙️ Optional function to apply to the result before returning it (e.g., str => str + ' €', val => val !== undefined for boolean conversion). Useful for chaining transformations on the output.

String To Process string

💡 Type any text to see the result update live

🎯 Using special value — click input to type instead

Test with:

Falsy undefined null "" empty 0 false NaN

Truthy true 42 "hello" {} empty [] empty {a:1} [1,2,3]

Delimiter string

🔗 Result Handling — Chain Variables

Chain apply-mode variables to the output. Each variable receives the result of the previous one.

substringBefore()

+ Chain another variable

---

Related Variables

Same category: String

→ charAt → collapseWhitespace → concat → countWordsInString → endsWith → extract → extractFirstSegment → extractNumber → fromBase64 → indexOf → left → matchAll → matchRegex → normalizeEmail → normalizePhone → padEnd → padStart → parseJSON → replaceAll → replaceAllWithRegex → replaceFirst → right → safeSplit → search → slice → slugify → split → startsWith → stripAccents → stripHtml → substringAfter → test → toBase64 → toCamelCase → toJsonString → toKebabCase → toLocaleLowerCase → toLocaleUpperCase → toLowerCase → toNumber → toSnakeCase → toStartCase → toString → toStringRepresentation → toUpperCase → toUpperFirst → trim → trimEnd → trimStart → truncate

---

Under the Hood

📜 View Implementation Code

/**
 * Returns the substring before the first occurrence of a delimiter.
 *
 * @param {string} data.src - The string to process.
 * @param {string} data.del - The delimiter to search for.
 * @param {Function|string} [data.out] - Optional output handler.
 *
 * Direct-mode specific parameters:
 * @param {Function} [data.pre] - Optional pre-processor function to transform src.
 *
 * @returns {string|undefined} Returns the substring before the delimiter, the original string if not found, or undefined if input is invalid.
 *
 * @framework ggLowCodeGTMKit
 */
const substringBefore = function(input, delimiter) {
    if (typeof input !== 'string') return undefined;
    if (typeof delimiter !== 'string') return input;

    const index = input.indexOf(delimiter);
    if (index === -1) {
        return input;
    }
    return input.substring(0, index);
};
const safeFunction = fn => typeof fn === 'function' ? fn : x => x;
const out = safeFunction(data.out);
// ===============================================================================
// substringBefore - Direct mode
// ===============================================================================
const applyCast = (castFn, value) => safeFunction(castFn)(value);
const value = applyCast(data.pre, data.src);
return out(substringBefore(value, data.del));
// ===============================================================================
// substringBefore(...) – Apply Mode
// ===============================================================================
/*
return function(value, delimiter) {
   delimiter = data.rp1 ? delimiter : data.del;
   return out(substringBefore(value, delimiter));
};
*/

🧪 View Test Scenarios (4 tests)

✅ '[example] Get email username'
✅ '[example] Delimiter not found'
✅ Empty string returns empty string
✅ Non-string returns undefined