किसी रिएक्ट वेबसाइट में Google टैग मैनेजर (GTM) जोड़ने में आपके एप्लिकेशन में GTM स्क्रिप्ट सम्मिलित करना शामिल है। यहां बताया गया है कि आप यह कैसे कर सकते हैं:

1. एक Google टैग प्रबंधक खाता बनाएँ

यदि आपने पहले से नहीं किया है, तो आपको एक Google टैग प्रबंधक खाता बनाना होगा और अपनी वेबसाइट के लिए एक कंटेनर सेट करना होगा। Google आपको कोड के दो टुकड़े प्रदान करेगा:

• एक
• एक वैकल्पिक

2. अपने रिएक्ट ऐप में जीटीएम इंस्टॉल करें

विकल्प 1: मैन्युअल रूप से GTM कोड जोड़ना

1. जीटीएम स्क्रिप्ट को टैग में डालें: रिएक्ट ऐप में, public/index.html फ़ाइल वह जगह है जहाँ आप GTM ​​स्क्रिप्ट जोड़ेंगे।

GTM-XXXXXX को अपनी वास्तविक GTM कंटेनर आईडी से बदलें।

1. टैग के बाद जैसा कि ऊपर दिखाया गया है,

विकल्प 2: रिएक्ट जीटीएम लाइब्रेरी का उपयोग करना

एकीकरण को सरल बनाने के लिए आप रिएक्ट लाइब्रेरी का भी उपयोग कर सकते हैं।

1. जीटीएम लाइब्रेरी स्थापित करें:

प्रतिक्रिया-जीटीएम-मॉड्यूल स्थापित करने के लिए एनपीएम या यार्न का उपयोग करें:

   npm install react-gtm-module

1. अपने ऐप में GTM प्रारंभ करें:

अपने मुख्य रिएक्ट घटक (उदाहरण के लिए, App.js) में, GTM को इस तरह आरंभ करें:

   import React, { useEffect } from 'react';
   import TagManager from 'react-gtm-module';

   const App = () => {
       useEffect(() => {
           const tagManagerArgs = {
               gtmId: 'GTM-XXXXXX'
           };
           TagManager.initialize(tagManagerArgs);
       }, []);

       return (
           

               {/* Your app components */}
           
       );
   };

   export default App;

फिर से, GTM-XXXXXX को अपनी वास्तविक GTM कंटेनर आईडी से बदलें।

3. स्थापना सत्यापित करें

अपने रिएक्ट ऐप में जीटीएम जोड़ने के बाद, परिवर्तनों को प्रकाशित करें और सत्यापित करें कि जीटीएम Google टैग सहायक क्रोम एक्सटेंशन का उपयोग करके या Google Analytics में "वास्तविक समय" अनुभाग की जांच करके काम कर रहा है।