يوضّح هذا الدليل كيفية إنشاء تطبيق iOS وتنفيذه في Swift لتتبُّع أحداث فتح الشاشة وضغط الزر باستخدام أداة "إدارة العلامات من Google" (GTM).
1. إنشاء مشروع جديد
- افتح Xcode.
- انقر على إنشاء مشروع Xcode جديد.
- اختَر تطبيق عرض واحد.
- انقر على التالي.
- أدخِل اسمًا لمشروعك واختَر خيارات إضافية له. سيكون اسم المشروع
واسم التطبيق هو نفسه اسم المنتج.
- انقر على التالي.
- اختَر موقع المشروع (الدليل).
- انقر على إنشاء.
2. تثبيت متطلّبات أداة "إدارة العلامات من Google"
- عليك إنهاء Xcode.
- في وحدة طرفية، شغِّل الأمر التالي لتثبيت
Cocoapods:
$ sudo gem install cocoapods
- انتقِل إلى دليل مشروعك.
- شغِّل الأمر التالي لإنشاء ملف باسم
Podfile
:$ pod init
- في
Podfile
، أزِل التعليق التوضيحي منuse_frameworks!
وأضِفpod 'GoogleTagManager'
إلى الاستهداف: - شغِّل الأمر التالي لتنزيل وتركيب تبعيات أداة "إدارة العلامات من Google"
في مشروعك:
$ pod install
ينشئ هذا الأمر أيضًا مساحة العمل
GtmSwiftTutorial.xcworkspace
. من الآن فصاعدًا، استخدِم مساحة العمل هذه لتطوير تطبيقGtmSwiftTutorial
.
# Uncomment this line if you're using Swift use_frameworks! target 'GtmSwiftTutorial' do pod 'GoogleTagManager' end
3- إضافة رأس ربط لمكتبات Objective-C
لإنشاء ملف رأس ربط:
- افتح Xcode.
- انقر على ملف > جديد > ملف.
- ضمن iOS > المصدر، اختَر ملف الرأس.
- انقر على التالي.
- أدخِل اسم ملف العنوان
BridgingHeader.h
.
- انقر على إنشاء.
- أضِف عبارات
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 */
لإضافة عنوان جسر هدف-ج في إعدادات الإصدار:
- في Xcode، انقر على مشروعك.
- انقر على إعدادات الإنشاء في منطقة المحرِّر.
- اختَر الكل ومدمجة وابحث عن جسر.
- في العمود الأيمن من الصف الذي يحتوي على Objective-C Bridging Header،
أدخِل
BridgingHeader.h
.
4. إضافة حاوية تلقائية إلى مشروعك
قبل إضافة حاوية تلقائية إلى مشروعك، نزِّلملف ثنائي للحاوية المتوافقة مع الأجهزة الجوّالة:
- سجِّل الدخول إلى حسابك على أداة "إدارة العلامات من Google".
- اختَر حاوية للأجهزة الجوّالة.
- انقر على الإصدارات في شريط القوائم.
- انقر على الإجراءات > تنزيل في إصدار الحاوية المحدّد.
GTM-PT3L9Z
.
لإضافة ملف ثنائي للحاويات التلقائية إلى مشروعك:
- افتح Xcode.
- انقر على رمز Finder في شريط Dock.
- انقر على مجلد
Downoloads
. - اسحب الملف الثنائي للحاوية في مجلد
Downloads
وأفلِته في المجلد الجذر في مشروع Xcode.
5- ربط أداة "إدارة العلامات من Google" بتطبيقك
- في Xcode، افتح الملف
AppDelegate.swift
. - اطلب من الفئة
AppDelegate
تمديد الفئةTAGContainerOpenerNotifier
:import UIKit @UIApplicationMain class AppDelegate: UIResponder, UIApplicationDelegate, TAGContainerOpenerNotifier { // ... }
.بعد تمديد فترة الصف الدراسي، ستظهر لك رسالة الخطأ
Type 'AppDelegate' does not conform to protocol 'TAGContainerOpenerNotifier'
. ستؤدي الخطوة التالية إلى إصلاح هذا الخطأ. - أضِف الدالة التالية إلى أسفل تعريف فئة
AppDelegate
:func containerAvailable(container: TAGContainer!) { container.refresh() }
- في دالة
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- تتبُّع حدث فتح الشاشة
لتتبُّع حدث فتح شاشة:
- أنشئ متغيّرًا لتخزين رقم تعريف التتبّع.
- أنشئ متغيّر طبقة بيانات باسم screenName.
- أنشئ علامة "إدارة العلامات من Google" بعنوان عرض الشاشة.
- أضِف رمز تتبُّع الشاشة.
أ. أنشئ متغيّرًا لتخزين معرّف التتبّع.
- سجِّل الدخول إلى حسابك على إدارة العلامات من Google.
- اختَر حاوية متنقلة.
- في شريط التنقّل الأيمن، انقر على المتغيّرات.
- ضمن المتغيّرات التي يحدّدها المستخدِم، انقر على جديد.
- انقر على متغيّر بلا عنوان لإدخال اسم المتغيّر رقم تعريف التتبُّع.
- اختَر ثابت كنوع المتغيّر.
- أدخِل رقم تعريف التتبّع (في شكل
UA-XXXXXXXX-X
، حيث يمثّلX
رقمًا) كقيمة للمتغيّر.استخدِمUA-47605289-5
(لحذفه). - انقر على إنشاء متغيّر.
ب- أنشئ متغيّر طبقة بيانات باسم screenName.
- سجِّل الدخول إلى حسابك على إدارة العلامات من Google.
- اختَر حاوية متنقلة.
- في شريط التنقّل الأيمن، انقر على المتغيّرات.
- ضمن متغيّرات من تحديد المستخدِم، انقر على جديد.
- انقر على متغيّر بلا عنوان لإدخال العنوان اسم الشاشة.
- اختَر متغيّر طبقة البيانات كنوع المتغيّر.
- أدخِل screenName باعتباره اسم متغير طبقة البيانات.
- انقر على ضبط القيمة التلقائية.
- أدخِل القيمة التلقائية شاشة غير معروفة.
- انقر على إنشاء متغيّر.
ج. أنشئ علامة "إدارة العلامات من Google" بعنوان "عرض الشاشة".
- سجِّل الدخول إلى حسابك على إدارة العلامات من Google.
- اختَر حاوية متنقلة.
- في شريط التنقّل الأيمن، انقر على العلامات.
- انقر على جديد.
- انقر على علامة بلا عنوان لإدخال اسم العلامة مشاهدة الشاشة.
- اختَر المنتج إحصاءات Google.
- اختَر رقم تعريف التتبّع من القائمة.
- اختَر مشاهدة التطبيق كـ نوع التتبُّع.
- انقر على إعدادات إضافية.
- انقر على الحقول المطلوب إعدادها.
- انقر على + إضافة حقل.
- اختَر اسم الحقل screenName وقيمته اسم الشاشة.
- انقر على متابعة.
- ضمن تفعيل، اختَر أي حدث.
- انقر على إنشاء علامة.
د- إضافة رمز تتبّع الشاشة
- افتح الملف
ViewController.swift
في Xcode. - حدِّد متغيّرًا باسم
dataLayer
داخل الفئةViewController
:var dataLayer: TAGDataLayer = TAGManager.instance().dataLayer
- في دالة
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- تتبُّع حدث الضغط على الزر
لتتبُّع حدث الضغط على زر:
- أنشئ متغيّر طبقة بيانات باسم eventAction.
- أنشئ متغيّر حدث مخصّصًا باسم الحدث.
- أنشئ علامة "إدارة العلامات من Google" بعنوان الضغط على الزر.
- أنشئ زرًا وأضِف رمزًا لتتبُّع الضغط على الزر.
أ. إنشاء متغيّر طبقة بيانات باسم eventAction
- سجِّل الدخول إلى حسابك على أداة إدارة العلامات من Google.
- اختَر حاوية للأجهزة الجوّالة.
- في شريط التنقّل الأيمن، انقر على المتغيّرات.
- ضمن المتغيّرات التي يحدّدها المستخدِم، انقر على جديد.
- انقر على متغيّر بلا عنوان لإدخال العنوان إجراء الحدث.
- اختَر متغيّر طبقة البيانات كنوع المتغيّر.
- أدخِل eventAction كـ اسم متغيّر طبقة البيانات.
- انقر على ضبط القيمة التلقائية.
- أدخِل القيمة التلقائية حدث غير معروف.
- انقر على إنشاء متغيّر.
ب- أنشئ متغيّر حدث مخصّصًا باسم "الحدث".
- سجِّل الدخول إلى حسابك على أداة إدارة العلامات من Google.
- اختَر حاوية متنقلة.
- في شريط التنقّل الأيمن، انقر على المتغيّرات.
- ضمن المتغيّرات التي يحدّدها المستخدِم، انقر على جديد.
- انقر على متغيّر بدون عنوان لإدخال اسم المتغيّر الحدث.
- اختَر حدث مخصّص كنوع المتغيّر.
- انقر على إنشاء متغيّر.
ج. أنشئ علامة "إدارة العلامات من Google" بعنوان "الضغط على الزر".
- سجِّل الدخول إلى حسابك على إدارة العلامات من Google.
- اختَر حاوية متنقلة.
- في شريط التنقّل الأيمن، انقر على العلامات.
- انقر على جديد.
- انقر على علامة بلا عنوان لإدخال اسم العلامة تم الضغط على زر.
- اختر المنتج إحصاءات Google.
- اختَر رقم تعريف التتبّع من القائمة.
- اختَر الحدث كـ نوع التتبُّع.
- اختَر فئة الحدث.
- اختَر إجراء الحدث.
- انقر على متابعة.
- ضمن تفعيل، اختَر أي حدث.
- انقر على إنشاء علامة.
د- إنشاء زر وإضافة رمز لتتبّع الضغط على الزر
- افتح مشروع Xcode.
- فتح "
Main.storyboard
" - انقر على الزر في أعلى يسار شريط أدوات Xcode لفتح منطقة الأدوات (الشريط الجانبي الأيسر).
- في أسفل منطقة المرافق،
انقر على الزر عرض مكتبة العناصر (الزر الأزرق):
- أدخِل button في مربّع البحث.
- اسحب الزر إلى لوحة القصة وأفلِته في أعلى
يمين الشاشة.
- انقر على زر "مساعِد المحرِّر" في شريط أدوات Xcode.
- أثناء الضغط مع الاستمرار على مفتاح Ctrl، اسحب الزر وأفلِته
في أسفل تعريف الفئة
ViewController
.
- في مربّع الحوار، اختَر اتصال الإجراء، وأدخِل اسم الدالة
buttonPressed، ثم انقر على اتصال.
يؤدي ذلك إلى إضافة الدالة التالية إلى نهاية تعريف فئة
ViewController
:@IBAction func buttonPressed(sender: AnyObject) { }
يتم تنفيذ الدالة في كل مرة يتم فيها الضغط على الزر.
- في الدالة
buttonPressed
، أضِف الرمز التالي لإرسال حدثButtonPressed
إلى طبقة اليوم:@IBAction func buttonPressed(sender: AnyObject) { dataLayer.push(["event": "ButtonPressed", "eventAction": "Test Event"]) }
8. إنشاء تطبيقك وتشغيله
في Xcode، انقر على المنتجات > تشغيل. سينشئ Xcode التطبيق ويشغّله: