உங்கள் வலைத்தளத்தில் Yandex Metrica-வை எவ்வாறு சேர்ப்பது? படி படியான நிறுவல், Webvisor மற்றும் Informer பேட்ஜ் சரிசெய்தல்

ஒரு சுயாதீன கேம் ஸ்டுடியோ அல்லது உள்ளடக்க உருவாக்குநராக, உங்கள் வலைத்தளத்திற்கு வரும் பார்வையாளர்கள் எந்தக் கட்டுரைகளைப் படிக்கிறார்கள், பக்கத்தின் எந்தப் பகுதியை கிளிக் செய்கிறார்கள் மற்றும் உங்கள் ஸ்டோர் பேட்ஜ்களுடன் எவ்வாறு தொடர்புகொள்கிறார்கள் என்பதை அளவிடுவது மிகவும் முக்கியமானது. Google Analytics ஒரு பொதுவான தரநிலையாக இருந்தாலும், இலவச Webvisor (அமர்வு மறுஇயக்கம் / Session Replay), கிளிக் வரைபடம் (Clickmap), ஸ்க்ரோல் வரைபடம் (Scroll Map) மற்றும் காட்சி கவுண்டர் பேட்ஜ் (Informer) போன்ற அம்சங்களுடன் Yandex Metrica (Yandex.Metrika) டெவலப்பர்களுக்கு ஒரு சக்திவாய்ந்த பகுப்பாய்வுக் கருவியாகும்.

Arar Games நிறுவனமாக, 2011 முதல் இயங்கிவரும் எங்கள் கேம் டெவலப்மென்ட் போர்ட்டலான Mayhem Corporation (mayhemcorporation.com)-ஐ மொபைல் சாதனங்களுக்கு ஏற்றவாறு (responsive) மாற்றியமைக்கும் போது, இடது பக்க மெனுவில் 2012-ஆம் ஆண்டிலிருந்து இருந்த எங்கள் Yandex Metrica கவுண்டரும் காட்சி பேட்ஜும் இப்போது உடைந்த படமாகத் தோன்றுவதைக் கவனித்தோம்.

2012-ஆம் ஆண்டின் பழைய bs.yandex.ru முகவரியைக் கொண்ட Yandex Metrica பேட்ஜ் நவீன உலாவிகளில் உடைந்த ஐகானாகக் காட்சியளிப்பது.

இந்த வழிகாட்டியில், புதிதாக ஒரு புதிய Yandex Metrica குறிச்சொல்லை (Tag) உருவாக்குவது, புதுப்பிக்கப்பட்ட tag.js குறியீட்டை உங்கள் தளத்தில் இணைப்பது மற்றும் பழைய bs.yandex.ru மூலத்தால் உடைந்த Informer பேட்ஜை AdBlocker பாதுகாப்புடன் சரிசெய்வது ஆகியவற்றை படி படியாகப் பகிர்ந்து கொள்கிறோம்.

---

1. Yandex Metrica-வில் புதிய குறிச்சொல் (Tag) உருவாக்குதல்

உங்கள் Yandex கணக்குடன் metrica.yandex.com முகவரியில் உள்நுழைந்த பிறகு, புதிய வலைத்தள கவுண்டரைச் சேர்க்க Add tag (metrica.yandex.com/add) திரைக்குச் செல்கிறோம். இந்த நிறுவல் 3 முக்கிய படிகளைக் கொண்டுள்ளது:

படி 1: Create Tag (குறிச்சொல் விவரங்கள் மற்றும் Webvisor அமைப்பு)

முதல் திரையில், எங்கள் வலைத்தளத்தின் அடிப்படை அடையாளம் மற்றும் பிராந்திய அமைப்புகளை உள்ளமைக்கிறோம்:

