Luo mukautettu Google Tag Manager -pikseli

Voit käyttää Google Tag Manageria (GTM) mukautettuna pikselinä, jolla hallinnoit kolmannen osapuolen pikseleitä.

Kun olet valmis testaamaan mukautettua GTM-pikseliäsi, varmista Shopify Pixel Helperin avulla, että kaikki haluamasi tapahtumat lisätään testiympäristöön ilman virheitä.

Voit myös testata Google Tag Assistant -sivulaajennuksella, mitä Google-tunnisteita sivulle ladataan. Google Tag Assistantin Troubleshoot tag ‑ominaisuus ei kuitenkaan ole yhteensopiva mukautettujen pikseleiden kanssa. Se ei myöskään tunnista Google-tunnisteita mukautetussa pikselissä tai muissa GTM:n lataamissa pikselissä.

Huomaa

Ennen kuin luot mukautetun pikselin, tarkista saatavilla olevat sovellukset vakauden, suojauksen ja suorituskyvyn parantamiseksi. Voit käyttää Google Tag Manageria mukautettuna pikselinä, jos tarpeitasi vastaavaa sovellusta ei ole saatavilla.

Mukautetun pikselin luonnin valmistelu

Ennen kuin luot mukautetun pikselin Google Tag Managerin avulla, tutustu seuraaviin tietoihin varmistaaksesi, että ymmärrät, miten pikselisi määritetään:

• Luo tai avaa Google Tag Manager -tili ja hanki GTM Container -tunnus.
• Turvallisuuden vuoksi hiekkalaatikkoomme ladattuja tunnisteiden hallintatyökaluja koskevat samat rajoitukset kuin muissa pikseleissä. Lisätietoja pikseleiden hiekkalaatikkorajoituksista.

Mukautetun Google Tag Manager -pikselin luominen

Voit luoda mukautetun Google Tag Manager -pikselin, jolla hallinnoit kolmannen osapuolen pikseleitä.

Kasvata liiketoimintaasi

Tämä on edistyneille käyttäjille tarkoitettu tutoriaali, jota Shopify ei tue. Jos tarvitset apua mukautetun pikselin lisäämisessä, voit palkata Shopify Partnerin.

Ohjeet:

1. Avaa Google Tag Manager -tili ja valitse tili, jolla haluat määrittää mukautetun pikselin.
2. Avaa asennuskoodi klikkaamalla Adminja sitten Asenna Google Tag Manager.
3. Kopioi koodilohko, joka kuuluu sivun osaan head.
4. Poista HTML-tunnisteet tästä koodilohkosta. Voit esimerkiksi <script></script>.
5. Lisää jäljellä oleva koodi uuteen Shopifyn mukautettuun pikseliin.
6. Tilaa asiakastapahtumia ja vie ne GTM:n dataLayeriin.
7. Jos haluat tarkistaa, miten koodin pitäisi näkyä, tutustu mukautetun Google Tag Manager -pikselin esimerkkiin.
8. Määritä Google Tag Manager hyväksymään tapahtumia mukautetusta pikselistäsi.
9. Valinnainen: Jos sinulla on olemassa olevia dataLayer.push(tapahtuma) -kutsuja check.liquid-tiedostossasi, korvaa se analytics.publish()-kutsuilla.

Asiakastapahtumien tilaaminen ja vienti GTM:n datalayeriin

Voit tilata asiakastapahtumia käyttämällä mukautetussa pikselikoodissasi olevaa GTM:n dataLayeria.

Oletusarvoisesti sinulla on joukko vakiotapahtumia, joita voit tilata. Jos haluat kuitenkin seurata asiakastapahtumia, jotka eivät ole osa vakiotapahtumatarjontaa, voit julkaista omia mukautettuja tapahtumiasi Liquid-mallitiedostoista.

Alla on esimerkki tavallisen "product_viewed" -tapahtuman tilaamista varten. Tämä osoittaa, kun joku katsoo tuotetta. Kun tapahtuma käynnistyy, se vie tapahtuman dataLayeriin.

analytics.subscribe("product_viewed", (event) => {
  window.dataLayer.push({
    event: "product_viewed",
    product_title: event.data?.productVariant?.title,
  });
});

Tässä esimerkissä tuotteen nimi siirretään tapahtuman hyötykuormaan. Voit käyttää Google Tag Manager -muuttujaa, kun haluat napata tuotenimikkeen valitsemaasi tapahtumaan liittyvästä hyötykuormasta.

Esimerkki mukautetusta Google Tag Manager -pikselistä

