What is a dataLayer push?

The dataLayer is a JavaScript array (window.dataLayer) that GTM reads to capture information. Pushing {event: 'xxx', ...params} to dataLayer is how you send custom events to GTM, which then fire tags based on triggers you configure.

How do I create the dataLayer variables?

For each parameter you push, create a matching GTM Variable: Variables → New → Data Layer Variable → set Data Layer Variable Name to the param key (e.g. 'value'). Then you can reference {{value}} in tags and triggers.

What naming rules apply to events and parameters?

Both event and parameter names must start with a letter and contain only letters, numbers, and underscores. Max 40 characters. Max 25 parameters per push (GTM warning).

What extra features does this tool have compared to others?

(1) dataLayer.push code generation. (2) Custom event trigger description (JSON). (3) GTM variable declarations. (4) Event presets (page_view, scroll, click, form_submit, purchase). (5) JSON preview. (6) Event + param validation. (7) Copy each snippet. (8) Stats — param count. (9) History (localStorage, last 20). (10) Shareable URL.

SEO Runs in your browser

GTM & dataLayer Helper

Generate Google Tag Manager dataLayer code snippets. dataLayer.push code, custom event trigger config, GTM variable declarations, event presets (page_view, scroll, click, form_submit, purchase), JSON preview, validation, copy. History (localStorage), shareable URL. 100% client-side.

100% Private Works Offline Instant

Event name *

Letters, numbers, underscores. Max 40 chars.

Apply preset

Parameters (JSON)

3 active parameters (max 25).

purchase: Ecommerce purchase event. Send with transaction_id, value, currency, items.

Recommended params: transaction_id, value, currency, items

dataLayer.push code

dataLayer.push({
  event: 'purchase',
  value: 99.99,
  currency: "USD",
  transaction_id: "T-12345"
});

dataLayer + GTM container init

<script>
  window.dataLayer = window.dataLayer || [];
  (function(w,d,s,l,i){
    w[l]=w[l]||[];
    w[l].push({'gtm.start': new Date().getTime(), event:'gtm.js'});
    var f=d.getElementsByTagName(s)[0],
        j=d.createElement(s),
        dl=l!='dataLayer'?'&l='+l:'';
    j.async=true;
    j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;
    f.parentNode.insertBefore(j,f);
  })(window,document,'script','dataLayer','GTM-XXXXXXX');
</script>

Replace GTM-XXXXXXX with your container ID.

Custom event trigger (JSON config)

{
  "triggerName": "purchase Trigger",
  "type": "CUSTOM_EVENT",
  "eventName": "purchase",
  "triggerCondition": "Event equals purchase",
  "firingFilters": [
    {
      "variable": "value",
      "condition": "equals",
      "value": "99.99"
    },
    {
      "variable": "currency",
      "condition": "equals",
      "value": "USD"
    },
    {
      "variable": "transaction_id",
      "condition": "equals",
      "value": "T-12345"
    }
  ],
  "notes": "Create this trigger in GTM → Triggers → New → Custom Event. Set the event name to match exactly."
}

In GTM: Triggers → New → Custom Event → use the event name above.

GTM variable declarations

// Reads dataLayer variable "value". In GTM: Variables → New → Data Layer Variable → Data Layer Variable Name = value
// Variable type: dataLayer
// Variable name: value
// Data Layer Variable Name: value

// Reads dataLayer variable "currency". In GTM: Variables → New → Data Layer Variable → Data Layer Variable Name = currency
// Variable type: dataLayer
// Variable name: currency
// Data Layer Variable Name: currency

// Reads dataLayer variable "transaction_id". In GTM: Variables → New → Data Layer Variable → Data Layer Variable Name = transaction_id
// Variable type: dataLayer
// Variable name: transaction_id
// Data Layer Variable Name: transaction_id

JSON preview

{
  "event": "purchase",
  "value": 99.99,
  "currency": "USD",
  "transaction_id": "T-12345"
}

Event presets reference

GTM docs dataLayer docs

page_view

Virtual pageview (SPA route change). GTM's built-in Page View trigger fires on this.

Recommended params: page_location, page_referrer, page_title

scroll

Custom scroll-depth event (e.g. 25%, 50%, 75%, 90%).

Recommended params: percent_scrolled

click

Custom click event for outbound links or in-page CTAs.

Recommended params: link_id, link_url, link_domain, link_classes

form_submit

Form submission event. Pair with a form_id or form_name variable.

Recommended params: form_id, form_name, form_destination

purchase

Ecommerce purchase event. Send with transaction_id, value, currency, items.

Recommended params: transaction_id, value, currency, items

Privacy: Code generation is pure string manipulation. History is stored in localStorage on this device only.

How to use

Enter your input in the tool above.
Adjust any options to your preference.
Use the Copy or Download buttons to save the result.
Everything happens locally — your data never leaves your browser.

All tools