Kuidas lisada oma veebisaidile Yandex Metrica: Samm-sammuline paigaldusjuhend, Webvisor ja Informer märgise parandamine

Sõltumatu mängustuudiona või sisuloojana on ülimalt oluline mõõta, milliseid artikleid teie veebisaidi külastajad loevad, kuhu nad lehel klõpsavad ja kuidas nad suhtlevad teie rakenduste poe märgistega. Kuigi Google Analytics on levinud standard, muudavad tasuta funktsioonid nagu Webvisor (Seansi kordus / Session Replay), Klõpsukaart (Clickmap), Kerimiskaart (Scroll Map) ja Visuaalne loenduri märgis (Informer) Yandex Metrica (Yandex.Metrika) arendajate jaoks võimsaks analüütikavahendiks.

Meie stuudios Arar Games märkasime alates 2011. aastast veebis olnud mänguarendusportaali Mayhem Corporation (mayhemcorporation.com) mobiilisõbralikuks (responsiivseks) kohandamisel, et meie vasakus menüüs asuv 2012. aastast pärinev Yandex Metrica loendur ja visuaalne märgis kuvatakse nüüd katkise ikoonina.

2012. aastast pärinev vana bs.yandex.ru aadressiga Yandex Metrica märgis, mida tänapäevastes brauserites kuvatakse katkise ikoonina.

Selles juhendis tutvustame samm-sammult, kuidas luua Yandex Metrica keskkonnas nullist uus silt (Tag), integreerida ajakohastatud kood tag.js oma veebisaidile ning parandada vanalt serverilt bs.yandex.ru pärinev katkine Informer märgis koos AdBlockeri kaitsega.

---

1. Uue sildi (Tag) loomine Yandex Metricas

Pärast oma Yandexi kontoga sisselogimist aadressil metrica.yandex.com liigume ekraanile Add tag (metrica.yandex.com/add), et lisada uus veebisaidi loendur. Paigaldus koosneb 3 põhietapist:

Samm 1: Create Tag (Sildi teave ja Webvisori seadistus)

Esimesel ekraanil konfigureerime oma veebisaidi peamised identiteedi- ja piirkonnaseaded:

