सुन्नको लागि jQuery प्रयोग गर्नुहोस् र कुनै पनि क्लिकको लागि गुगल एनालिटिक्स घटना ट्र्याकिङ पास गर्नुहोस्

jQuery गुगल एनालिटिक्स घटना ट्र्याकिङ पास गर्न क्लिकहरूको लागि सुन्नुहोस्

म आश्चर्यचकित छु कि थप एकीकरण र प्रणालीहरू स्वचालित रूपमा समावेश गर्दैनन् गुगल एनालिटिक्स घटना ट्र्याकिङ तिनीहरूको प्लेटफर्महरूमा। क्लाइन्टको साइटहरूमा काम गर्ने मेरो धेरै समयले ग्राहकलाई साइटमा कुन प्रयोगकर्ताको व्यवहारले काम गरिरहेको छ वा काम गरिरहेको छैन भन्ने बारे आवश्यक जानकारी प्रदान गर्न घटनाहरूको लागि ट्र्याकिङ विकास गरिरहेको छ।

भर्खरै, मैले कसरी ट्र्याक गर्ने बारे लेखे mailto क्लिकहरू, टेल क्लिकहरू, र एलिमेन्टर फारम सबमिशनहरू। म समाधानहरू साझा गर्न जारी राख्न जाँदैछु जुन मैले लेखिरहेको छु कि यसले तपाइँलाई तपाइँको साइट वा वेब अनुप्रयोग प्रदर्शनको राम्रो विश्लेषण गर्न मद्दत गर्दछ।

यो उदाहरणले गुगल एनालिटिक्स घटना कोटि, गुगल एनालिटिक्स घटना कार्य, र गुगल एनालिटिक्स घटना लेबल समावेश गर्ने डाटा तत्व थपेर कुनै पनि एन्कर ट्यागमा Google Analytics घटना ट्र्याकिङ समावेश गर्ने एक धेरै सरल माध्यम प्रदान गर्दछ। यहाँ एउटा लिङ्कको उदाहरण हो जसले डेटा तत्वलाई समावेश गर्दछ, भनिन्छ gaevent:

<a href="#" data-gaevent="Category,Action,Label">Click Here</a>

तपाइँको साइट को लागी एक पूर्व शर्त यसमा jQuery समावेश छ ... जुन यो स्क्रिप्ट संग संचालित छ। एक पटक तपाईंको पृष्ठ लोड भएपछि, यो लिपिले तत्वमा क्लिक गर्ने जो कोहीको लागि तपाईंको पृष्ठमा श्रोता थप्छ। gaevent डाटा... त्यसपछि यसले वर्ग, कार्य, र तपाईंले क्षेत्र भित्र निर्दिष्ट गर्नुभएको लेबललाई क्याप्चर र पार्स गर्दछ।

<script>
  $(document).ready(function() {      
    $(document).on('click', '[data-gaevent]', function(e) {
      var $link = $(this);
      var csvEventData = $link.data('gaevent');
      var eventParams = csvEventData.split(',');
      if (!eventParams) { return; }
        eventCategory = eventParams[0]
        eventAction = eventParams[1]
        eventLabel = eventParams[2]
        gtag('event',eventAction,{'event_category': eventCategory,'event_label': eventLabel})
        //alert("The Google Analytics Event passed is Action: " + eventAction + ", Category: " + eventCategory + ", Label: " + eventLabel);
    });
  });
</script>

नोटिस: मैले एउटा अलर्ट (टिप्पणी गरेको) समावेश गरेको छु ताकि तपाईले वास्तवमा के पास भयो भनेर परीक्षण गर्न सक्नुहुन्छ।

यदि तपाइँ WordPress मा jQuery चलाउँदै हुनुहुन्छ भने, तपाइँ कोडलाई थोरै परिमार्जन गर्न चाहानुहुन्छ किनकि WordPress ले $ सर्टकटको कदर गर्दैन:

<script>
  jQuery(document).ready(function() {      
    jQuery(document).on('click', '[data-gaevent]', function(e) {
      var $link = jQuery(this);
      var csvEventData = $link.data('gaevent');
      var eventParams = csvEventData.split(',');
      if (!eventParams) { return; }
        eventCategory = eventParams[0]
        eventAction = eventParams[1]
        eventLabel = eventParams[2]
        gtag('event',eventAction,{'event_category': eventCategory,'event_label': eventLabel})
        //alert("The Google Analytics Event passed is Action: " + eventAction + ", Category: " + eventCategory + ", Label: " + eventLabel);
    });
  });
</script>

यो सबभन्दा बलियो स्क्रिप्ट होइन र तपाईंले केही थप क्लिन-अप गर्नु पर्ने हुन सक्छ, तर यसले तपाईंलाई सुरु गराउनुपर्छ!