> ## 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.

# Jak korzystać z linków UTM prowadzących bezpośrednio do checkoutu

> Dowiedz się, jak uruchamiać lejki post-purchase za pomocą parametrów UTM, w tym jak skonfigurować linki prowadzące bezpośrednio do checkoutu

Aftersell obsługuje uruchamianie lejków na podstawie parametrów UTM — to opcjonalna funkcja przeznaczona specjalnie do zaawansowanych zastosowań. Możesz skonfigurować lejek tak, aby aktywował się, gdy klient odwiedzi Twoją stronę z określonym ciągiem zapytania UTM.

Ta konfiguracja jest opcjonalna i zwykle potrzebna tylko w przypadku zaawansowanych potrzeb śledzenia, takich jak linki prowadzące bezpośrednio do checkoutu lub oferty powiązane z konkretnymi kampaniami.

<div id="how-utm-triggers-work">
  ## Jak działają wyzwalacze UTM
</div>

Wyzwalacze UTM pozwalają wyświetlać określone lejki post-purchase na podstawie parametrów UTM w adresie URL. Jest to przydatne do:

* **Ofert powiązanych z kampanią** — pokazuj różne upselle w zależności od kampanii marketingowej
* **Linków prowadzących bezpośrednio do checkoutu** — uruchamiaj lejki, gdy klienci pomijają witrynę sklepu
* **Atrybucji kanałów** — personalizuj oferty na podstawie źródła ruchu (e-mail, media społecznościowe, reklamy)
* **Testów A/B** — testuj różne oferty dla różnych wariantów kampanii

<div id="quick-start-basic-utm-trigger-setup">
  ## Szybki start: podstawowa konfiguracja wyzwalacza UTM
</div>

W przypadku standardowych wizyt w witrynie sklepu (a nie bezpośrednio w checkoucie) możesz skonfigurować wyzwalacze UTM za pomocą app embed Aftersell. Aby zobaczyć, jak szybko zacząć korzystać z wyzwalaczy UTM, obejrzyj ten film:

<iframe src="https://go.screenpal.com/player/cOfD38nOD9i" title="Jak skonfigurować wyzwalacze UTM" allowFullScreen style={{ width: '100%', aspectRatio: '16/9', borderRadius: '12px' }} />

<div id="enable-the-utm-app-embed">
  ### Włącz app embed UTM
</div>

Aby śledzić parametry UTM na stronach witryny sklepu:

1. W panelu administracyjnym Shopify przejdź do **Online Store > Themes**
2. Kliknij **Customize** przy swoim aktywnym szablonie
3. W edytorze szablonu kliknij ikonę **App embeds** (puzzel) na lewym pasku bocznym
4. Znajdź **Aftersell UTM Tracker** i przełącz go na **włączony**
5. Kliknij **Save**

Po włączeniu Aftersell automatycznie przechwyci parametry UTM, gdy klienci odwiedzą Twoją witrynę sklepu z linkami UTM.

<div id="configure-utm-triggers-in-your-funnel">
  ### Skonfiguruj wyzwalacze UTM w swoim lejku
</div>

Po włączeniu app embed:

1. Przejdź do **Post-purchase Funnels** w panelu administracyjnym Aftersell
2. Utwórz lub edytuj lejek
3. W sekcji **Triggers** dodaj wyzwalacz **UTM Parameter**
4. Skonfiguruj parametr UTM i wartość, które mają być dopasowane
5. Zapisz lejek

<div id="supported-utm-parameters">
  ## Obsługiwane parametry UTM
</div>

Aftersell obsługuje następujące standardowe parametry UTM:

* `utm_source` — identyfikuje źródło ruchu (np. google, newsletter, facebook)
* `utm_medium` — identyfikuje medium marketingowe (np. email, cpc, social)
* `utm_campaign` — identyfikuje konkretną kampanię (np. spring\_sale, product\_launch)
* `utm_term` — identyfikuje słowa kluczowe płatnego wyszukiwania (np. running+shoes)
* `utm_content` — rozróżnia podobne treści lub linki (np. banner\_ad, text\_link)
* `utm_id` — identyfikuje ID kampanii (np. campaign\_123)