1. Tag name: பேனலில் உங்கள் திட்டத்தை அடையாளம் காணக்கூடிய ஒரு பெயரை உள்ளிடவும் (எ.கா: Mayhem Corporation).
2. Website URL: புரோட்டோகால் (https://) இல்லாமல் உங்கள் தளத்தின் முதன்மை டொமைனை உள்ளிடவும் (எ.கா: mayhemcorporation.com).
3. Accept data only from the specified addresses: பிற வலைத்தளங்கள் உங்கள் கவுண்டர் ஐடியை (Tag ID) நகலெடுத்து உங்கள் புள்ளிவிவரங்களை தவறான போக்குவரத்தால் (spam traffic) மாசுபடுத்தாமல் தடுக்க, இந்த பெட்டியை கண்டிப்பாக தேர்வு செய்து வைக்கவும்.
4. Including subdomains: blog.yoursite.com போன்ற உங்கள் துணை டொமைன்களையும் இதே கவுண்டரில் இணைக்க விரும்பினால், இதைத் தேர்வு செய்யலாம்.
5. Time zone & Currency: தினசரி பார்வையாளர் மீட்டமைப்பு நேரங்கள் உங்கள் பகுதியின் நேர மண்டலத்துடன் ஒத்துப்போக (GMT+03:00) Istanbul (அல்லது உங்கள் உள்ளூர் நேர மண்டலம்) மற்றும் நாணயமாக TRY (அல்லது USD) என்பதைத் தேர்ந்தெடுக்கவும்.
6. Session Replay, scroll map, form analysis (Webvisor):

   💡 மிக முக்கியமான அம்சம்: இந்த விருப்பத்தை நீங்கள் செயல்படுத்தும்போது, உங்கள் தளத்தில் பார்வையாளர்களின் மவுஸ் அசைவுகள், ஸ்க்ரோலிங் ஆழம் மற்றும் அவர்கள் எந்த கேம்/கட்டுரை கார்டுகளை கிளிக் செய்கிறார்கள் என்பதை அநாமதேய வீடியோ பதிவு போலப் பார்க்க Yandex Metrica உங்களை அனுமதிக்கிறது.

---

படி 2: Fill Out the Profile (தள சுயவிவரத்தை உள்ளமைத்தல்)

இரண்டாவது படியில், தொழில்துறை ஒப்பீட்டு அறிக்கைகளை (benchmark) துல்லியமாக உருவாக்க Yandex Metrica 5 குறுகிய சுயவிவரக் கேள்விகளைக் கேட்கிறது:

1. Site Type (தளத்தின் வகை)

கட்டுரைகள், தொழில்நுட்ப வழிகாட்டிகள், செய்திகள் அல்லது ஆவணங்கள் சார்ந்த போர்ட்டலை நிர்வகிக்கிறீர்கள் என்றால் Informational website (Website with text content); நேரடியாக செயலி/கேம் விளம்பரப் பக்கமாக இருந்தால் Promo website என்பதைத் தேர்வு செய்யலாம்:

2. Industry (தொழில்துறை)

உங்கள் தளத்தின் உள்ளடக்கத்திற்கு ஏற்ப தொழில்நுட்பம், ஊடகம், கலாச்சாரம்/கலை ஆகியவற்றைத் தேர்ந்தெடுக்கவும் அல்லது列表中 பொருத்தமான ஒன்று இல்லையென்றால் கீழே உள்ள Other என்பதைத் தேர்ந்தெடுக்கவும்:

3. CMS (உள்ளடக்க மேலாண்மை அமைப்பு)

உங்கள் தளம் WordPress, Drupal, Joomla அல்லது Wix போன்ற ஆயத்த உள்கட்டமைப்பைப் பயன்படுத்துகிறது என்றால் பட்டியலிலிருந்து தேர்ந்தெடுக்கலாம். எங்கள் Mayhem Corporation போர்ட்டல் போல நீங்களே எழுதிய தனிப்பயன் PHP/MySQL அல்லது .NET கட்டமைப்பைப் பயன்படுத்துகிறீர்கள் என்றால், பட்டியலின் கீழே உள்ள Other என்பதைத் தேர்வு செய்யவும்:

4. CRM அமைப்பு

எந்தவொரு கார்ப்பரேட் CRM அமைப்பையும் நீங்கள் பயன்படுத்தவில்லை என்றால், இந்தப் புலத்தில் Other (அல்லது Without CRM) என்பதைத் தேர்ந்தெடுத்துத் தொடரலாம்:

5. Your Role in the Project (திட்டத்தில் உங்கள் பங்கு)

நீங்கள் ஒரு சுயாதீன டெவலப்பர் அல்லது ஸ்டுடியோ நிறுவனர் என்றால் Business management அல்லது Product management என்பதைத் தேர்ந்தெடுத்து Continue பொத்தானைக் கிளிக் செய்யவும்:

---

படி 3: குறியீட்டுத் துணுக்கை நிறுவுதல் (tag.js)

இறுதிப் படியில், உங்கள் தளத்தின் <head> அல்லது <body> குறிச்சொற்களுக்கு இடையே நீங்கள் வைக்க வேண்டிய புதுப்பிக்கப்பட்ட JavaScript கவுண்டர் குறியீட்டை (tag.js) Yandex Metrica உருவாக்குகிறது:

உருவாக்கப்பட்ட தற்போதைய கவுண்டர் குறியீட்டின் அமைப்பு பின்வருமாறு இருக்கும் (YOUR_TAG_ID என்பதற்குப் பதிலாக உங்கள் சொந்த குறிச்சொல் ஐடி இடம்பெறும்):

<!-- Yandex.Metrika counter -->
<script type="text/javascript">
    (function(m,e,t,r,i,k,a){
        m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
        m[i].l=1*new Date();
        for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
        k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)
    })(window, document,'script','https://mc.yandex.ru/metrika/tag.js?id=YOUR_TAG_ID', 'ym');

    ym(YOUR_TAG_ID, 'init', {
        ssr:true,
        webvisor:true,
        clickmap:true,
        ecommerce:"dataLayer",
        referrer: document.referrer,
        url: location.href,
        accurateTrackBounce:true,
        trackLinks:true
    });
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/YOUR_TAG_ID" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->

