Klaviyo Nedir?

Dijital Pazarlama Kampanyaları İçin E-posta ve SMS İşlemleri

Klaviyo, son dönemde, özellikle Shopify mağazaları özelinde sıklıkla karşıma çıkan dijital pazarlama çözümlerinden biri durumunda. Bu yazıda Klaviyo ve Google Tag Manager aracılığı ile formların izlenmesine yönelik yapılan işlemleri paylaşmaya çalışacağım.

AA

Klaviyo, müşterilerin ve müşteri adaylarının izinleri dahilinde, e-ticaret sitesindeki aktiviteleri temel alınarak e-posta adresleri ve telefon numaraları aracılığı ile marka ve ürünlerle ilgili özelleştirilmiş hedefli bildirimler gönderilebilmesini sağlayan bir çevrimiçi dijital pazarlama otomasyon platformu1.

Klaviyo

2012 yılında kurulan platform sepette bırakılan ürünler, ödeme işlem durumları, ek veri beslemeleri, entegrasyonlar (dijital pazarlama servisleri, e-ticaret platformları, ödeme sistemleri, vb.) ile kapsamlı bir şekilde müşteri durumlarının yönetilebilmesi gibi özellikler sunmakta2.

Klaviyo - Template

Klaviyo ile sürükle-bırak ile düzenlenebilen tasarım şablonları ile kolayca e-posta bültenleri hazırlamak, esnek hedefleme seçenekleri ile ilişkilendirmek ve A/B testleri ile optimize etmek gibi pek çok işlem pratik bir şekilde gerçekleştirilebilmekte.

Klaviyo - Integrations
Klaviyo - Form

Davranış temelli otomasyon & zengin segmentasyon (son e-posta bülteni ile etkileşime geçmiş, alışveriş işlemi gerçekleştirmiş, belirli sayfaları görüntülemiş, belirli ürün ya da ürün grupları ile etkileşime geçmiş, belirli bir konumda bulunan, belirli profil veya modellenmiş özelliklere sahip kullanıcılar ve en çok satan ürünlerle, kupon ve indirimli işlemler, kargo ve sipariş durumu gibi kriterler gibi) seçenekleri ile bültenleri yönetmenin oldukça kolay olduğu platform ayrıca ilgili grupların analitik araçlar ve raporlar aracılığı ile güncel olarak değerlendirilebilmesini mümkün kılmakta.

Katalog Kullanımı

Klaviyo, entegrasyon gerçekleştirilen e-ticaret platformundaki ürünleri Catalog altında listeler ve bu sayede ilgili ürünler bültenlere kolayca ve otomatik olarak dahil edilebilir3.

Klaviyo - Integrations

Buna ek olarak, Custom Sources aracılığı ile JSON veya XML formatında farklı veri kaynakları da (Google Merchant gibi) katalog içerisine dahil edilebilir.

Klaviyo Etkinlik İzleme (Tracking) İşlemleri

Klaviyo ile Shopify4 5 6, WooCommerce7 başta olmak üzere daha pek çok popüler e-ticaret sistemine yönelik doğrudan ve dolaylı çözümler sunmakta2. Abonelik formu oluşturma, kampanyalar, bülten şablonları gibi işlemler yine Klaviyo web sitesi üzerinden yürütülmekte.

Klaviyo - Shopify App Embed

Shopify için uygulamanın yüklenmesi ile birlikte Klaviyo script dosyası head etiketleri arasına eklenmektedir.

<script type="text/javascript" async="" src="https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=API_KEY"></script>

window.klaviyoModulesObject.companyId ya da window.__klKey ile companyId değerine ulaşılabilir. Elbette uygulama dışında da kurulum gerçekleştirilebilir8 9 10.

Klaviyo - Public API Key / Site ID

Bu durumda companyId veya diğer ifadelerle Public API Key / Site ID'e Account > Settings > API Keys adımlarını izlenerek ulaşılabilir11. İlgili değer ulaşılan sayfada, Public API Key / Site ID sütunu altında yer almakta.

