Swift के लिए शुरुआती निर्देश

इस गाइड में Google Tag Manager (GTM) की मदद से, खुली हुई स्क्रीन और बटन दबाए गए इवेंट को ट्रैक करने के लिए Swift में iOS ऐप्लिकेशन बनाने और उसे लागू करने का तरीका बताया गया है.

1. नया प्रोजेक्ट बनाएं

  1. Xcode खोलें. नया प्रोजेक्ट बनाना
  2. नया Xcode प्रोजेक्ट बनाएं पर क्लिक करें.
  3. सिंगल व्यू ऐप्लिकेशन चुनें. एक व्यू वाला ऐप्लिकेशन चुनें
  4. आगे बढ़ें पर क्लिक करें.
  5. अपने प्रोजेक्ट को नाम दें और उसके लिए अन्य विकल्प चुनें. आपके प्रोजेक्ट और ऐप्लिकेशन का नाम वही होगा जो प्रॉडक्ट का नाम होगा.
    प्रॉडक्ट का नाम और अन्य विकल्प डालना
  6. आगे बढ़ें पर क्लिक करें.
  7. प्रोजेक्ट की जगह (डायरेक्ट्री) चुनें.
  8. बनाएं पर क्लिक करें.

2. Google Tag Manager डिपेंडेंसी इंस्टॉल करना

  1. Xcode को छोड़ें.
  2. टर्मिनल में, Cocoapods इंस्टॉल करने के लिए नीचे दिया गया कमांड चलाएं:
    $ sudo gem install cocoapods
    
  3. अपनी प्रोजेक्ट डायरेक्ट्री पर जाएं.
  4. Podfile नाम की फ़ाइल बनाने के लिए, यह कमांड चलाएं:
    $ pod init
    
  5. Podfile में, use_frameworks! की टिप्पणी को हटाएं और pod 'GoogleTagManager' को टारगेट में जोड़ें:
  6. # Uncomment this line if you're using Swift
    use_frameworks!
    
    target 'GtmSwiftTutorial' do
      pod 'GoogleTagManager'
    end
    
  7. अपने प्रोजेक्ट में Google Tag Manager (GTM) के डिपेंडेंसी डाउनलोड और इंस्टॉल करने के लिए, यह कमांड चलाएं:
    $ pod install
    

    इस निर्देश से, फ़ाइल फ़ोल्डर GtmSwiftTutorial.xcworkspace भी बन जाता है. अब से, GtmSwiftTutorial ऐप्लिकेशन को डेवलप करने के लिए, इस फ़ाइल फ़ोल्डर का इस्तेमाल करें.

3. Objective-C लाइब्रेरी के लिए ब्रिजिंग हेडर जोड़ना

ब्रिजिंग हेडर फ़ाइल बनाने के लिए:

  1. Xcode खोलें.
  2. फ़ाइल > नया > फ़ाइल पर क्लिक करें.
  3. iOS > सोर्स में जाकर, हेडर फ़ाइल चुनें.
  4. आगे बढ़ें पर क्लिक करें.
  5. हेडर फ़ाइल का नाम BridgingHeader.h डालें.
    ब्रिजिंग हेडर फ़ाइल बनाना
  6. बनाएं पर क्लिक करें.
  7. हेडर फ़ाइल में ये import स्टेटमेंट जोड़ें:
    #ifndef BridgingHeader_h
    #define BridgingHeader_h
    
    #import <GoogleTagManager/TAGManager.h>
    #import <GoogleTagManager/TAGContainer.h>
    #import <GoogleTagManager/TAGContainerOpener.h>
    #import <GoogleTagManager/TAGDataLayer.h>
    #import <GoogleTagManager/TAGLogger.h>
    
    #endif /* BridgingHeader_h */
    

बिल्ड सेटिंग में Objective-C ब्रिजिंग हेडर जोड़ने के लिए:

  1. Xcode में, अपने प्रोजेक्ट पर क्लिक करें.
  2. एडिटर सेक्शन में, बिल्ड सेटिंग पर क्लिक करें.
    &#39;बिल्ड सेटिंग&#39; पर क्लिक करें
  3. सभी और मिले-जुले चुनें. इसके बाद, ब्रिजिंग खोजें.
    सर्च ब्रिजिंग
  4. Objective-C ब्रिजिंग हेडर वाली लाइन के दाएं कॉलम में, BridgingHeader.h डालें.
    BridgingHeader.h को Objective-C ब्रिजिंग हेडर के तौर पर जोड़ना

