افزایش خدمات رایگان
اطلاعیه ها و اخبار سایت

- فیلم طراحی سایت از ابتدا تا انتها - (به زودی)

 

- فیلم رایگان آموزش طراحی سایت در چند دقیقه

 

 

حضور کلبه طراحی در جشنواره وب ایران

مدیریت تگ گوگل یا گوگل تگ منیجر (Google Tag Manager)چیست؟

گوگل نرم‌افزار جدید خود با نام "مدیریت تگ گوگلGoogle Tag Manager - " را منتشر کرد.

 

در ابتدا کلمه تگ در نام این نرم‌افزار ممکن است گیج کننده باشد و سروکار داشتن با کدهای اچ تی ام ال را به وب مستر یادآوری کند، اما منظور گوگل بسیار روشن و دقیقا همان تگ‌های HTML است. قالب‌هایی از تگ‌های HTML که در ادامه مطلب به صورت روشن توضیح داده می‌شود.

 

به وسیله سیستم مدیریت تگ گوگل، می‌توان کدهای مورد نیاز برای اضافه کردن سرویس‌های مختلف مانند گوگل آنالیتیک،گوگل ادسنس،گوگل اد وردز، دابل کلیک، نرم‌افزارهای تبلغاتی و غیره که باید به سایت اضافه شوند، را مدیریت نمود.

ایده‌ی این نرم‌افزار ساده اما درعین‌حال بسیار زیبا و کاربردی است. تا قبل از این برای اضافه کردن هر سرویس به سایت لازم بود کدهای مربوط به آن سرویس خاص به صورت جداگانه در متن نرم‌افزار سابت و در قسمت کدها وارد شود.

 به عنوان مثال اگر از سرویس‌های  Google Analytic، سیستم تبلیغات DoubleClick و چند سرویس دیگر در یک سایت استفاده می‌شد، برای هریک از این سرویس‌ها قطعه کد HTML شامل کدهای JavaScript باید در جایی از HTMLاصلی نرم‌افزار سایت وارد می‌شد. به وسیلهGoogle Tag Manager تنها قطعه کد مربوط به آن را در نرم‌افزار وارد می‌کنید، بعد از این مرحله کافی است وارد google.com/tagmanager شوید و تگهای دیگر را از پنل مدیریتی آن کنترل کنید.

 

فواید استفاده از سیستم مدیریت تگ گوگل

·         دیگر نیاز به برنامه‌نویس برای تغییر کدهای سایت نیست. مستقل بودن از برنامه نویس به وب‌مستر سایت کمک می‌کند اقدامات مورد نیاز را بدون داشتن دانش فنی و تنها با چند کلیک ساده انجام دهد.

·         استفاده از قالب‌های گوگل برای اضافه کردن سرویس‌ها به صورت مدیریت شده به معنی کاهش خطای انسانی است.

·         امکان تعریف قوانین برای انتشار یا عدم انتشار کد‌ها در صفحات مختلف

·         دسترسی به تنظیمات بسیار زیاد در پنلی که گوگل در اختیارتان قرار میدهد.

·         ...

 

کدام سرویس‌ها را می‌توان از این طریق به سایت اضافه کرد؟

·         قالب‌های کد مربوط به سرویس‌های گوگل و دابل‌ کلیک

·         قالب‌های کد مربوط به سرویس دهندگان مورد تایید گوگل

·         تگ‌های اختصاصی

·         آمارگیرها

·         گوگل ادسنس

·         گوگل اد وردز

·         ....

 

این امر باعث می شود از یک سو کدنویسی، تمیز و آسان شود و از سوی دیگر به لحاظ تئوری، سرعت وب سایت بالا برود و به عبارت دیگر زمان لود شدن سایت کاهش یابد.

همچنین چند کاربر دورکار می توانند بدون نیاز به کمک یک توسعه دهنده، تغییرات مورد نظر خود را بر تگ ها اعمال کنند.

بررسی اجمالی ساختار گوگل تگ منیجر

به سایت Google Tag Manager به آدرس http://www.google.com/tagmanager بروید.

در بخش Sign Up می توانید یک حساب جدید بسازید و یا حساب (های) فعلی خود را مشاهده کنید.

