GA4 Event Builder
Pick or type an event name, add parameters, and copy a gtag call plus a matching dataLayer push with the name already cleaned up.
Runs in your browser. Nothing you enter is uploaded.
What it does
Most broken GA4 events come down to the name: a capital letter, a space, or a hyphen that splits one event into three rows in your reports. This builder checks the name against the lowercase, underscore-only pattern while you type, suggests a cleaned version, and always writes the cleaned version into the code.
It suits a marketer who needs to hand a developer an exact snippet, or a site owner wiring a sign-up button without Tag Manager. You get two formats from the same inputs: a direct gtag() call for sites using the Google tag, and a dataLayer.push() for GTM setups.
How to use it
- 1
Optionally choose a starting point from the Common GA4 events dropdown (page_view, sign_up, purchase, add_to_cart and others); it fills the name, category and label.
- 2
Edit the Event name field and read any warnings underneath, including the Suggested cleaned name.
- 3
Set Event category and Event label, and enter a number in Value (optional) if the action has a monetary or score value.
- 4
Check the GA4 Dashboard Preview badge reads Valid rather than Needs fix.
- 5
Copy the output with Copy snippets, which copies the gtag call and the dataLayer push together.
What you get
A preview card listing the event name and each parameter, a gtag('event', ...) snippet, and a window.dataLayer.push() snippet using the same values. Empty fields are left out of both.
When to use it
- Tracking a form submission
- Start from the sign_up or generate_lead preset, change the label to the form name, and paste the gtag call into the form success handler.
- Briefing a developer precisely
- Copy both snippets into a ticket so the developer implements the exact event name and parameters you plan to report on.
- Fixing a messy event name
- Type the name your team has been using, such as "Add To Cart", and read the warnings plus the suggested add_to_cart replacement.
- Feeding a GTM trigger
- Use the dataLayer push version so a Custom Event trigger in Tag Manager can fire on the event key.
Example
Input
Preset: purchase (fills category ecommerce, label order). Value: 49.99
Output
gtag('event', 'purchase', {
event_category: 'ecommerce',
event_label: 'order',
value: 49.99
});
window.dataLayer = window.dataLayer || [];
dataLayer.push({
"event": "purchase",
"event_category": "ecommerce",
"event_label": "order",
"value": 49.99
});The value field is written as a number, not a string. If you type "Purchase Complete" as the name instead, the tool flags the space and uppercase letters and writes purchase_complete into both snippets.
Tips
- In GA4, event_category and event_label are ordinary custom parameters, so register them as custom dimensions in Admin before expecting to see them in standard reports.
- GA4's own ecommerce reports expect extra parameters on purchase, such as currency and transaction_id, which this builder does not add. Append them to the generated object by hand.
- Pick one naming convention for the whole property and reuse the exact event name everywhere; sign_up and signup are counted as two different events.
- Test the snippet with GA4 DebugView before shipping, since the builder validates the name format but cannot confirm the tag actually fires on your page.
Questions
Why does the builder reject capital letters in GA4 event names?
GA4 treats event names as case-sensitive, so SignUp and sign_up become separate events. The tool flags uppercase, spaces and special characters and suggests a lowercase, underscore-only version that starts with a letter.
Should I use the gtag snippet or the dataLayer push?
Use gtag() if the Google tag (gtag.js) is installed directly on the page. Use dataLayer.push() if you run Google Tag Manager and want a Custom Event trigger to pick the event up.
Does generating the snippet send a test hit to my GA4 property?
No. The builder only assembles text in your browser. Nothing is sent to Google until you paste the code into a page that loads your tag.
Can I add parameters other than category, label and value?
The form has fields for those three only. The output is plain JavaScript, so you can add more key-value pairs to the object after copying it.