כדי להטמיע את קטעי הקוד הנדרשים למאגר התגים של Google Tag Manager באתר, עובדים לפי ההוראות שמפורטות למטה. במקורות המידע הבאים יש הוראות דומות להגדרת Tag Manager כדי להוסיף מאגרי תגים מסוגים אחרים:
- iOS: Google Tag Manager ל-iOS
- Android: Google Tag Manager ל-Android
- AMP: מדריך ההגדרה של AMP ו-Tag Manager
- שרת: Tag Manager בצד השרת
לפני שמתחילים
- אתם צריכים ליצור חשבון ומאגר תגים של Tag Manager.
- צריכה להיות לכם גישה לקוד של האתר.
מה עושים
- נכנסים אל https://tagmanager.google.com.
- נכנסים לחשבון Google. כך יוצרים חשבון Google.
- פותחים את מאגר התגים של Tag Manager שרוצים לערוך.
- בכרטיסייה Workspace (סביבת עבודה), בוחרים את מזהה מאגר התגים שלכם (שמתחיל ב-GTM).
- בתיבת הדו-שיח Install Google Tag Manager (הטמעה של Google Tag Manager), מבצעים את ההוראות שמפורטות כאן בכל דף באתר:
הערה: אם האתר שלכם נוצר באמצעות כלי לבניית אתרים או מערכת ניהול תוכן (CMS), כמו WordPress, Shopify או Wix, אתם יכולים להגדיר את Google Tag עם שילוב שלא מחייב אתכם לעדכן את הקוד בכל דף באתר. איך מטמיעים את Google Tag באמצעות כלי לבניית אתרים או מערכת ניהול תוכן.
- מעתיקים את קטע הקוד הראשון ומדביקים אותו במיקום גבוה ככל האפשר בין תגי
<head>.דוגמה
בדוגמה הבאה של קוד ה-HTML, מדביקים את קטע הקוד הראשון של Google Tag Manager אחרי תג ה-HTML הפותח <head>. שימו לב שבדוגמה הבאה מופיע המזהה GTM-ABCDEFGH, אבל אם צריכים להחליף אותו במזהה מאגר התגים שלכם. <!DOCTYPE html>
<html lang="en">
<head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-ABCDEFGH');</script>
<!-- הסוף של Google Tag Manager -->
<title>דף אינטרנט לדוגמה</title>
</head>
<body>
<!-- תוכן האתר -->
<h1>ברוכים הבאים לאתר שלי</h1>
<p>פסקה לדוגמה בדף האינטרנט שלי.</p>
</body>
</html> - מעתיקים את קטע הקוד השני ומדביקים אותו מיד אחרי התג הפותח
<body>.דוגמה
בדוגמה הבאה של קוד ה-HTML, מדביקים את קטע הקוד השני של Google Tag Manager מיד אחרי תג ה-HTML הפותח <body>. שימו לב שבדוגמה הבאה מופיע המזהה GTM-ABCDEFGH, אבל אם צריכים להחליף אותו במזהה מאגר התגים שלכם. <!DOCTYPE html>
<html lang="en">
<head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-ABCDEFGH');</script>
<!-- הסוף של Google Tag Manager -->
<title>דף אינטרנט לדוגמה</title>
</head>
<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-ABCDEFGH"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- הסוף של Google Tag Manager (noscript) -->
<!-- תוכן האתר -->
<h1>ברוכים הבאים לאתר שלי</h1>
<p>פסקה לדוגמה בדף האינטרנט שלי.</p>
</body>
</html> - כדי לבדוק את האתר, מזינים את הקישור שלו ולוחצים על Test (בדיקה).
- מעתיקים את קטע הקוד הראשון ומדביקים אותו במיקום גבוה ככל האפשר בין תגי
- לוחצים על OK (אישור).
השלבים הבאים
משתמשים ב-Google Tag Manager להגדרה ולניהול של תגים.