4. अपने प्रोजेक्ट में डिफ़ॉल्ट कंटेनर जोड़ना

अपने प्रोजेक्ट में डिफ़ॉल्ट कंटेनर जोड़ने से पहले, मोबाइल कंटेनर बाइनरी डाउनलोड करें:

  1. अपने Google Tag Manager खाते में साइन इन करें.
  2. कोई मोबाइल कंटेनर चुनें.
  3. मेन्यू बार में, वर्शन पर क्लिक करें.
  4. चुने गए कंटेनर वर्शन पर, कार्रवाइयां > डाउनलोड करें पर क्लिक करें.
  5. डाउनलोड की गई फ़ाइल का नाम कंटेनर आईडी होता है, उदाहरण के लिए, GTM-PT3L9Z.

अपने प्रोजेक्ट में डिफ़ॉल्ट कंटेनर बाइनरी जोड़ने के लिए:

  1. Xcode खोलें.
  2. डॉक पर मौजूद Finder आइकॉन पर क्लिक करें.
  3. Downoloads फ़ोल्डर पर क्लिक करें.
  4. कंटेनर की बाइनरी फ़ाइल को Downloads फ़ोल्डर में खींचें और छोड़ें. इसके बाद, इसे अपने Xcode प्रोजेक्ट के रूट फ़ोल्डर में छोड़ें.
  1. Xcode में, फ़ाइल AppDelegate.swift खोलें.
  2. AppDelegate क्लास को TAGContainerOpenerNotifier क्लास के साथ एक्सटेंड करें:
    import UIKit
    
    @UIApplicationMain
    class AppDelegate: UIResponder, UIApplicationDelegate, TAGContainerOpenerNotifier {
      // ...
    }
    

    कक्षा की अवधि बढ़ाने के बाद, आपको Type 'AppDelegate' does not conform to protocol 'TAGContainerOpenerNotifier' वाली गड़बड़ी का मैसेज दिखेगा. नीचे दिया गया तरीका अपनाकर, यह गड़बड़ी ठीक की जा सकती है.

  3. AppDelegate क्लास की परिभाषा के नीचे, यह फ़ंक्शन जोड़ें:
    func containerAvailable(container: TAGContainer!) {
      container.refresh()
    }
    
  4. application फ़ंक्शन में, return true स्टेटमेंट से पहले यह कोड जोड़ें:
    let GTM = TAGManager.instance()
    GTM.logger.setLogLevel(kTAGLoggerLogLevelVerbose)
    
    TAGContainerOpener.openContainerWithId("GTM-PT3L9Z",  // change the container ID "GTM-PT3L9Z" to yours
        tagManager: GTM, openType: kTAGOpenTypePreferFresh,
        timeout: nil,
        notifier: self)
    

6. स्क्रीन खुलने का इवेंट ट्रैक करना

स्क्रीन खुलने के इवेंट को ट्रैक करने के लिए:

  1. ट्रैकिंग आईडी को सेव करने के लिए वैरिएबल बनाएं.
  2. screenName नाम का डेटा लेयर वैरिएबल बनाएं.
  3. स्क्रीन व्यू टाइटल वाला GTM टैग बनाएं.
  4. स्क्रीन ट्रैकिंग कोड जोड़ें.

a. ट्रैकिंग आईडी को स्टोर करने के लिए वैरिएबल बनाएं

  1. अपने Google Tag Manager खाते में साइन इन करें.
  2. कोई मोबाइल कंटेनर चुनें.
  3. बाईं ओर मौजूद नेविगेशन बार में, वैरिएबल पर क्लिक करें.
  4. उपयोगकर्ता के तय किए गए वैरिएबल में, नया पर क्लिक करें.
  5. वैरिएबल का नाम ट्रैकिंग आईडी डालने के लिए, बिना टाइटल वाला वैरिएबल पर क्लिक करें.
  6. वैरिएबल टाइप के तौर पर कंसटेंट चुनें.
  7. वैरिएबल की वैल्यू के तौर पर, ट्रैकिंग आईडी डालें. यह आईडी UA-XXXXXXXX-X के तौर पर डाला जाना चाहिए, जहां X एक अंक है.
    UA-47605289-5 का इस्तेमाल करें (मिटाया जाएगा).
  8. वैरिएबल बनाएं पर क्लिक करें.

b. screenName नाम का डेटा लेयर वैरिएबल बनाना

  1. अपने Google Tag Manager खाते में साइन इन करें.
  2. एक मोबाइल कंटेनर चुनें.
  3. बाईं ओर मौजूद नेविगेशन बार में, वैरिएबल पर क्लिक करें.
  4. उपयोगकर्ता के तय किए गए वैरिएबल में, नया पर क्लिक करें.
  5. टाइटल डालने के लिए, बिना टाइटल वाला वैरिएबल पर क्लिक करें स्क्रीन नेम.
  6. वैरिएबल टाइप के तौर पर डेटा लेयर वैरिएबल चुनें.
  7. डेटा लेयर वैरिएबल के नाम के तौर पर screenName डालें.
  8. डिफ़ॉल्ट वैल्यू सेट करें पर क्लिक करें.
  9. डिफ़ॉल्ट वैल्यू स्क्रीन की जानकारी नहीं है डालें.
  10. वैरिएबल बनाएं पर क्लिक करें.

c. स्क्रीन व्यू टाइटल वाला GTM टैग बनाना

  1. अपने Google Tag Manager खाते में साइन इन करें.
  2. कोई मोबाइल कंटेनर चुनें.
  3. बाईं ओर मौजूद नेविगेशन बार में, टैग पर क्लिक करें.
  4. नया पर क्लिक करें.
  5. टैग का नाम डालने के लिए, बिना टाइटल वाला टैग पर क्लिक करें स्क्रीन व्यू.
  6. प्रॉडक्ट Google Analytics चुनें.
  7. सूची में से ट्रैकिंग आईडी चुनें.
  8. ट्रैक टाइप के तौर पर, ऐप्लिकेशन व्यू चुनें.
  9. ज़्यादा सेटिंग पर क्लिक करें.
  10. सेट किए जाने वाले फ़ील्ड पर क्लिक करें.
  11. + फ़ील्ड जोड़ें पर क्लिक करें.
  12. फ़ील्ड का नाम screenName और उसकी वैल्यू Screen Name चुनें.
  13. जारी रखें पर क्लिक करें.
  14. ट्रिगर होने पर में जाकर, कोई भी इवेंट चुनें.
  15. टैग बनाएं पर क्लिक करें.

d. स्क्रीन ट्रैकिंग कोड जोड़ना

  1. Xcode में ViewController.swift फ़ाइल खोलें.
  2. ViewController क्लास के अंदर dataLayer नाम का वैरिएबल तय करें:
    var dataLayer: TAGDataLayer = TAGManager.instance().dataLayer
    
  3. viewDidLoad() फ़ंक्शन में, OpenScreen इवेंट को डेटा लेयर में पुश करें:
    dataLayer.push(["event": "OpenScreen", "screenName": "Home Screen"])
    

ViewController क्लास की परिभाषा इस तरह दिखती है:

import UIKit

class ViewController: UIViewController {
  var dataLayer: TAGDataLayer = TAGManager.instance().dataLayer

  override func viewDidLoad() {
    super.viewDidLoad()
    dataLayer.push(["event": "OpenScreen", "screenName": "Home Screen"])
  }

  override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that cant be recreated
  }
}

7. बटन दबाने से जुड़ा इवेंट ट्रैक करना

बटन दबाने से होने वाले इवेंट को ट्रैक करने के लिए:

  1. eventAction नाम का डेटा लेयर वैरिएबल बनाएं.
  2. इवेंट नाम का कस्टम इवेंट वैरिएबल बनाएं.
  3. बटन दबाया गया टाइटल वाला GTM टैग बनाएं.
  4. बटन बनाएं और बटन दबाए जाने की जानकारी ट्रैक करने के लिए कोड जोड़ें.

a. eventAction के नाम से डेटा लेयर वैरिएबल बनाएं

  1. अपने Google Tag Manager खाते में साइन इन करें.
  2. कोई मोबाइल कंटेनर चुनें.
  3. बाईं ओर मौजूद नेविगेशन बार में, वैरिएबल पर क्लिक करें.
  4. उपयोगकर्ता के तय किए गए वैरिएबल में, नया पर क्लिक करें.
  5. इवेंट ऐक्शन का टाइटल डालने के लिए, बिना टाइटल वाला वैरिएबल पर क्लिक करें.
  6. वैरिएबल टाइप के तौर पर डेटा लेयर वैरिएबल चुनें.
  7. डेटा लेयर वैरिएबल के नाम के तौर पर, eventAction डालें.
  8. डिफ़ॉल्ट वैल्यू सेट करें पर क्लिक करें.
  9. डिफ़ॉल्ट वैल्यू अनजान इवेंट डालें.
  10. वैरिएबल बनाएं पर क्लिक करें.