Alla oleva esimerkki on mukautetun Google Tag Manager -pikselin yksinkertaistettu versio, jossa näytetään, miten tiedot lähetetään Google Tag Managerille. Jos haluat saada dataLayerille lisää tapahtumia, voit tilata enemmän vakiotapahtumia ja mukautettuja tapahtumia.

Huomaa

Tämä pikseliesimerkki sisältää myös esimerkkiasetukset, jotka vastaavat Googlen suostumustilaa (v2). Tämän tilan avulla pikseli voi noudattaa vierailijan evästeiden suostumusvalintoja liikenteelle (muun muassa Euroopan talousalueella). Voit lukea lisätietoja suostumustilasta Google Adsin ohjeista.

Nämä esimerkkiasetukset eivät välttämättä vastaa sitä, mitä kaupassasi edellytetään oman alueesi tietosuojalakien perusteella. Jos tarvitset apua mukautetun pikselin suostumusasetusten lisäämisessä tai muokkaamisessa, tutustu Googlen ohjeisiin suostumustilan käyttöön ottamiseksi verkkosivuilla tai palkkaa Shopify Partner -kumppani.

// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

//Initialize GTM tag
(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-XXXXXXX');

//Google Consent Mode v2
gtag('consent', 'update', {
  'ad_storage': 'granted',
  'analytics_storage': 'granted',
  'ad_user_data': 'granted',
  'ad_personalization': 'granted',
});

//subscribe to events
analytics.subscribe("checkout_completed", (event) => {
  window.dataLayer.push({
    event: "checkout_completed",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("payment_info_submitted", (event) => {
  window.dataLayer.push({
    event: "payment_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_shipping_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_shipping_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_address_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_address_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_contact_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_contact_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_started", (event) => {
  window.dataLayer.push({
    event: "checkout_started",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("product_added_to_cart", (event) => {
  window.dataLayer.push({
    event: "product_added_to_cart",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    price: event.data?.cartLine?.merchandise?.price?.amount,
    currency: event.data?.cartLine?.merchandise?.id,
    product_title: event.data?.cartLine?.merchandise?.product?.title,
    quantity: event.data?.cartLine?.quantity,
    total_cost: event.data?.cartLine?.cost?.totalAmount?.amount,
  });
});

analytics.subscribe("cart_viewed", (event) => {
  window.dataLayer.push({
    event: "cart_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    total_cost: event.data?.cart?.cost?.totalAmount?.amount,
    quantity: event.data?.cart?.totalQuantity,
    cart_id: event.data?.cart?.id,
  });
});

analytics.subscribe("page_viewed", (event) => {
  window.dataLayer.push({
    event: "page_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    page_title: event.context.document.title,
  });
});

analytics.subscribe("product_viewed", (event) => {
  window.dataLayer.push({
    event: "product_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    product_id: event.data?.productVariant?.product?.id,
    product_title: event.data?.productVariant?.title,
    product_sku: event.data?.productVariant?.sku,
  });
});

analytics.subscribe("search_submitted", (event) => {
  window.dataLayer.push({
    event: "search_submitted",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    query: event.data?.searchResult?.query,
  });
});

analytics.subscribe("collection_viewed", (event) => {
  window.dataLayer.push({
    event: "collection_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    collection_id: event.data?.collection?.id,
    collection_title: event.data?.collection?.title,
  });
});

Google Tag Managerin määrittäminen hyväksymään tapahtumia mukautetusta pikselistäsi

Kun olet luonut mukautetun pikselin, sinun on määritettävä Google Tag Manager hyväksymään tapahtumia mukautetusta pikselistäsi. Tarvitset tätä varten tunnisteen, käynnistimen ja Google Tag Managerin dataLayer-muuttujat.

Esimerkkejä valikoidusta vakioasiakastapahtumista ja niiden vastaavista Google Tag Manager -tapahtumista on lueteltu seuraavassa taulukossa:

Luettelo Shopifyn normaaleista asiakastapahtumista, joita käytetään yhdessä pikseleiden kanssa, ja niitä vastaavat asiakastapahtumat Google Tag Managerissa, sekä käynnistin, joka aloittaa tapahtumat.

Shopify-tapahtuma	Käynnistin	GTM-tapahtuma
payment_info_submitted	Maksutietojen lähettäminen	add_payment_info
checkout_address_info_submitted	Toimitustietojen lähettäminen	add_shipping_info
product_added_to_cart	Tuotteen lisääminen ostoskoriin	add_to_cart
checkout_started	Aloita kassavaihe	begin_checkout
checkout_completed	Suorita maksutapahtuma loppuun	osta
product_removed_from_cart	Poista tuotteet ostoskorista	remove_from_cart
cart_viewed	Näytä ostoskori	view_cart
product_viewed	Tuotetietosivun näyttäminen	view_item
collection_viewed	Tuoteluettelon näyttäminen	view_item_list

GTM-tunnisteen tapahtumaparametrien on vastattava odotettuja nimeämiskäytäntöjä, jotta mukautetut dataLayer-pikselitapahtumasi voidaan käsitellä.

Seuraavassa on esimerkkejä mukautetun pikselin dataLayer-tapahtuman ominaisuuksista ja niiden vastaavista Google Analytics 4 (GA4) -tapahtumaparametreista:

GA4-nimeämiskäytäntöä käyttävä mukautettujen dataLayer-pikselitapahtumien luettelo

Mukautetut dataLayer-pikselitapahtumat	GA4-tapahtumaparametrit
event.data?.checkout?.currencyCode	valuutta
event.data?.checkout?.totalPrice?.amount	value
event.data?.checkout?.order?.id	transaction_id
event.data?.checkout?.discountAllocations	kuponki
event.data?.checkout?.shippingLine?.price?.amount	toimitus
event.data?.checkout?.totalTax	vero
event.data?.checkout?.lineItems	tuotteet

Esimerkki, jossa käytetään seuraavaa checkout_completed-tapahtumaa:

analytics.subscribe("checkout_completed", (event) => {
  window.dataLayer.push({
    event: "checkout_completed",
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    price: event.data.checkout.totalPrice.amount,
    shippingLine: event.data.checkout.shippingLine.price.amount,
    totalTax: event.data.checkout.totalTax,
  });
});

Google Tag Manager -käynnistin on mukautettu tapahtumatyyppi, jonka nimi on checkout_completed. Käynnistimen Tapahtuman nimi -kentän on vastattava mukautetun pikselisi tapahtuma-avainta.

orderId ja currency ovat muuttujia, joita käytät Google Tag Managerissa tietojen tallentamiseen tapahtumasta. Ne voidaan yhdistää Google Tag Managerin dataLayer-muuttujaan. Jokainen tapahtumamuuttuja edellyttää omaa dataLayer-muuttujaa. Aseta käynnistin käynnistymään kaikissa mukautetuissa tapahtumissa.

Luo tunniste, joka käyttää juuri luomaasi käynnistintä. Lisää tapahtumaparametrit-kohdassa muuttujat, jotka haluat tallentaa. Yllä olevassa esimerkissä orderId, valuutta, hinta, shippingLine ja totalTax määritettäisiin dataLayer-muuttujiksi. Joka kerta, kun tunniste käynnistyy, se poimii nämä dataLayer-muuttujat tapahtumasta.

Huomaa, että Google Tag Managerissa on määritettävä vähintään yksi tunniste ja käynnistin, jotta tiedonsiirto voisi tapahtua.

Vanhojen dataLayer.push(event) -kutsujen korvaaminen analytics.publish() -palvelulla

Jos olet aiemmin määrittänyt Google Tag Managerin, sinun on vaihdettava dataLayer.push-kutsusi Shopify.analytics.publish()-kutsuihin. Löydät dataLayer.push-kutsut teemaeditorin Asettelu-osiossa olevista theme.liquid-tiedostoistasi.

Sinun täytyy myös korvata dataLayer.push-kutsut checkout.liquidissa. Koska checkout.liquid ei kuitenkaan ole yhteensopiva Shopify Extensions ‑laajennusten kanssa, sinun on käytettävä käyttöliittymälaajennuksia tietojen viemiseen verkkopikseleihin push-toiminnolla.

Alla on yksinkertaistettu esimerkki mukautetusta sähköpostien kirjautumistapahtumasta, jota seurataan theme.liquid-tiedostojen dataLayerin avulla.

<script>
  dataLayer.push({ event: 'email_signup', email: customer.email });
</script>

Shopifyn vastine näkyy näin, ja se vie tiedot mukautettuun pikseliisi.

<script>
  Shopify.analytics.publish('email_signup', {email: customer.email });
</script>

Lisää sitten Mukautetun pikselin koodisi ‑kohtaan jotain tällaista.

analytics.subscribe("email_signup", (event) => {
  window.dataLayer.push({
   'event': 'email_signup',
   'email': event.customData.email,
  });
});

Korvaa vanha dataLayer.push(data)

Google Tag Managerissa on ominaisuus, jonka avulla voit viedä eri tiloja tukevan dataLayer-objektin jokaisessa tapahtumassa. Vaikka Shopifyn pikselin eristysympäristö ei sisällä vastaavaa ominaisuutta, voit saavuttaa saman tuloksen luomalla oman dataobjektisi ja viemällä sen mukautettuihin tapahtumiin.

Määritä esimerkiksi "customData"-objekti, ennen kuin mitään mukautettua tapahtumaasi julkaistaan.

<script>
  const customData = {email: customer.email}
</script>

Siirrä se sitten julkaisumenetelmääsi aina, kun haluat sisällyttää mukautetut tietosi.

<script>
  Shopify.analytics.publish('email_signup', customData);
</script>

Huomaa

Shopify ei tällä hetkellä tue mukautettujen tietojen lisäämistä vakiotapahtumiin. Jos tarvitset tätä, voit julkaista omia mukautettuja tapahtumiasi vakiotapahtumien korvaamista varten.

Vinkkejä Google Analytics 4:n määrittämiseen

Ota huomioon seuraavat Google Analytics 4:n (GA4) määrittämiseen liittyvät vihjeet, kun käytät Google Tag Manageria mukautettuna pikselinä.

Selkeämmät sivun URL-osoitteet

Kun GA4 on käynnissä hiekkalaatikossa, saatat huomata, että sivun URL-osoitteet sisältävät tietoja hiekkalaatikosta, jossa se toimii. Jos haluat poistaa hiekkalaatikkotiedot kyseisistä URL-osoitteista, voit poistaa GA4:n automaattisen sivujen seurannan käytöstä ja sen sijaan ottaa käyttöön oman page_viewed-vakiotapahtuman avulla.

analytics.subscribe('page_viewed', (event) => {
  window.dataLayer.push({
   'event': 'page_viewed',
   'page_location': event.context.window.location.href,
   'page_title': event.context.document.title,
  });
});

Kun olet julkaissut oman tapahtumasi dataLayer-koodissa, voit luoda GA4 page_view-tunnisteen, joka käynnistyy page_viewed-tapahtumassa. Yleisimmin voit käyttää Google Analytics GA4 Event ‑tunnistetyyppiä ja määrittää tapahtuman nimeksi page_view. Kun olet määrittänyt tunnistetyypin ja tapahtuman nimen, lisää parametri kohteelle page_location ja määritä arvoksi sama arvo, jonka olet siirtänyt dataLayer-koodiin mukautetulta pikseliltäsi.

Tehostettu mittaus

Kun lataat GA4:n Shopifyn pikselin hiekkalaatikkoon, jotkin tapahtumat, jotka normaalisti päätellään automaattisesti, on määritettävä manuaalisesti. Esimerkiksi lähtevien linkkien klikkauksia, osana GA4:n tehostetun mittauksen asetusta, ei voi käynnistää automaattisesti turvallisuussyistä, kun käytät mukautettuja pikseleitä. Voit kuitenkin ottaa itse käyttöön GA4:n tehostetun mittauksen tapahtumat mukautettuina tapahtumina.

Alla oleva koodi sisältää yksinkertaistetun esimerkin sivulta pois vievien linkkien klikkausten seurannasta.

<script>
  function detectOutboundLink() {
    // add your logic for determining if a link click is outbound

    // if the link click is outbound then publish it
    if (isOutboundLink) {
      Shopify.analytics.publish('outbound_link', { link_url: link_url });
    }
  }
</script>

Luo lopuksi GTM:ssä GA4-tunniste, joka lähettää linkin klikkauksen GA4:lle varmistamalla, että tapahtuman nimeä klikataan, jotta voidaan vastata GA4:n tehostetun tapahtuman nimeämiseen.

Voit saavuttaa saman seurannan kaikilla Googlen tehostetun tapahtuman mittareilla.

Mukautetun pikselin testaus ja virheenkorjaus

Kun olet valmis testaamaan mukautettua GTM-pikseliäsi, varmista Shopify Pixel Helperin avulla, että kaikki haluamasi tapahtumat lisätään testiympäristöön ilman virheitä.

Voit myös testata Google Tag Assistant -sivulaajennuksella, mitä Google-tunnisteita sivulle ladataan. Google Tag Assistantin Troubleshoot tag ‑ominaisuus ei kuitenkaan ole yhteensopiva mukautettujen pikseleiden kanssa. Se ei myöskään tunnista Google-tunnisteita mukautetussa pikselissä tai muissa GTM:n lataamissa pikselissä.