Wszystkie sześć parametrów jest śledzonych i można ich używać do uruchamiania lejków.

<div id="partial-field-matching">
  ## Częściowe dopasowanie pól
</div>

Podczas konfigurowania wyzwalaczy UTM Aftersell obsługuje **częściowe dopasowanie** wartości parametrów UTM. Oznacza to:

* ✅ **Wartość wyzwalacza:** `spring` → **Pasuje do:** `spring_sale`, `spring_2026`, `early_spring`
* ✅ **Wartość wyzwalacza:** `email` → **Pasuje do:** `email_newsletter`, `promotional_email`
* ✅ **Wartość wyzwalacza:** `sale` → **Pasuje do:** `spring_sale`, `flash_sale`, `sale_2026`

Ta elastyczność pozwala tworzyć szersze wyzwalacze pasujące do wielu wariantów kampanii bez konieczności tworzenia osobnych wyzwalaczy dla każdego z nich.

**Przykład:** Jeśli ustawisz wyzwalacz dla `utm_campaign` zawierającego `sale`, dopasuje on każdą kampanię z „sale” w nazwie, np. `spring_sale`, `summer_sale` lub `flash_sale_2026`.

<div id="direct-to-checkout-utm-links">
  ## Linki UTM prowadzące bezpośrednio do checkoutu
</div>

Podstawowa konfiguracja pokazana w powyższym filmie **nie** obsługuje linków, które kierują klientów **bezpośrednio do checkoutu**. Domyślnie Aftersell może wykrywać parametry UTM tylko na stronach witryny sklepu. Wynika to z faktu, że opiera się na app embed szablonu, który działa wyłącznie na stronach witryny sklepu, a nie na stronie checkoutu ani na stronie z podziękowaniem.

<div id="enable-utm-tracking-on-checkout-pages">
  ### Włącz śledzenie UTM na stronach checkoutu
</div>

Aby śledzić parametry UTM na stronie checkoutu (dla linków prowadzących bezpośrednio do checkoutu), musisz **dodać piksel Shopify** do swojego sklepu.

⚠️ **Ważne ograniczenia:**

* Ta konfiguracja wymaga, aby odwiedzający miał **token koszyka**, gdy trafia do checkoutu przez link UTM. Bez tokena koszyka dane UTM nie zostaną przechwycone.
* **Ekspresowe metody płatności (Shop Pay, Apple Pay, Google Pay) nie są obsługiwane**, ponieważ pomijają koszyk i nie generują tokena koszyka. Klienci korzystający z ekspresowego checkoutu nie uruchomią lejków opartych na UTM.

<div id="setting-up-the-shopify-pixel">
  ### Konfiguracja piksela Shopify
</div>

Postępuj zgodnie z poniższymi instrukcjami krok po kroku, aby skonfigurować śledzenie UTM dla linków prowadzących bezpośrednio do checkoutu:

1. W panelu administracyjnym Shopify przejdź do **Settings > Customer Events**.
2. Kliknij **Add Custom Pixel** i nadaj mu dowolną nazwę.
3. W menu rozwijanym **Permission** wybierz **Analytics**. To jedyne wymagane uprawnienie.
4. W menu rozwijanym **Data Sale** możesz wybrać **Data collected does not qualify as data sale**. Aftersell zachowuje wszystkie zebrane dane jako prywatne i nigdy nie udostępnia ich nikomu poza Tobą.
5. W wyświetlonym edytorze kodu wklej kod podany poniżej.
6. Kliknij **Save**, a następnie **Connect**.