Klaviyo kurulum kodunun tüm sayfalarda çağrılması gerekmektedir. Google Tag Manager aracılığı ile kurulum yapılacaksa tüm sayfalarda çalışacak şekilde yerleştirilebilir. Kullanıcı etkinliklerine bağlı işlemler için ise ayrı kod parçacıkları kullanılır9.

Ürün sayfası görüntüleme işlemlerinde aşağıdaki bilgiler Klaviyo'a iletilmelidir8.

<script type="text/javascript">
    var _learnq = _learnq || [];

    // identification

    // track
</script>

Müşteri izinlerine bağlı olarak identify ile kullanıcı e-posta adresleri, telefon numarası veya benzersiz ID değerleri de etkinliklerle ilişkilendirilebilir. Bu üç alandan en az birinin tanımlı olması zorunludur12.

Klaviyo - Identity

İlgili ekleme _learnq değişken tanımı sonrasında yer alan identification ile belirtilmiş alana yapılmalıdır.

  _learnq.push(['identify', {
    '$email' : 'george.washington@example.com'
  }]);

Kullanıcı bilgileri e-posta dışında kişi ve özelleştirilmiş parametreler ile zenginleştirilebilir.

  _learnq.push(['identify', {
    '$id': 'U1',
    '$email': 'george.washington@example.com',
    '$first_name': 'George',
    '$last_name': 'Washington',
    '$phone_number': '111-22-33',
    '$title': 'President',
    '$organization': 'The Federal Government of the United States',
    'Birth Year' : 1732
  }]);

E-posta tanımlama işlemi için ayrıca UTM E-mail (utm_email) parametresi de kullanılabilir; örneğin, https://domain.com/?utm_email=george.washington@example.com. Klaviyo aracılığı ile gönderilen bir e-bülten üzerinden web sitesine erişim sağlanması durumunda ilgili tanımlayıcı _kx parametresi ile aktarılır; örneğin, http://domain.com/?_kx=J8fjcn003Wy6b-3ILNlOyZXabW6dcFwTyeuxrowMers%3D.McN66.

Kullanıcı kimlik işlemlerinin gerçekleşmesinin ardından, iletilecek her kullanıcı etkinliği track parametresi ile ilişkilendirilmelidir.

Özelleştirilmiş etkinlik kullanımında _learnq.push(['track', 'Custom Event Name']) yerine _learnq.push(["trackViewedItem", {...}}]) biçimini de kullanılabilir.

// Özel etkinlik
  _learnq.push(['track', 'Elected President', {
    'Country': 'United States',
    'PreviouslyVicePresident': true,
    'YearElected': 1801,
    'VicePresidents': ['Aaron Burr', 'George Clinton'],
    'Plan': 'Free Trial',
    'SignUpDate': '2016-01-27 12:10:05',
    'HasFilledOutProfile': false
  }]);

// Site içi arama
   _learnq.push(["track", "Searched Site",{
     "SearchTerm": "Fantasty Boks",
     "SearchTerm (autocorrected)": "Fantasy Books",
     "ReturnedResults": 54
   }]);

// Ürün sayfası görüntüleme
   var item = {
     "ProductName": "Winnie the Pooh",
     "ProductID": "1111",
     "SKU": "WINNIEPOOH",
     "Categories": ["Fiction", "Children"],
     "ImageURL": "http://www.example.com/path/to/product/image.png",
     "URL": "http://www.example.com/path/to/product",
     "Brand": "Kids Books",
     "Price": 9.99,
     "CompareAtPrice": 14.99
   };
   _learnq.push(["track", "Viewed Product", item]);

