Skip to content

toKebabCase — GTM Variable Template for String

VARIABLES › STRING
toKebabCase CORE String

Converts a string to kebab-case format. Returns undefined if the input is not a valid string.


When to Use This

String Manipulation

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

Type Conversion

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

Formatting

Normalize casing, spacing, encoding, and presentation of data values.


Examples

Spaces to kebab-case
INPUT
String To Convert: hello world test
OUTPUT
hello-world-test
Underscores to kebab-case
INPUT
String To Convert: hello_world_test
OUTPUT
hello-world-test
Non-string input returns undefined
INPUT
String To Convert: 12345
OUTPUT
undefined

GTM Configuration

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

toKebabCase
String To Convert
💾 The string to convert to kebab-case format.

Supported formats:
  ✓ String
Input Setup
Input Function (optional)
⚙️ Optional pre-processing function applied to the input before internal logic (e.g., normalize case, clean string). Internal transformations such as kebab-case conversion will still apply afterward.
Result Handling
Output Function (optional)
⚙️ Optional function to apply to the result before returning it (e.g., str => str + '-suffix', val => val.replace(/^-/, '') to remove leading hyphens). Useful for chaining transformations on the output.
String To Convert string
💡 Type any text to see the result update live
🎯 Using special value — click input to type instead
Test with:
Falsy
Truthy
toKebabCase()


Under the Hood

📜 View Implementation Code
/**
* Converts a string to kebab-case format.
* 
* @param {string} data.src - The string to convert to kebab-case.
* @param {Function|string} [data.out] - Optional output handler: function to transform result or string with format.
*
* Direct-mode specific parameters:
* @param {Function} [data.pre] - Optional pre-processor function to transform src before conversion.
* 
* @returns {string|undefined} The string in kebab-case format, or undefined if the input is not a valid string.
*
* @framework ggLowCodeGTMKit
*/
const toKebabCase = function(string) {
   if (typeof string === 'string') {
       const pattern = "[_\\s-]+";
       const replacement = '-';
       
       const replaceAllWithRegex = function(input, pattern, replacement) {
           if (typeof input !== 'string' || typeof pattern !== 'string' || typeof replacement !== 'string') {
               return input;
           } 
           let result = input;
           let lastIndex = 0;
           
           while (lastIndex < result.length) {
               const remainingStr = result.substring(lastIndex);
               const matchObj = remainingStr.match(pattern);
               if (matchObj === null) {
                   break;
               }
           
               const actualMatchIndex = lastIndex + (matchObj.index || 0);
               
               result = result.substring(0, actualMatchIndex) + 
                        replacement + 
                        result.substring(actualMatchIndex + matchObj[0].length);
               lastIndex = actualMatchIndex + replacement.length;
           }
           return result;
       }; 
       
       let result = replaceAllWithRegex(string, pattern, replacement);
       
       result = result.toLowerCase();
       return result;
   }
   return undefined;
};
const safeFunction = fn => typeof fn === 'function' ? fn : x => x;
const out = safeFunction(data.out);
// ===============================================================================
// toKebabCase - Direct mode
// ===============================================================================
const applyCast = (castFn, value) => safeFunction(castFn)(value);
const value = applyCast(data.pre, data.src);
return out(toKebabCase(value));

// ===============================================================================
// toKebabCase() – Apply Mode
// ===============================================================================
/*
return function(value) {
  return out(toKebabCase(value));
};
*/
🧪 View Test Scenarios (5 tests)
✅ '[example] Spaces to kebab-case'
✅ '[example] Underscores to kebab-case'
✅ Mixed case string with multiple separators - should convert to kebab-case
✅ Already in kebab-case - should remain unchanged
✅ '[example] Non-string input returns undefined'