1. Tag name: Sisestage nimi, mis aitab teil oma projekti juhtpaneelil ära tunda (nt Mayhem Corporation).
2. Website URL: Sisestage oma veebisaidi peamine domeen ilma protokollita (https://) (nt mayhemcorporation.com).
3. Accept data only from the specified addresses: Jätke see ruut kindlasti märgistatuks, et teised veebisaidid ei saaks kopeerida teie loenduri ID-d ega reostada teie statistikat rämpspostiliiklusega.
4. Including subdomains: Võite selle märkida, kui soovite samasse loendurisse koguda andmeid ka alamdomeenidelt nagu blog.teieveebisait.com.
5. Time zone & Currency: Valige sobiv ajavöönd (nt (GMT+03:00) Istanbul) ja valuuta, näiteks TRY (või USD), et igapäevane külastajate nullimine vastaks teie kohalikule ajale.
6. Session Replay, scroll map, form analysis (Webvisor):

   💡 Kõige kriitilisem funktsioon: Kui selle valiku aktiveerite, võimaldab Yandex Metrica jälgida külastajate hiireliigutusi, kerimissügavust ja seda, millistele mängu-/artiklikaartidele nad klõpsavad, anonümiseeritud videosalvestusena.

---

Samm 2: Fill Out the Profile (Veebisaidi profiili seadistamine)

Teises etapis esitab Yandex Metrica 5 lühikest profiiliküsimust, et koostada valdkonna täpseid võrdlusaruandeid (benchmarke):

1. Site Type (Veebisaidi tüüp)

Kui haldate portaali, mis keskendub peamiselt artiklitele, tehnilistele juhenditele, uudistele või dokumentatsioonile, valige Informational website (Website with text content); kui tegemist on otsese rakenduse/mängu tutvustuslehega, võite valida Promo website:

2. Industry (Tegevusvaldkond)

Vastavalt oma veebisaidi sisule valige tehnoloogia, meedia, kultuur/kunst või kui loendis täpne vaste puudub, valige loendi lõpust valik Other:

3. CMS (Sisuhaldussüsteem)

Kui teie veebisait kasutab valmisplatvormi nagu WordPress, Drupal, Joomla või Wix, saate selle loendist valida. Kui kasutate spetsiaalselt enda loodud PHP/MySQL või .NET arhitektuuri, nagu meie portaal Mayhem Corporation, valige loendi lõpus valik Other:

4. CRM-süsteem

Kui te ei kasuta ettevõtte CRM-i, võite jätkata, valides selles väljas samuti Other (või Without CRM):

5. Your Role in the Project (Teie roll projektis)

Kui olete sõltumatu arendaja või stuudio asutaja, valige Business management või Product management ja klõpsake nuppu Continue:

---

Samm 3: Koodijupi paigaldamine (tag.js)

Viimases etapis loob Yandex Metrica ajakohastatud JavaScripti loendurikoodi (tag.js), mille asetate oma veebisaidi siltide <head> või <body> vahele:

Loodud ajakohase loendurikoodi struktuur on järgmine (teksti YOUR_TAG_ID asemele tuleb teie enda loendurinumber):

<!-- 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 -->

Pärast koodi lisamist oma veebisaidi põhimallile (index.php või header.php) ja selle serverisse üleslaadimist saate ekraanil olevale nupule "Check tag" klõpsates kontrollida, kas loendur töötab reaalajas, ning seejärel liikuda nupuga "Get started" oma analüütika juhtpaneelile.

---

2. Katkise Yandex Metrica visuaalse märgise (Informer) parandamine ja AdBlockeri kaitse

Aastatel 2011–2014 loodud veebisaitidel kutsuti Yandex Metrica ikoonilist türkiissinist 88x31 piksli suurust statistikamärgist (Informer) välja järgmise vana aadressi kaudu:

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

Kuna Yandex sulges aastate jooksul serveri bs.yandex.ru ja vana skripti watch.js, tagastab see aadress nüüd veateate HTTP 404 Not Found ning kuvab lehel katkise pildiikooni.

Lahendus 1: Ajakohane otspunkt informer.yandex.ru

Visuaalse märgise töölesaamiseks suuname pildiallika Yandexi praegusele Informeri teenusele (https://informer.yandex.ru/informer/...).

Lahendus 2: Kohalik varulahendus (onerror) AdBlockerit kasutavatele külastajatele

Tänapäeval kasutavad paljud mängijad ja arendajad oma brauseris laiendust AdBlocker (uBlock Origin, Brave Shield jne). Kui reklaamiblokeerijad blokeerivad analüütikadomeenid, ei pruugi märgise pilt uuesti laadida. Tagamaks, et kujundus ei laguneks ühelgi juhul, majutame märgise 88x31 piksli suurust koopiat oma serveris (images/yandex_metrica_badge.png) ja aktiveerime selle automaatselt atribuudi onerror abil:

<!-- 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.Metrica"
        title="Yandex.Metrica: 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 -->

Pärast seda muudatust kuvatakse Mayhem Corporationi vasakpoolses menüüs asuv Yandex Metrica märgis nii tavapärastes brauserites reaalajas statistikaga kui ka sisselülitatud AdBlockeriga brauserites ilma katkiste ikoonideta:

Aktiivne Yandex Metrica Informer märgis mayhemcorporation.com/mayhem/index.php vasakpoolses menüüs pärast värskendust.

Türkiissinine 88x31 Informer märgis, mis võtab kokku lehevaatamised, külastused ja unikaalsed külastajad.

---

3. Meie veebisait ja meie mängud (Arar Games)

Meie veebisait

• Mayhem Corporation: Meie veebiportaal mänguarenduse ja XNA / MonoGame tehniliste artiklitega.
  mayhemcorporation.com

Meie mängud

• Blocked: Pixel Panzer: 2D pikslitankide märuli- ja arkaadmäng.
  Google Play | Microsoft Store
• Paint Trek: 2D kosmoseteemaline arkaad- ja mõistatusmäng.
  Google Play | Microsoft Store
• Space Dodger: Refleksipõhine 2D kosmose arkaadmäng.
  Google Play

Sotsiaalmeedia

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