// Sepete ürün atma
   _learnq.push(["track", "Added to Cart", {
     "$value": 29.98,
     "AddedItemProductName": "A Tale of Two Cities",
     "AddedItemProductID": "1112",
     "AddedItemSKU": "TALEOFTWO",
     "AddedItemCategories": ["Fiction", "Classics"],
     "AddedItemImageURL": "http://www.example.com/path/to/product/image2.png",
     "AddedItemURL": "http://www.example.com/path/to/product2",
     "AddedItemPrice": 19.99,
     "AddedItemQuantity": 1,
     "ItemNames": ["Winnie the Pooh", "A Tale of Two Cities"],
     "CheckoutURL": "http://www.example.com/path/to/checkout",
     "Items": [{
         "ProductID": "1111",
         "SKU": "WINNIEPOOH",
         "ProductName": "Winnie the Pooh",
         "Quantity": 1,
         "ItemPrice": 9.99,
         "RowTotal": 9.99,
         "ProductURL": "http://www.example.com/path/to/product",
         "ImageURL": "http://www.example.com/path/to/product/image.png",
         "ProductCategories": ["Fiction", "Children"]
       },
       {
         "ProductID": "1112",
         "SKU": "TALEOFTWO",
         "ProductName": "A Tale of Two Cities",
         "Quantity": 1,
         "ItemPrice": 19.99,
         "RowTotal": 19.99,
         "ProductURL": "http://www.example.com/path/to/product2",
         "ImageURL": "http://www.example.com/path/to/product/image2.png",
         "ProductCategories": ["Fiction", "Classics"]
       }
     ]
   }]);

// Sepet görüntüleme veya ödeme işlemine başlama
   _learnq.push(["track", "Started Checkout", {
     "$event_id": "1000123_1387299423",
     "$value": 29.98,
     "ItemNames": ["Winnie the Pooh", "A Tale of Two Cities"],
     "CheckoutURL": "http://www.example.com/path/to/checkout",
     "Categories": ["Fiction", "Children", "Classics"],
     "Items": [{
         "ProductID": "1111",
         "SKU": "WINNIEPOOH",
         "ProductName": "Winnie the Pooh",
         "Quantity": 1,
         "ItemPrice": 9.99,
         "RowTotal": 9.99,
         "ProductURL": "http://www.example.com/path/to/product",
         "ImageURL": "http://www.example.com/path/to/product/image.png",
         "ProductCategories": ["Fiction", "Children"]
       },
       {
         "ProductID": "1112",
         "SKU": "TALEOFTWO",
         "ProductName": "A Tale of Two Cities",
         "Quantity": 1,
         "ItemPrice": 19.99,
         "RowTotal": 19.99,
         "ProductURL": "http://www.example.com/path/to/product2",
         "ImageURL": "http://www.example.com/path/to/product/image2.png",
         "ProductCategories": ["Fiction", "Classics"]
       }
     ]
   }]);

Klaviyo'a isteğin iletilmesi ve başarılı bir şekilde işlenmesi durumunda 1 cevabı dönecektir11.

Kullanıcı bilgilerinin değiştirilmesi ve satın alma işleminin gerçekleştirilmesi gibi işlemler sunucu tabanlı (server-side) olarak ele alınmaktadır8 13.

Klaviyo - Server-side API

Shopify veya WooCommerce gibi bir e-ticaret sitesi üzerinden, Klaviyo tarafından sunulan eklentiyi kullanarak işlem gerçekleştirilmekte ise Started Checkout, Placed Order gibi sunucu taraflı işlemler de dahil olmak üzere tüm etkinlikler otomatik olarak iletilir.

Sunucu taraflı bir test işlemi gerçekleştirmek için aşağıdaki örnek kod parçacığını kullanabilirsiniz:

const options = {
  method: 'POST',
  headers: {Accept: 'text/html', 'Content-Type': 'application/x-www-form-urlencoded'},
  body: new URLSearchParams({
    data: '{ "token": "API_KEY", "event": "Placed Order", "customer_properties": { "$email": "george.washington@example.com" }, "properties": { "$event_id": "1234", "$value": 29.98, "OrderId": "1234", "Categories": ["Fiction", "Classics", "Children"], "ItemNames": ["Winnie the Pooh", "A Tale of Two Cities"], "Brands": ["Kids Books", "Harcourt Classics"], "DiscountCode": "Free Shipping", "DiscountValue": 5, "Items": [{ "ProductID": "1111", "SKU": "WINNIEPOOH", "ProductName": "Winnie the Pooh", "Quantity": 1, "ItemPrice": 9.99, "RowTotal": 9.99, "ProductURL": "http://www.example.com/path/to/product", "ImageURL": "http://www.example.com/path/to/product/image.png", "Categories": ["Fiction", "Children"], "Brand": "Kids Books" }]}, "time": 1387302423 }'
  })
};

