> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Konfiguration af Shopify web pixels

> Opsætning af konverteringssporing med Web Pixels sammen med post-purchase-upsells

[Shopify Web Pixels](https://help.shopify.com/en/manual/promoting-marketing/pixels) er Shopifys løsning til at spore data om køb, såsom konverteringsrater. Der er to primære måder, du vil interagere med dem på:

* App Web Pixels
* Custom Web Pixels

<div id="app-web-pixels">
  # App Web Pixels
</div>

Nogle app-pixels (f.eks. Omega Facebook Pixel) integrerer direkte med Shopify Web Pixels. Disse apps kræver ingen yderligere opsætning for at fungere med Aftersell.

<div id="custom-web-pixels">
  # Custom Web Pixels
</div>

Brugerdefinerede pixels giver mulighed for skræddersyede løsninger, hvis der ikke findes en app-pixel på Shopify-marketplacen, der opfylder dine behov. Nedenfor beskrives, hvordan du konverterer eksisterende sporingsscripts på ordrestatussiden til at bruge brugerdefinerede pixels. Bemærk venligst de [potentielle risici ved brugerdefinerede pixels](https://help.shopify.com/en/manual/promoting-marketing/pixels/overview#potential-risks), før du fortsætter.

Hvis du specifikt bruger Google Tag Manager, leverer Shopify [nyttig dokumentation til at gennemføre denne migrering](https://help.shopify.com/en/manual/promoting-marketing/pixels/custom-pixels/gtm-tutorial).

Der er 3 kernetrin i at oprette en brugerdefineret pixel til konverteringssporing.

1. Forberedelse af tredjeparts JavaScript SDK
2. Opsætning af konverteringssporing med web pixels
3. Tilslutning af din brugerdefinerede pixel

<div id="1-preparing-the-3rd-party-javascript-sdk">
  ## 1. Forberedelse af tredjeparts JavaScript SDK
</div>

Du skal fjerne al HTML i den leverede pixelkode. Alt JavaScript, der indlæses via et HTML `<script>`-tag, skal i stedet indlæses via en tilgang med ren JavaScript.

Denne proces er dækket mere detaljeret [her](https://help.shopify.com/en/manual/promoting-marketing/pixels/custom-pixels/code#third-party-sdk).

Et eksempel med Google Tag Manager

*Oprindelig pixelkode:*

```
<!-- Global site tag (gtag.js) - Google Analytics -->  
<script async src="https://www.googletagmanager.com/gtag/js?id=YOUR_PIXEL_ID"></script>  
<script>  
  window.dataLayer = window.dataLayer || [];  
  function gtag(){dataLayer.push(arguments);}  
  gtag('js', new Date());  
  gtag('config', ''YOUR_PIXEL_ID'');  
</script>
```

*Efter fjernelse af HTML og omarbejdning af `<script>`-tags:*

```
const script = document.createElement('script');  
script.setAttribute('src', 'https://www.googletagmanager.com/gtag/js?id=YOUR_PIXEL_ID');  
script.setAttribute('async', '');  
document.head.appendChild(script);  
  
window.dataLayer = window.dataLayer || [];  
function gtag(){dataLayer.push(arguments);}  
gtag('js', new Date());  
gtag('config', 'YOUR_PIXEL_ID');
```

Bemærk, at Googles pixel-SDK ikke automatisk sender data fra en Shopify custom pixel. For at sende data skal du abonnere på events.

<div id="2-setting-up-conversion-tracking-using-web-pixels">
  ## 2. Opsætning af konverteringssporing med web pixels
</div>

For at spore konverteringer med brugerdefinerede pixels skal du abonnere på `checkout_completed`-eventet, som Shopify stiller til rådighed. Dette event udløses enten på post-purchase-siden, hvis en sådan vises for din kunde, eller på takkesiden, hvis ikke. Eventet udløses kun én gang i begge tilfælde, så der kræves ingen ekstra logik for at undgå at tælle et køb dobbelt.

```
analytics.subscribe("checkout_completed", (event) => {  
  // process event using 3rd party pixel tracking code  
});
```

Brug denne reference til at se, hvilke datapunkter du kan hente fra `event`.

[Shopify checkout\_completed event](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed)

Et eksempel på en brugerdefineret Meta-pixel

*Sporingskode, der udløses, når en checkout gennemføres:*

```
!function(f,b,e,v,n,t,s)  
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?  
n.callMethod.apply(n,arguments):n.queue.push(arguments)};  
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';  
n.queue=[];t=b.createElement(e);t.async=!0;  
t.src=v;s=b.getElementsByTagName(e)[0];  
s.parentNode.insertBefore(t,s)}(window, document,'script',  
'https://connect.facebook.net/en_US/fbevents.js');  
  
// replace YOUR_PIXEL_ID with the pixel ID provided by third-party  
fbq('init', YOUR_PIXEL_ID);  
  
analytics.subscribe("checkout_completed", (event) => {  
  fbq('track', 'Purchase', {  
    currency: event.data?.checkout?.currencyCode,  
    value: event.data?.checkout?.totalPrice?.amount,  
  });  
});
```

<div id="3-connecting-your-custom-pixel">
  ## 3. Tilslutning af din brugerdefinerede pixel
</div>

Før du tilføjer en brugerdefineret pixel, skal du fjerne eller ændre eventuelle eksisterende pixels for at sikre, at kundeevents ikke tælles dobbelt. Eksisterende pixelkode skal fjernes manuelt alle de steder, den findes, såsom `theme.liquid`, `checkout.liquid` (kun Plus-forhandlere) og Additional scripts i dine checkout-indstillinger.

Når det er gjort, skal du følge disse trin for at tilslutte en brugerdefineret pixel til din butik.

1. Gå til Settings > Customer Events > Custom Pixels > Add Custom Pixel

   1. Indtast et navn til din brugerdefinerede pixel.
2. Indsæt din brugerdefinerede pixelkode i sektionen "Code".
3. Sørg for, at indstillingerne for kundens privatliv er korrekt konfigureret.
4. Klik på "Save" på din brugerdefinerede pixel.
5. Klik på "Connect" for at sætte din brugerdefinerede pixel live!