இந்தக் குறியீட்டை உங்கள் தளத்தின் முதன்மை டெம்ப்ளேட்டில் (index.php அல்லது header.php) சேர்த்து சர்வருக்குப் பதிவேற்றிய பிறகு, திரையில் உள்ள "Check tag" பொத்தானைக் கிளிக் செய்து கவுண்டர் நேரலையில் இயங்குவதை உறுதிசெய்து, "Get started" என்பதைக் கிளிக் செய்து உங்கள் பகுப்பாய்வு டாஷ்போர்டிற்குச் செல்லலாம்.

---

2. உடைந்த Yandex Metrica காட்சி பேட்ஜை (Informer) சரிசெய்தல் மற்றும் AdBlocker பாதுகாப்பு

2011–2014 ஆண்டுகளில் அமைக்கப்பட்ட வலைத்தளங்களில், Yandex Metrica-வின் சின்னமான 88x31 பிக்சல் நீல நிற புள்ளிவிவர பேட்ஜ் (Informer) பின்வரும் பழைய முகவரியுடன் அழைக்கப்பட்டது:

//bs.yandex.ru/informer/OLD_TAG_ID/3_1_3FFEEFFF_1FDECFFF_1_pageviews

ஆண்டுகள் செல்லச் செல்ல Yandex நிறுவனம் bs.yandex.ru சர்வரையும் பழைய watch.js ஸ்கிரிப்டையும் பயன்பாட்டிலிருந்து நீக்கியதால், இந்த முகவரி இப்போது HTTP 404 Not Found பிழையைத் திருப்பி பக்கத்தில் உடைந்த பட ஐகானை உருவாக்குகிறது.

தீர்வு 1: புதுப்பிக்கப்பட்ட informer.yandex.ru இறுதிப்புள்ளி