fetch('https://a.klaviyo.com/api/track', options)
.then(response => response.json())
.then(response => console.log(response))
.catch(err => console.error(err));

Bir e-bülten formu web sitesine dahil edildiğinde, işlemler App Embed aracılığı ile gerçekleştirilir. Formun temaya eklenmesinin ardından Klaviyo ilgili kod parçacığını doğrular.

Klaviyo - Form
Klaviyo - Form

İlgili form, oluşturulurken tanımlanmış Targeting & Behavior ayarlarına göre ziyaretçiler tarafından görüntülenir. Ancak, test sürecinde ilgili formları kontrol etmek gerektiği durumlar söz konusu olabilir. Bu tür durumlarda aşağıdaki kod parçacığı ile ilgili form çağrılabilir 14.

window._klOnsite = window._klOnsite || []; window._klOnsite.push(['openForm', 'FORM_ID']);

Form ID, oluşturulan form ile ilgili işlemlerin yürütüldüğü URL'deki son kısımdır; örneğin, https://www.klaviyo.com/forms/Ycbw3e adresindeki Form ID değeri: Ycbw3e.

Klaviyo formu ile ilgili işlemler klaviyoForms etkinliği ile birlikte yürütülür15. Etkinliğin genel yapısı aşağıdaki gibidir:

var event = new CustomEvent("klaviyoForms", {
    detail: {
        type: 'submit',
        formId: 'F12345',
        companyId: 'C12345', 
        metaData: { 
            g: '12345', // formun ilişkilendirildiği liste
            $email: 'test@example.com',
        } 
    }});
window.dispatchEvent(event);

Kullanıcıların görüntülenen bir formla etkileşime girmeleri durumunda, ilgili etkinliği izlemek ve buna bağlı olarak işlemler gerçekleştirmek isteyebilirsiniz. Bu gibi durumlar için aşağıdaki kod parçacığına göz atabilirsiniz15.

window.addEventListener('klaviyoForms', function(e){
    if(e.detail.type == 'submit'){
        // console.log(e.detail);
        console.log('Company ID: ' + e.detail.companyId);
        console.log('Form ID: ' + e.detail.formId);
        console.log('Form Title: ' + e.detail.metaData.$source);
        console.log('Form E-mail: ' + e.detail.metaData.$email);
    }
});

e.detail.companyID, e.detail.formId, e.detail.metaData.$source ve e.detail.metaData.$email bilgileri form ile ilgili ihtiyaç duyulabilecek temel bilgileri içermektedir. Bu bilgileri parametre olarak tanımlayıp UA, GA4 ve diğer izleme servislerine etkinlik olarak iletebilir, dönüşüm etiketleri ve hedeflerle ilişkilendirebilirsiniz.

Çoklu adım içerek formlar için adımlara yönelik olarak stepSubmit ile adımları da izlemek mümkün15.

Bu işlemleri elbette profillerle de ilişkilendirmek mümkün:

    var _learnq = window._learnq || [];
    window.addEventListener("klaviyoForms", function(e) { 
        if (e.detail.type == 'open' || e.detail.type == 'embedOpen') {
            _learnq.push(['track', 'Viewed Form - Tracked Profile', {
                'formId' : e.detail.formId
            }]);
            dataLayer.push({
                'event': 'klaviyoForms',
                'formId': e.detail.formId,
                'formStatus': e.detail.type
            });
        }
        if (e.detail.type == 'submit' || e.detail.type == 'redirectedToUrl') {
            _learnq.push(['track', 'Submitted Form - Tracked Profile', {
                'formId' : e.detail.formId
            }]);
            dataLayer.push({
                'event': 'klaviyoForms',
                'formId': e.detail.formId,
                'formStatus': e.detail.type
            });
        });

Sonuç Olarak

E-posta bültenleri ve SMS bildirimleri ile ilgili hem tümleşik hem de ayrı ayrı hizmetler sunan pek çok servis bulunmakta16 17 18. Ancak, özelliklerin pratik bir şekilde kullanılabilmesi ve entegrasyon çeşitliliği platformları rakiplerinden ayıran önemli kriterlerden biri durumunda. Klaviyo bu kriterler göz önünde tutulduğunda oldukça etkin çözümlerden biri denebilir.