اگر شما برای یک شرکت کار می کنید، ممکن است بخواهید برای هر کلاینتی که مدیریت GoogleTag Manager بر عهده شماست، یک حساب ایجاد نمایید.

 


http://kdupload.ir/uploads/admin/GTM%20(1).png

 

در هر حساب گوگلی، شما دارای مخزن هایی به نام Containers هستید که در آن می توانید کدهای مشابه با یکدیگر را گروه بندی کنید. 

در مثال ذیل، ما یک حساب برای Hanapin Marketing و یک Containersجداگانه برای PPC Hero و Hanapinmarketing.com ایجاد کرده ایم.

دلیل این موضوع آن است که ما کدهای Analytics برای هر کدام از این دو سایت را جدا جدا به کار می بریم. 

همچنین حساب های AdWords و کدهای ردگیری را نیز از هم تفکیک می کنیم؛ لذا آنها را باید در Containers های مستقل از هم نگهداری نمود.

اگر ما فرضاً یک زیردامنه به صورت blog.hanapinmarketing.com داشته باشیم، آن را در Containers مربوط به Hanapinmarketing.com لحاظ می کنیم .

http://kdupload.ir/uploads/admin/GTM%20(2).png


پس از تنظیم  containersممکن است بخواهید به دیگر کاربران حق دسترسی بدهید.

این کار بسیار ساده است. شما می توانید مجوزهای حساب ها و نیز سطوح Container ها را به راحتی کنترل و مدیریت کنید.

 

http://kdupload.ir/uploads/admin/GTM%20(3).png

 

افزودن تگ ها

اکنون که حساب خود و Container ها را راه اندازی کرده اید و کاربران مرتبط را نیز به آن اضافه نموده اید، می توانید لیست تگ های مورد نظرتان را ایجاد نمایید.

در مثال ما، این امر به معنای افزودن Google Analytics، Google AdWords conversiontracking، Google AdWords remarketing و Bing conversion tracking می باشد.

انجام این کار بی نهایت ساده است: به یکی از Container های خود بروید و در گوشه بالا سمت راست، بخش New Tag را انتخاب کنید.

 

http://kdupload.ir/uploads/admin/GTM%20(4).png

 

یک لیست کشویی حاوی تگ های گوگل پیش روی شما ظاهر می شود:

 http://kdupload.ir/uploads/admin/GTM%20(5).png

از این لیست GoogleAnalytics را انتخاب کنید و نام روشنی – مانند Google Analytics–به آن اختصاص دهید.(تا در مراحل بعد و با افزایش تعداد سایتها مشکلی برایتان ایجاد نشود)

 

http://kdupload.ir/uploads/admin/GTM%20(6).png

 

اکنون باید AnalyticsID خود را به دست آورید.

برای این کار به تب Analyticsadmin بروید و web propertyرا متناسب با سایت خود(سایتی که میخواهید برای آن از تگ منیجر گوگل استفاده کنید) انتخاب کنید.

حال باید قوانینی برای محل نمایش این کدها وضع کنید.

 در این مثال، من قانون allpages را برگزیده ام ولی شاید شما بخواهید به گونه ای عمل کنید که این کد ویژه، در صفحه یا زیردامنه خاصی از سایت به نمایش در آید. 

برای انجام این کار باید قانون جدیدی ایجاد نمایید:

 http://kdupload.ir/uploads/admin/GTM%20(7).png

 

همچنین شما می توانید نمایش کدتان را به گونه ای تنظیم کنید که نمایش کد را برای بخش خاصی از سایت – مثلاً صفحات آزمایشی – بلوکه نمایید.

در لیست کشویی moresettings می توانید از گزینه بلوکه کردن ارجاع ها یا کلیدواژه های خاص استفاده نمایید.

تب بعدی که من می خواهم بسازم، Google AdWords conversion code است.

Tag Manager برای سهولت کار شما از گزینه های پیش فرض مناسبی استفاده می کند:

 

http://kdupload.ir/uploads/admin/GTM%20(8).png

 