```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
/**  
 * IMPORTANT: This pixel can only fire on sessions where the  
 * customer has a cart object, otherwise it will be skipped.  
 * For example, clicking "Buy Now" on a product page skips the cart,  
 * going directly to checkout.  
**/  
function processData({event, cartToken}) {  
  // TODO: Edit MYSHOPIFY_DOMAIN to your domain. E.g.  
  // const MYSHOPIFY_DOMAIN = 'example-store.myshopify.com';  
  const MYSHOPIFY_DOMAIN = '';  
  
  const enableDebug = false;  
  
  // DO NOT EDIT PAST HERE  
  const SESSION_STORAGE_KEY = 'as-customer-trigger-data';  
  const HOST = 'https://start.aftersell.app';  
  
  if (!MYSHOPIFY_DOMAIN) {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because of missing Shopify domain");  
    }  
    return;  
  }  
  if (!cartToken) {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because of missing cart token");  
    }  
  }  
    
  let existingCustomerData = null;  
  try {  
      existingCustomerData = JSON.parse(  
          sessionStorage.getItem(SESSION_STORAGE_KEY) || 'null'  
      );  
  } catch (ignore) {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because malformed user data json");  
    }  
  }  
    
  const allowedUrlParams = [  
        'utm_source',  
        'utm_medium',  
        'utm_campaign',  
        'utm_term',  
        'utm_id',  
        'utm_content',  
    ];  
    
  const searchParams = new URLSearchParams(event.context.window.location.search);  
  let hasCustomerData = false;  
  const customerData = {};  
  for (const param of allowedUrlParams) {  
    const paramValue = searchParams.get(param) || existingCustomerData?.[param];  
    if (paramValue) {  
        hasCustomerData = true;  
        customerData[param] = paramValue;  
    }  
  }  
  
  if (hasCustomerData) {  
    sessionStorage.setItem(SESSION_STORAGE_KEY, JSON.stringify(customerData));  
  
    const postBody = {  
      shop: MYSHOPIFY_DOMAIN,  
      cartToken,  
      checkoutToken: event.data.checkout.token ?? undefined,  
      customerTriggerData: customerData,  
    };  
  
    if (enableDebug) {  
      console.log("UTM pixel fired with the following data:", postBody);  
    }  
      
    fetch(`\${HOST}/api/v1/storefrontSessions`, {  
        method: 'POST',  
        headers: {  
            'Content-Type': 'application/json',  
        },  
        body: JSON.stringify(postBody),  
    });  
  } else {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because there was no data to send");  
    }  
  }  
}  
  
analytics.subscribe('checkout_started', (event) => {  
   // minimum realistic time between adding item to cart and clicking checkout  
    const COOKIE_POLLING_INTERVAL_MS = 500;  
  
    let currentCookieValue = getCookieValue({ cookie: document.cookie, cookieName: 'cart' });  
    processData({event, cartToken: currentCookieValue});  
  
    setInterval(() => {  
        const newCookieValue = getCookieValue({ cookie: document.cookie, cookieName: 'cart' });  
        if (newCookieValue !== currentCookieValue) {  
            currentCookieValue = newCookieValue;  
            processData({event, cartToken: newCookieValue});  
        }  
    }, COOKIE_POLLING_INTERVAL_MS);  
});  
  
function getCookieValue({ cookie, cookieName }) {  
    const cartCookieRegex = new RegExp(`^\${cookieName}=`);  
    const cartCookie = cookie  
        .split(';')  
        .map((val) => val.trim())  
        .find((val) => cartCookieRegex.test(val));  
    if (!cartCookie) return null;  
    const cartCookieValue = cartCookie.replace(`\${cookieName}=`, '');  
    return cartCookieValue;  
}
```

**Ważne uwagi dotyczące konfiguracji:**

* **Edytuj `MYSHOPIFY_DOMAIN`:** musisz zastąpić pusty ciąg domeną myshopify.com Twojego sklepu (np. `'example-store.myshopify.com'`)
* **Włącz tryb debugowania (opcjonalnie):** ustaw `enableDebug = true`, aby widzieć logi w konsoli podczas rozwiązywania problemów
* **Obsługiwane parametry:** piksel śledzi wszystkie sześć standardowych parametrów UTM wymienionych w tablicy `allowedUrlParams`

<div id="testing-your-utm-trigger-setup">
  ## Testowanie konfiguracji wyzwalaczy UTM
</div>

Po skonfigurowaniu wyzwalaczy UTM skorzystaj z tej listy kontrolnej, aby sprawdzić, czy wszystko działa poprawnie:

<div id="for-storefront-utm-tracking-app-embed">
  ### Śledzenie UTM w witrynie sklepu (app embed)
</div>