காட்சி பேட்ஜை இயக்க, பட மூலத்தை Yandex-ன் தற்போதைய Informer சேவைக்கு (https://informer.yandex.ru/informer/...) மாற்றுகிறோம்.

தீர்வு 2: AdBlocker பயன்படுத்தும் பார்வையாளர்களுக்கான உள்ளூர் மாற்று வழி (onerror)

இன்று பல விளையாட்டாளர்களும் டெவலப்பர்களும் தங்கள் உலாவிகளில் AdBlocker (uBlock Origin, Brave Shield போன்றவை) பயன்படுத்துகின்றனர். விளம்பரத் தடுப்பான்கள் பகுப்பாய்வு டொமைன்களைத் தடுக்கும்போது, பேட்ஜ் படம் ஏற்றப்படாமல் போகலாம். தளத்தின் வடிவமைப்பு எந்தச் சூழ்நிலையிலும் பாதிக்கப்படாமல் இருக்க, பேட்ஜின் 88x31 பிக்சல் நகலை எங்கள் சொந்த சர்வரில் (images/yandex_metrica_badge.png) சேமித்து வைத்து, onerror பண்புக்கூறு மூலம் தானாகவே செயல்பட வைக்கிறோம்:

<!-- Yandex.Metrika informer -->
<a href="https://metrica.yandex.com/stat/?id=YOUR_TAG_ID&amp;from=informer"
   target="_blank" rel="nofollow">
   <img src="https://informer.yandex.ru/informer/YOUR_TAG_ID/3_1_3FFEEFFF_1FDECFFF_1_pageviews"
        onerror="this.onerror=null;this.src='images/yandex_metrica_badge.png';"
        style="width:88px; height:31px; border:0; border-radius:3px;"
        alt="Yandex.Metrika"
        title="Yandex.Metrika: bugünün verileri (gösterimler, ziyaretler ve tekil ziyaretçiler)"
        class="ym-advanced-informer" data-cid="YOUR_TAG_ID" data-lang="tr" />
</a>
<!-- /Yandex.Metrika informer -->

இந்த மாற்றத்திற்குப் பிறகு, Mayhem Corporation இடது மெனுவில் உள்ள Yandex Metrica பேட்ஜ் சாதாரண உலாவிகளில் நேரலை புள்ளிவிவரங்களுடனும், AdBlocker இயக்கப்பட்ட உலாவிகளில் உடைந்த ஐகான் இல்லாமலும் அழகாகக் காட்சியளிக்கும்:

புதுப்பித்தலுக்குப் பிறகு mayhemcorporation.com/mayhem/index.php இடது மெனுவில் செயல்படும் Yandex Metrica Informer பேட்ஜ்.

பக்கக் காட்சிகள், வருகைகள் மற்றும் தனிப்பட்ட பார்வையாளர்களின் தரவைச் சுருக்கமாகக் காட்டும் 88x31 நீல நிற Informer பேட்ஜ்.

---

3. எங்கள் வலைத்தளம் மற்றும் எங்கள் கேம்கள் (Arar Games)

எங்கள் வலைத்தளம்

• Mayhem Corporation: கேம் மேம்பாடு மற்றும் XNA / MonoGame பற்றிய தொழில்நுட்பக் கட்டுரைகளைக் கொண்ட எங்கள் வலைத்தள போர்ட்டல்.
  mayhemcorporation.com

எங்கள் கேம்கள்

• Blocked: Pixel Panzer: 2D பிக்சல் டேங்க் ஆக்ஷன் மற்றும் ஆர்கேட் கேம்.
  Google Play | Microsoft Store
• Paint Trek: 2D விண்வெளி பின்னணி கொண்ட ஆர்கேட் மற்றும் புதிர் விளையாட்டு.
  Google Play | Microsoft Store
• Space Dodger: அனிச்சை செயல் (ரிஃப்ளெக்ஸ்) அடிப்படையிலான 2D விண்வெளி ஆர்கேட் கேம்.
  Google Play

சமூக ஊடகங்கள்

• TikTok: @arargamesstudio
• Instagram: @arargamesstudio
• X (Twitter): @arargamesstudio
• YouTube: @koreaaria
• Threads: @arargamesstudio
• Facebook: arargamesstudio