directory changes and restructuring

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

custom-skills/21-gtm-manager/code/docs/form_tracking.md

@@ -0,0 +1,157 @@
+# Form Tracking Reference
+
+## GA4 Form Events
+
+### form_start
+Fires on first interaction with form field.
+
+```javascript
+dataLayer.push({
+  event: "form_start",
+  form_id: "contact-form",
+  form_name: "Contact Us",
+  form_destination: "/submit-contact"
+});
+```
+
+### form_submit
+Fires on successful form submission.
+
+```javascript
+dataLayer.push({
+  event: "form_submit",
+  form_id: "contact-form",
+  form_name: "Contact Us",
+  form_destination: "/submit-contact",
+  form_submit_text: "Send Message"
+});
+```
+
+### generate_lead
+Fires when form generates a qualified lead.
+
+```javascript
+dataLayer.push({
+  event: "generate_lead",
+  currency: "USD",
+  value: 100,  // Estimated lead value
+  form_id: "quote-request"
+});
+```
+
+## Form Field Events (Custom)
+
+### field_focus
+```javascript
+dataLayer.push({
+  event: "field_focus",
+  form_id: "signup-form",
+  field_name: "email",
+  field_type: "email"
+});
+```
+
+### field_complete
+```javascript
+dataLayer.push({
+  event: "field_complete",
+  form_id: "signup-form",
+  field_name: "email",
+  field_type: "email",
+  is_valid: true
+});
+```
+
+### field_error
+```javascript
+dataLayer.push({
+  event: "field_error",
+  form_id: "signup-form",
+  field_name: "email",
+  error_message: "Invalid email format"
+});
+```
+
+## Form Abandonment Tracking
+
+### Detecting Abandonment
+Track when user leaves form without submitting:
+
+```javascript
+// Track form start
+let formStarted = false;
+document.querySelectorAll('form input, form select, form textarea')
+  .forEach(field => {
+    field.addEventListener('focus', function() {
+      if (!formStarted) {
+        formStarted = true;
+        dataLayer.push({ event: 'form_start', form_id: this.form.id });
+      }
+    });
+  });
+
+// Track abandonment on page leave
+window.addEventListener('beforeunload', function() {
+  if (formStarted && !formSubmitted) {
+    dataLayer.push({
+      event: 'form_abandon',
+      form_id: 'contact-form',
+      last_field: lastFocusedField,
+      fields_completed: completedFieldCount
+    });
+  }
+});
+```
+
+## GTM Trigger Configuration
+
+### Form Submission Trigger
+| Setting | Value |
+|---------|-------|
+| Trigger Type | Form Submission |
+| Wait for Tags | Check (if AJAX form) |
+| Check Validation | Check |
+| Form ID | equals `contact-form` |
+
+### Form Start Trigger (Custom Event)
+| Setting | Value |
+|---------|-------|
+| Trigger Type | Custom Event |
+| Event Name | form_start |
+| Fire On | All Custom Events |
+
+## Common Form Types & Tracking
+
+### Contact Forms
+Events: `form_start`, `form_submit`, `generate_lead`
+
+### Newsletter Signup
+Events: `form_start`, `form_submit`, `sign_up`
+
+### Login Forms
+Events: `form_start`, `login`
+
+### Search Forms
+Events: `search` (with search_term parameter)
+
+### Multi-Step Forms
+Track each step:
+```javascript
+dataLayer.push({
+  event: "form_step",
+  form_id: "checkout-form",
+  step_number: 2,
+  step_name: "Shipping Address"
+});
+```
+
+## Validation Checklist
+
+- [ ] Form has id or name attribute
+- [ ] All required fields have names
+- [ ] Submit button identifiable
+- [ ] form_start fires on first interaction
+- [ ] form_submit fires only on success
+- [ ] generate_lead has value parameter
+- [ ] Error events track validation failures
+- [ ] Abandonment tracking implemented (optional)