b. 'इवेंट' नाम का कस्टम इवेंट वैरिएबल बनाना

  1. अपने Google Tag Manager खाते में साइन इन करें.
  2. कोई मोबाइल कंटेनर चुनें.
  3. बाईं ओर मौजूद नेविगेशन बार में, वैरिएबल पर क्लिक करें.
  4. उपयोगकर्ता के तय किए गए वैरिएबल में, नया पर क्लिक करें.
  5. वैरिएबल का नाम इवेंट डालने के लिए, बिना टाइटल वाला वैरिएबल पर क्लिक करें.
  6. वैरिएबल टाइप के तौर पर, कस्टम इवेंट चुनें.
  7. वैरिएबल बनाएं पर क्लिक करें.

c. बटन दबाया गया टाइटल वाला GTM टैग बनाना

  1. अपने Google Tag Manager खाते में साइन इन करें.
  2. एक मोबाइल कंटेनर चुनें.
  3. बाईं ओर मौजूद नेविगेशन बार में, टैग पर क्लिक करें.
  4. नया पर क्लिक करें.
  5. टैग का नाम डालने के लिए, बिना टाइटल वाला टैग पर क्लिक करें बटन दबाया गया.
  6. प्रॉडक्ट Google Analytics चुनें.
  7. सूची से ट्रैकिंग आईडी चुनें.
  8. ट्रैक टाइप के तौर पर इवेंट चुनें.
  9. इवेंट कैटगरी चुनें.
  10. इवेंट ऐक्शन चुनें.
  11. जारी रखें पर क्लिक करें.
  12. ट्रिगर होने पर में जाकर, कोई भी इवेंट चुनें.
  13. टैग बनाएं पर क्लिक करें.

d. बटन बनाएं और बटन दबाए जाने की जानकारी ट्रैक करने के लिए कोड जोड़ें

  1. अपना Xcode प्रोजेक्ट खोलें.
  2. Main.storyboard खोलें.
  3. यूटिलिटी एरिया (राइट साइडबार) खोलने के लिए, Xcode टूलबार में सबसे ऊपर दाईं ओर मौजूद बटन पर क्लिक करें. स्टोरी बोर्ड और यूटिलिटी एरिया
  4. यूटिलिटी सेक्शन में सबसे नीचे,
    ऑब्जेक्ट लाइब्रेरी खोलने के लिए नीला बटन

    ऑब्जेक्ट लाइब्रेरी दिखाएं बटन (नीला बटन) पर क्लिक करें:

    ऑब्जेक्ट लाइब्रेरी की पॉप-अप विंडो
  5. खोज बॉक्स में बटन डालें.
    बटन पर क्लिक करें
  6. बटन को स्टोरीबोर्ड पर खींचें और सबसे ऊपर बाईं ओर छोड़ें.
    बटन को खींचकर स्टोरीबोर्ड पर छोड़ें
  7. Xcode टूलबार में, असिस्टेंट एडिटर बटन Assistant एडिटर बटन पर क्लिक करें.
  8. Ctrl बटन को दबाकर रखें. इसके बाद, बटन को खींचें और ViewController क्लास की परिभाषा के सबसे नीचे की ओर छोड़ें.
    बटन को ViewController क्लास की परिभाषा पर खींचें और छोड़ें
  9. डायलॉग में, कार्रवाई कनेक्शन चुनें. इसके बाद, फ़ंक्शन का नाम buttonPressed डालें और कनेक्ट करें पर क्लिक करें.
    बटन दबाने से होने वाले इवेंट को हैंडल करने के लिए कोड बनाना

    इससे, ViewController क्लास की परिभाषा के आखिर में यह फ़ंक्शन जुड़ जाता है:

    @IBAction func buttonPressed(sender: AnyObject) {
    }
    

    बटन को हर बार दबाने पर, फ़ंक्शन लागू होता है.

  10. buttonPressed फ़ंक्शन में, यह कोड जोड़ें, ताकि ButtonPressed इवेंट को दिन की लेयर पर पुश किया जा सके:
    @IBAction func buttonPressed(sender: AnyObject) {
      dataLayer.push(["event": "ButtonPressed", "eventAction": "Test Event"])
    }
    

8. अपना ऐप्लिकेशन बनाना और चलाना

Xcode में, प्रॉडक्ट > चलाएं पर क्लिक करें. Xcode, ऐप्लिकेशन को बिल्‍ड और चलाएगा:

लॉन्च किए गए ऐप्लिकेशन का स्क्रीनशॉट