شما می توانید با رفتن به حساب AdWords خود، به بخش Conversion ID و Conversion Label برویدو کدهای موجود فعلی را ملاحظه کنید.

همانطور که در تصویر مشخص است، من قانونی برای AdWords code خود وضع کرده ام که طی آن، این کد فقط در صفحه تایید Thank you ظاهر می شود.

در خصوص Bing، همه چیز سر راست و پیش فرض به شما تحویل نمی شود زیرا هر چه باشد بینگ یکی از سرویس های مایکروسافت است نه گوگل!

با این حال شما به آسانی می توانید کدهای دلخواه خود را به آن بیافزایید: کد HTML مورد نظرتان را انتخاب کرده و آن را به Bing conversion code ملحق سازید.

 http://kdupload.ir/uploads/admin/GTM%20(9).png

 

من این کار را برای نمایش در صفحه Thank you تنظیم کرده ام.

برای اضافه کردن تگ ها اصول اولیه ای وجود دارد.اجازه بدهید قدری بیشتر درباره قوانین و ماکروها سخن بگویم.

همانطور که پیشتر اشاره شد، قوانین، محل نمایش تگ ها را مشخص می سازد.

در container مربوط به PPC Hero شما چیزی شبیه به این را مشاهده می کنید:

 http://kdupload.ir/uploads/admin/GTM%20(10).png

 

قانون PPC ServicesRemarketing به این معناست که تگ remarketing فقط در صفحه PPC Services نمایش داده می شود. بسیار ساده است، نه؟

ماکروها امکانات بیشتری در مقایسه با تگ ها در اختیار شما قرار می دهد.

به عنوان مثال شما می توانید با استفاده از ماکروها، داده خاصی را از دیگر جاوااسکریپت ها استخراج کرده و نحوه نمایش یک کد را مشخص سازید.

ما برای یک کلاینت eCommerce ماکروی خاصی تنظیم کرده ایم که مقدار تراکنش صورت گرفته از کارت جاوااسکریپت آنها را گرداوری می کند با این هدف که داده های درآمدی در GoogleAdWords’ conversion tracking نیز شامل شود.

 

http://kdupload.ir/uploads/admin/GTM%20(11).png

ماکروهای پش فرض موجود به این شرح است:

URL: با استفاده از آن می توانید بسته به URL صفحه، قوانینی وضع نمایید.

Referrer: تنظیم قوانین بر اساس ارجاع سایت (به آن دسته از کاربرانی که از PPCبازدید کنند، پیش از آن که به سراغ Hanapin Marketing و... بروند، کدهای remarketing ویژه ای نمایش داده می شود).

Event: تنظیم قوانین برای کاربرانی که کار خاصی در سایت انجام می دهند، مثل تماشای یک ویدئو.

لیست ما این گونه است:

http://kdupload.ir/uploads/admin/GTM%20(12).png

اگر مایل هستید اطلاعات بیشتری در این خصوص به دست آورید،پیشنهاد می کنم به بخش آموزش گوگل به آدرس http://support.google.com/tagmanager/answer/2644341 مراجعه نمایید.

اکنون که شما تمام تگ ها را ایجاد کرده اید، به قوانین درستی برای نمایش تگ ها نیاز دارید.

برای این کار ابتدا باید درستی تنظیمات تمام حساب های خود را بررسی کنید:

 

http://kdupload.ir/uploads/admin/GTM%20(13).png



 

اگر همه چیز درست و مرتب بود، به سراغ تگ های قدیمی Google Tag Manager بروید و همه آنها را حذف نموده و به جای آنها Code snippet های Tag Manager را جایگزین کنید.

http://kdupload.ir/uploads/admin/GTM%20(14).png

برای این کار به منوی تنظیمات رفته و در حساب خود، برای هر container یک snippet متفاوت ایجاد کنید.

شما می توانید با باز کردن تگ >این کدها را به صورت بلادرنگ مستقر کنید.

به خوبی و خوشی کار ما تمام شد!خیلی آسان بود. نه؟

 

شما به مرور زمان که تجربه بیشتری در استفاده از Google Tag Manager بیابید، می توانید تنظیمات خود را در زمان بسیار کوتاهی انجام دهید و یا ویرایش کنید.