* ✅ **App embed włączony:** sprawdź, czy app embed Aftersell UTM Tracker jest włączony w ustawieniach szablonu
* ✅ **Testowy URL:** odwiedź swój sklep z parametrem UTM (np. `yourstore.com?utm_campaign=test`)
* ✅ **Sfinalizuj zakup:** dodaj produkt do koszyka i przejdź przez checkout
* ✅ **Sprawdź lejek:** upewnij się, że odpowiedni lejek pojawia się na stronie z podziękowaniem
* ✅ **Order Browser:** sprawdź w Aftersell Order Browser, czy wyzwalacz UTM został wykryty

<div id="for-direct-to-checkout-utm-tracking-shopify-pixel">
  ### Śledzenie UTM bezpośrednio do checkoutu (piksel Shopify)
</div>

* ✅ **Piksel zainstalowany:** sprawdź, czy niestandardowy piksel jest zapisany i podłączony w Settings > Customer Events
* ✅ **Domena skonfigurowana:** potwierdź, że `MYSHOPIFY_DOMAIN` jest poprawnie ustawiony w kodzie piksela
* ✅ **Token koszyka obecny:** upewnij się, że klient ma produkty w koszyku przed przejściem do checkoutu (wymagane do śledzenia)
* ✅ **Testowy URL:** użyj linku prowadzącego bezpośrednio do checkoutu z parametrami UTM (np. `yourstore.com/checkout?utm_campaign=test`)
* ✅ **Sfinalizuj zakup:** ukończ proces checkoutu
* ✅ **Sprawdź lejek:** upewnij się, że odpowiedni lejek pojawia się na stronie z podziękowaniem
* ✅ **Order Browser:** sprawdź w Aftersell Order Browser, czy wyzwalacz UTM został wykryty
* ⚠️ **Ekspresowy checkout:** pamiętaj, że Shop Pay, Apple Pay i Google Pay NIE będą działać z wyzwalaczami UTM

<div id="troubleshooting-tips">
  ### Wskazówki dotyczące rozwiązywania problemów
</div>

Jeśli wyzwalacze UTM nie działają:

1. **Włącz tryb debugowania:** ustaw `enableDebug = true` w kodzie piksela i sprawdź komunikaty o błędach w konsoli przeglądarki
2. **Zweryfikuj token koszyka:** upewnij się, że klienci mają produkty w koszyku przed dotarciem do checkoutu (piksel wymaga tokena koszyka)
3. **Sprawdź konfigurację wyzwalacza:** upewnij się, że parametr UTM i wartość w wyzwalaczu lejka odpowiadają parametrom w adresie URL
4. **Przetestuj częściowe dopasowanie:** pamiętaj, że wyzwalacze używają dopasowania częściowego — `sale` dopasuje `spring_sale`, `flash_sale` itd.
5. **Sprawdź priorytet lejków:** jeśli pasuje kilka lejków, wyświetli się tylko lejek o najwyższym priorytecie
6. **Przejrzyj Order Browser:** użyj Aftersell Order Browser, aby zobaczyć, które wyzwalacze zadziałały dla każdego zamówienia

<div id="best-practices-for-utm-triggers">
  ## Najlepsze praktyki dotyczące wyzwalaczy UTM
</div>

* **Stosuj spójne nazewnictwo:** ustal konwencję nazewnictwa dla parametrów UTM (np. `utm_campaign=email_spring_2026`)
* **Wykorzystuj częściowe dopasowanie:** używaj szerszych wartości wyzwalaczy, aby dopasować wiele wariantów kampanii
* **Testuj przed uruchomieniem:** zawsze testuj linki UTM i wyzwalacze przed wysłaniem ich do klientów
* **Dokumentuj kampanie:** prowadź rejestr parametrów UTM używanych w każdej kampanii
* **Łącz z innymi wyzwalaczami:** używaj wyzwalaczy UTM razem z wyzwalaczami produktowymi lub opartymi na wartości zamówienia, aby uzyskać precyzyjniejsze targetowanie
* **Monitoruj wyniki:** regularnie sprawdzaj Order Browser, aby zobaczyć, które kampanie UTM generują najwięcej upselli
