Získavanie údajov z Rich Snippet schémy

Google Tag Manager

Ak by ste sa opýtali webového analytika, kto je jeho najväčší kamarát, určite vám odpovie, že je to dataLayer. Niekedy však v dataLayeri potrebné informácie chýbajú a developeri, ktorí by tam daný údaj vedeli vložiť sú, samozrejme, zaneprázdnení. Dnes si ukážeme, ako cez GTM získať dáta z Rich Snippet schémy.

Google Tag Manager

Čo sú to rich snippety?

Rich snippety, alebo vo voľnom preklade štruktúrované dáta, sú najväčšími kamarátmi SEOčkárov. Do rich snippet schémy je možné vložiť informácie, ktoré pomáhajú vyhľadávačom lepšie pochopiť obsah na webe. Správne používané rich snippety potom pomáhajú webu získavať lepšie (a aj vizuálne zaujímavejšie) pozície vo vyhľadávačoch.

Príklad použitia rich snippetu pre recepty:

rich snippet recipe pancakes

Aké hodnoty môžu rich snippety obsahovať?

Ako sa hovorí, it depends. Rich snippetov je obrovské množstvo a každý typ obsahuje inú štruktúru dát. Ak si zoberieme ako príklad recepty, rich snippety môžu obsahovať zoznam ingrediencií, dĺžku prípravy, kalorické hodnoty, jednotlivé kroky receptu, fotografie, hodnotenie a pod.

Rich snippet sa nachádza v hlavičke webu, v sekcii <head> a vyzerá nasledovne:

<script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Recipe",
      "name": "Banana Bread Recipe",
      "description": "The best banana bread recipe you'll ever find! Learn how to use up all those extra bananas.",
      "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": "4.7",
        "ratingCount": "123"
      },
      "video": {
        "@type": "VideoObject",
        "name": "How To Make Banana Bread",
        "description": "This is how you make banana bread, in 5 easy steps.",
        "contentUrl": "http://www.example.com/video123.mp4"
       }
    }
    </script>

Vytvorenie Custom JavaScript premennej v GTM

Na to, aby sme k niektorému z týchto údajov vedeli pristupovať, budeme potrebovať vlastnú JavaScript premennú. Ak ste s JavaScriptom nikdy nepracovali, vôbec to nevadí. Bude vyzerať nasledovne bez ohľadu na to, ktorý parameter z ld+json scriptu chcete vytiahnuť – zmeníte len cestu pri príkaze return. Ak napríklad chceme získať hodnotenie (ratingValue), naša premenná bude vyzerať nasledovne:

function() {
   var ldjson = document.querySelector('[type="application/ld+json"]');
   var json = JSON.parse(!!ldjson ? ldjson.innerHTML : '{}');
   return json.aggregateRating.ratingValue;
 }

Takto získaný údaj uložený do vlastnej premennej potom môžete použiť akokoľvek potrebujete – či už do vlastnej dimenzie pre Universal Analytics, alebo ako parameter v GA4.