WooCommerce Sipariş Onay Sayfasına İçerik Ekleme

Tarafındankomut
0 Comments

E-ticaret sitelerinde müşteri deneyiminin en kritik noktalarından biri sipariş tamamlandıktan sonra gösterilen onay sayfasıdır. Bu sayfa genellikle “Teşekkürler” sayfası olarak da bilinir ve müşterinin siparişini başarıyla verdiğini teyit eden ilk temas noktasıdır. Peki bu sayfayı sadece standart bir sipariş özeti ile mi bırakmalıyız? Kesinlikle hayır. WooCommerce’in sunduğu hook sistemi sayesinde bu sayfaya özel içerikler, çapraz satış teklifleri, sosyal paylaşım butonları veya özel mesajlar ekleyebilirsiniz. Tüm bunları functions.php dosyasına yazacağınız birkaç satır kod ile gerçekleştirebilirsiniz.

WooCommerce Sipariş Onay Sayfası Hookları

WooCommerce, sipariş onay sayfası üzerinde çalışmak için birkaç farklı hook sunar. Hangi hook’u kullanacağınıza karar vermeden önce sayfanın yapısını anlamak önemlidir.

Sipariş onay sayfası (order-received.php şablonu) aşağıdaki temel hook noktalarına sahiptir:

  • woocommerce_before_thankyou: Teşekkür mesajının hemen öncesinde çalışır
  • woocommerce_thankyou: Sipariş detaylarının hemen altında çalışır, order ID parametresi alır
  • woocommerce_after_thankyou: Sayfanın en altında çalışır (daha az kullanılır)
  • woocommerce_order_details_after_order_table: Sipariş tablosunun hemen altına içerik ekler
  • woocommerce_thankyou_{payment_method}: Ödeme yöntemine özgü içerik eklemek için kullanılır

Bu hook’ların hangisini kullanacağınız tamamen amacınıza bağlıdır. Şimdi bunları gerçek dünya senaryolarıyla birlikte inceleyelim.

İlk Adım: Sipariş Onay Sayfasını Tespit Etmek

Kod yazmadan önce sipariş onay sayfasında olduğunuzu doğrulamak iyi bir pratiktir. WooCommerce’in is_order_received_page() fonksiyonu tam olarak bunun için kullanılır.

// functions.php'ye eklenecek temel kontrol yapısı
add_action('woocommerce_thankyou', 'custom_thankyou_content', 10, 1);

function custom_thankyou_content($order_id) {
    // Sipariş onay sayfasında olduğumuzu doğrula
    if (!is_order_received_page()) {
        return;
    }
    
    // Sipariş ID kontrolü
    if (!$order_id) {
        return;
    }
    
    // Sipariş nesnesini al
    $order = wc_get_order($order_id);
    
    if (!$order) {
        return;
    }
    
    echo '<p>Siparişiniz alındı, teşekkürler!</p>';
}

Bu temel yapıyı anladıktan sonra daha karmaşık örneklere geçebiliriz.

Senaryo 1: Sipariş Miktarına Göre Özel Mesaj Gösterme

Gerçek bir e-ticaret senaryosu düşünün: Müşteri belirli bir tutarın üzerinde alışveriş yaptıysa ona özel bir teşekkür mesajı ve bir sonraki alışverişinde kullanabileceği indirim kodu göstermek istiyorsunuz.

add_action('woocommerce_thankyou', 'show_custom_message_based_on_order_total', 5, 1);

function show_custom_message_based_on_order_total($order_id) {
    if (!$order_id) return;
    
    $order = wc_get_order($order_id);
    
    if (!$order) return;
    
    $order_total = $order->get_total();
    $currency    = get_woocommerce_currency_symbol();
    
    echo '<div class="custom-thankyou-message" style="background: #f7f7f7; padding: 20px; margin: 20px 0; border-left: 4px solid #96588a;">';
    
    if ($order_total >= 500) {
        // VIP müşteri mesajı
        echo '<h3>🎉 Siz bir VIP müşterisiniz!</h3>';
        echo '<p>500 ' . esc_html($currency) . ' ve üzeri alışveriş yaptığınız için bir sonraki siparişinizde <strong>VIP20</strong> kodunu kullanarak %20 indirim kazandınız.</p>';
        echo '<p>Bu kod 30 gün geçerlidir.</p>';
    } elseif ($order_total >= 200) {
        // Orta segment müşteri mesajı
        echo '<h3>👏 Harika bir seçim!</h3>';
        echo '<p>Bir sonraki alışverişinizde <strong>TEKRAR10</strong> kodunu kullanarak %10 indirim kazandınız.</p>';
    } else {
        // Standart müşteri mesajı
        echo '<h3>✨ Alışverişiniz için teşekkürler!</h3>';
        echo '<p>Sizi tekrar aramızda görmekten mutluluk duyarız.</p>';
    }
    
    echo '</div>';
}

Bu yaklaşım müşteri sadakat programlarını manuel kupon entegrasyonuna gerek kalmadan basit bir şekilde uygulamanıza olanak tanır.

Senaryo 2: Satın Alınan Ürünlere Göre Dinamik İçerik

Müşterinin ne satın aldığını bilerek ona özelleştirilmiş içerik sunmak, dönüşüm oranlarını önemli ölçüde artırır. Örneğin, bir müşteri spor ayakkabı satın aldıysa ilgili ürün bakım önerilerini göstermek isteyebilirsiniz.

add_action('woocommerce_thankyou', 'show_product_specific_content', 10, 1);

function show_product_specific_content($order_id) {
    if (!$order_id) return;
    
    $order      = wc_get_order($order_id);
    $items      = $order->get_items();
    $categories = array();
    
    // Siparişdeki tüm ürün kategorilerini topla
    foreach ($items as $item) {
        $product_id    = $item->get_product_id();
        $product_cats  = wp_get_post_terms($product_id, 'product_cat', array('fields' => 'slugs'));
        $categories    = array_merge($categories, $product_cats);
    }
    
    $categories = array_unique($categories);
    
    // Kategoriye göre içerik göster
    if (in_array('spor-ayakkabi', $categories)) {
        echo '<div class="product-care-tips">';
        echo '<h3>Spor Ayakkabı Bakım Önerileri</h3>';
        echo '<ul>';
        echo '<li>Kullandıktan sonra havalandırın</li>';
        echo '<li>Doğrudan güneş ışığından uzak tutun</li>';
        echo '<li>Islak temizleme bezi ile silin, yıkama makinesine koymayın</li>';
        echo '</ul>';
        echo '</div>';
    }
    
    if (in_array('elektronik', $categories)) {
        echo '<div class="warranty-info">';
        echo '<h3>Garanti ve Destek Bilgileri</h3>';
        echo '<p>Ürününüzle ilgili teknik destek için <a href="/destek">destek sayfamızı</a> ziyaret edin.</p>';
        echo '<p>Garanti kaydınızı yapmayı unutmayın: <a href="/garanti-kayit">Garanti Kaydı</a></p>';
        echo '</div>';
    }
}

Senaryo 3: Sosyal Medya Paylaşım Butonları Ekleme

Müşterilerinizin siparişlerini sosyal medyada paylaşmasını teşvik etmek organik büyüme için güçlü bir araçtır. Özellikle hediye veya özel bir ürün satın alan müşteriler bunu paylaşmaktan mutluluk duyar.

add_action('woocommerce_thankyou', 'add_social_sharing_buttons', 20, 1);

function add_social_sharing_buttons($order_id) {
    if (!$order_id) return;
    
    $order         = wc_get_order($order_id);
    $site_name     = get_bloginfo('name');
    $site_url      = home_url();
    $share_text    = urlencode($site_name . ' mağazasından alışveriş yaptım! Siz de deneyin: ' . $site_url);
    
    // Twitter/X paylaşım linki
    $twitter_url = 'https://twitter.com/intent/tweet?text=' . $share_text;
    
    // Facebook paylaşım linki
    $facebook_url = 'https://www.facebook.com/sharer/sharer.php?u=' . urlencode($site_url);
    
    // WhatsApp paylaşım linki
    $whatsapp_url = 'https://api.whatsapp.com/send?text=' . $share_text;
    
    echo '<div class="social-share-section" style="text-align: center; padding: 30px 0; border-top: 1px solid #eee; margin-top: 30px;">';
    echo '<h3>Alışverişinizi Paylaşın!</h3>';
    echo '<p>Deneyiminizi arkadaşlarınızla paylaşın ve onları da alışveriş yapmaya davet edin.</p>';
    
    echo '<div class="share-buttons">';
    
    echo '<a href="' . esc_url($twitter_url) . '" target="_blank" rel="noopener" ';
    echo 'style="display:inline-block; background:#1da1f2; color:#fff; padding:10px 20px; ';
    echo 'border-radius:4px; text-decoration:none; margin:5px;">Twitter'da Paylaş</a>';
    
    echo '<a href="' . esc_url($facebook_url) . '" target="_blank" rel="noopener" ';
    echo 'style="display:inline-block; background:#3b5998; color:#fff; padding:10px 20px; ';
    echo 'border-radius:4px; text-decoration:none; margin:5px;">Facebook'ta Paylaş</a>';
    
    echo '<a href="' . esc_url($whatsapp_url) . '" target="_blank" rel="noopener" ';
    echo 'style="display:inline-block; background:#25d366; color:#fff; padding:10px 20px; ';
    echo 'border-radius:4px; text-decoration:none; margin:5px;">WhatsApp'ta Paylaş</a>';
    
    echo '</div>';
    echo '</div>';
}

Senaryo 4: Ödeme Yöntemine Göre Özel Talimatlar

Farklı ödeme yöntemleri farklı talimatlar gerektirir. Havale/EFT ile ödeme yapan müşterilere banka bilgilerini tekrar göstermek veya kapıda ödeme yapacak müşterilere teslimat sürecini açıklamak işletme operasyonlarını kolaylaştırır.

// Havale/EFT ödemesi için özel hook
add_action('woocommerce_thankyou_bacs', 'custom_bacs_thankyou_message', 10, 1);

function custom_bacs_thankyou_message($order_id) {
    if (!$order_id) return;
    
    $order = wc_get_order($order_id);
    
    echo '<div class="bacs-instructions" style="background: #fff8e1; padding: 20px; margin: 20px 0; border: 1px solid #ffd54f;">';
    echo '<h3>⚠️ Havale/EFT Talimatları</h3>';
    echo '<p>Siparişinizin işleme alınması için lütfen aşağıdaki adımları takip edin:</p>';
    echo '<ul>';
    echo '<li>Havaleyi <strong>3 iş günü</strong> içinde gerçekleştirin.</li>';
    echo '<li>Açıklama kısmına sipariş numaranızı yazın: <strong>#' . esc_html($order->get_order_number()) . '</strong></li>';
    echo '<li>Havale dekontunu <a href="mailto:[email protected]">[email protected]</a> adresine gönderin.</li>';
    echo '</ul>';
    echo '<p><strong>Not:</strong> Ödeme onaylandıktan sonra siparişiniz hazırlanmaya başlayacaktır.</p>';
    echo '</div>';
}

// Kapıda ödeme için özel hook
add_action('woocommerce_thankyou_cod', 'custom_cod_thankyou_message', 10, 1);

function custom_cod_thankyou_message($order_id) {
    if (!$order_id) return;
    
    echo '<div class="cod-instructions" style="background: #e8f5e9; padding: 20px; margin: 20px 0; border: 1px solid #a5d6a7;">';
    echo '<h3>✅ Kapıda Ödeme Bilgisi</h3>';
    echo '<p>Siparişiniz kapıda ödeme seçeneği ile oluşturulmuştur.</p>';
    echo '<ul>';
    echo '<li>Kurye geldiğinde nakit veya kredi kartı ile ödeme yapabilirsiniz.</li>';
    echo '<li>Teslimat süreniz: <strong>2-4 iş günü</strong></li>';
    echo '<li>Sipariş kargo bilgisi SMS ile tarafınıza iletilecektir.</li>';
    echo '</ul>';
    echo '</div>';
}

Senaryo 5: Kayıt Teşvik Mesajı (Misafir Müşteriler İçin)

Misafir olarak alışveriş yapan müşterilere hesap oluşturmayı teşvik eden bir mesaj göstermek, uzun vadeli müşteri ilişkileri kurmanıza yardımcı olur.

add_action('woocommerce_thankyou', 'encourage_account_registration', 15, 1);

function encourage_account_registration($order_id) {
    // Zaten giriş yapmış kullanıcılara gösterme
    if (is_user_logged_in()) return;
    
    if (!$order_id) return;
    
    $order = wc_get_order($order_id);
    
    // Müşteri e-posta adresini al
    $customer_email = $order->get_billing_email();
    
    // Hesap oluşturma linki
    $register_url = add_query_arg(array(
        'email' => rawurlencode($customer_email)
    ), wc_get_page_permalink('myaccount'));
    
    echo '<div class="register-prompt" style="background: #e3f2fd; padding: 25px; margin: 25px 0; border-radius: 8px;">';
    echo '<h3>🙌 Hesap Oluşturun, Avantaj Kazanın!</h3>';
    echo '<p>Bir hesap oluşturarak:</p>';
    echo '<ul>';
    echo '<li>Siparişlerinizi kolayca takip edebilirsiniz</li>';
    echo '<li>Adres bilgilerinizi kaydetleyebilirsiniz</li>';
    echo '<li>Özel üye indirimlerinden yararlanabilirsiniz</li>';
    echo '<li>İade süreçlerinizi hızlandırabilirsiniz</li>';
    echo '</ul>';
    echo '<a href="' . esc_url($register_url) . '" ';
    echo 'style="display:inline-block; background:#1565c0; color:#fff; padding:12px 24px; ';
    echo 'border-radius:4px; text-decoration:none; font-weight:bold;">Ücretsiz Hesap Oluştur</a>';
    echo '</div>';
}

Senaryo 6: Google Analytics ve Meta Pixel Dönüşüm Takibi

Dijital pazarlamacılar için sipariş onay sayfası altın değerindedir. Dönüşüm takip kodlarını bu sayfaya doğru şekilde yerleştirmek, reklam kampanyalarınızın gerçek performansını ölçmenizi sağlar.

add_action('woocommerce_thankyou', 'add_conversion_tracking', 1, 1);

function add_conversion_tracking($order_id) {
    if (!$order_id) return;
    
    // Sayfanın sadece ilk yüklenişinde çalıştır (yenileme koruması)
    $already_tracked = get_post_meta($order_id, '_conversion_tracked', true);
    
    if ($already_tracked) return;
    
    $order       = wc_get_order($order_id);
    $order_total = $order->get_total();
    $order_num   = $order->get_order_number();
    $currency    = get_woocommerce_currency();
    
    // Ürün verilerini hazırla
    $items_data = array();
    foreach ($order->get_items() as $item) {
        $product = $item->get_product();
        $items_data[] = array(
            'id'       => $item->get_product_id(),
            'name'     => $item->get_name(),
            'price'    => $product ? $product->get_price() : 0,
            'quantity' => $item->get_quantity()
        );
    }
    
    // Google Analytics 4 dönüşüm kodu
    echo '<script>';
    echo 'gtag("event", "purchase", {';
    echo '"transaction_id": "' . esc_js($order_num) . '",';
    echo '"value": ' . floatval($order_total) . ',';
    echo '"currency": "' . esc_js($currency) . '",';
    echo '"items": ' . json_encode($items_data);
    echo '});';
    echo '</script>';
    
    // Meta Pixel dönüşüm kodu
    echo '<script>';
    echo 'fbq("track", "Purchase", {';
    echo '"value": ' . floatval($order_total) . ',';
    echo '"currency": "' . esc_js($currency) . '"';
    echo '});';
    echo '</script>';
    
    // Bu siparişi takip edildi olarak işaretle
    update_post_meta($order_id, '_conversion_tracked', true);
}

Önemli not: Bu kod parçasında get_post_meta ve update_post_meta kullanımı dikkat çekici. WooCommerce HPOS (High Performance Order Storage) aktifse $order->get_meta() ve $order->update_meta_data() kullanmanız gerekir. Modern WooCommerce kurulumlarında buna dikkat edin.

Senaryo 7: Tahmini Teslimat Tarihi Gösterme

Müşteriler siparişlerini ne zaman alacaklarını bilmek ister. Bu bilgiyi dinamik olarak hesaplayıp göstermek müşteri memnuniyetini artırır.

add_action('woocommerce_order_details_after_order_table', 'show_estimated_delivery', 10, 1);

function show_estimated_delivery($order) {
    // Bu hook direkt order nesnesini alır, ID değil
    if (!$order) return;
    
    $order_date  = $order->get_date_created();
    $order_status = $order->get_status();
    
    // Tamamlanmış veya iptal edilmiş siparişler için gösterme
    if (in_array($order_status, array('completed', 'cancelled', 'refunded'))) {
        return;
    }
    
    // Teslimat hesaplama (hafta sonlarını atla)
    $delivery_days  = 3; // Standart teslimat süresi
    $current_date   = new DateTime();
    $delivery_date  = clone $current_date;
    $days_added     = 0;
    
    while ($days_added < $delivery_days) {
        $delivery_date->modify('+1 day');
        $day_of_week = $delivery_date->format('N'); // 6=Cumartesi, 7=Pazar
        
        if ($day_of_week < 6) {
            $days_added++;
        }
    }
    
    // Türkçe tarih formatı
    $months = array(
        1  => 'Ocak', 2  => 'Şubat', 3  => 'Mart',
        4  => 'Nisan', 5  => 'Mayıs', 6  => 'Haziran',
        7  => 'Temmuz', 8  => 'Ağustos', 9  => 'Eylül',
        10 => 'Ekim', 11 => 'Kasım', 12 => 'Aralık'
    );
    
    $day   = $delivery_date->format('j');
    $month = $months[(int)$delivery_date->format('n')];
    $year  = $delivery_date->format('Y');
    
    echo '<div class="delivery-estimate" style="background:#f1f8e9; padding:15px; margin:15px 0; border-radius:5px;">';
    echo '<p style="margin:0; font-size:16px;">';
    echo '🚚 <strong>Tahmini Teslimat Tarihi:</strong> ' . esc_html($day . ' ' . $month . ' ' . $year);
    echo '</p>';
    echo '<p style="margin:5px 0 0; color:#666; font-size:13px;">';
    echo '* Bu tarih tahminidir, hava durumu ve kargo yoğunluğuna göre değişebilir.';
    echo '</p>';
    echo '</div>';
}

İleri Seviye: Özel Sınıf ile Organizasyonlu Yapı

Tüm bu fonksiyonları tek tek functions.php‘ye eklemek zamanla karmaşık bir yapıya yol açabilir. Daha organize bir yaklaşım için sınıf tabanlı yapı kullanabilirsiniz.

class Custom_WC_Thankyou_Page {
    
    public function __construct() {
        // Hook'ları öncelik sırasıyla ekle
        add_action('woocommerce_before_thankyou', array($this, 'before_content'), 10);
        add_action('woocommerce_thankyou', array($this, 'main_content'), 10, 1);
        add_action('woocommerce_thankyou', array($this, 'social_sharing'), 20, 1);
        add_action('woocommerce_thankyou', array($this, 'registration_prompt'), 30, 1);
    }
    
    public function before_content($order_id) {
        // Sipariş öncesi içerik
        echo '<div id="custom-thankyou-wrapper">';
    }
    
    public function main_content($order_id) {
        if (!$order_id) return;
        
        $order = wc_get_order($order_id);
        if (!$order) return;
        
        // Ana içerik burada
        $this->render_order_summary($order);
    }
    
    private function render_order_summary($order) {
        $total      = $order->get_formatted_order_total();
        $order_num  = $order->get_order_number();
        
        echo '<div class="order-summary-custom">';
        echo '<p>Sipariş No: <strong>#' . esc_html($order_num) . '</strong></p>';
        echo '<p>Toplam: <strong>' . wp_kses_post($total) . '</strong></p>';
        echo '</div>';
    }
    
    public function social_sharing($order_id) {
        // Sosyal paylaşım butonları
    }
    
    public function registration_prompt($order_id) {
        if (is_user_logged_in()) return;
        // Kayıt teşvik mesajı
    }
}

// Sınıfı başlat
if (class_exists('WooCommerce')) {
    new Custom_WC_Thankyou_Page();
}

Güvenlik ve Performans İpuçları

Tüm bu kodları yazarken dikkat etmeniz gereken bazı kritik noktalar vardır.

  • Veri sanitizasyonu: Kullanıcı verisini çıktı almadan önce her zaman esc_html(), esc_url(), esc_js() gibi fonksiyonlarla temizleyin.
  • Yenileme koruması: Dönüşüm takip kodları gibi bir kez çalışması gereken işlemler için get_post_meta ile durum kontrolü yapın.
  • HPOS uyumluluğu: WooCommerce 7.1+ sürümünden itibaren HPOS aktifse wc_get_order() kullanın, direkt get_post_meta() kullanmaktan kaçının.
  • Hook öncelikleri: Birden fazla içerik ekliyorsanız priority parametresiyle sıralamayı kontrol edin, düşük sayı daha önce çalışır.
  • Önbellek uyumluluğu: Sayfa önbellekleme eklentileri kullanıyorsanız (WP Rocket, W3 Total Cache vb.) sipariş onay sayfasını önbellek dışında tutun.
  • Eklenti çakışmaları: Tüm WooCommerce hook’larını if (class_exists('WooCommerce')) kontrolü içine alın.
  • Child theme kullanımı: functions.php değişikliklerini her zaman child theme içinde yapın, yoksa tema güncellemelerinde kodlarınız silinir.

Test Etme Yöntemi

Kodlarınızı canlıya almadan önce test ortamında doğrulamanız şarttır. WooCommerce’in test siparişi oluşturma özelliğini kullanın.

// Test amaçlı - canlıda kullanmayın!
// Hangi hook'ların ve önceliklerin çalıştığını görmek için
add_action('woocommerce_thankyou', function($order_id) {
    if (current_user_can('administrator')) {
        global $wp_filter;
        $hooks = $wp_filter['woocommerce_thankyou'];
        echo '<pre style="font-size:11px;">';
        echo 'Aktif Hook'lar: ';
        print_r(array_keys($hooks->callbacks));
        echo '</pre>';
    }
}, 999, 1);

Bu test kodunu yalnızca geliştirme ortamında ve yalnızca yönetici hesabıyla görünür şekilde kullanın. Canlı ortamda bırakmak güvenlik açığına neden olabilir.

Sonuç

WooCommerce sipariş onay sayfası, doğru kullanıldığında çok güçlü bir pazarlama ve iletişim aracına dönüşür. functions.php üzerinden yapacağınız basit hook entegrasyonları ile müşteri deneyimini kişiselleştirebilir, dönüşüm takibinizi otomatize edebilir ve tekrarlı satışları teşvik edebilirsiniz.

Bu yazıda ele aldığımız senaryolar bir başlangıç noktasıdır. Kendi işletme ihtiyaçlarınıza göre bu yapıları birleştirebilir ve genişletebilirsiniz. Önemli olan her zaman güvenli kodlama pratiklerini uygulamak, HPOS uyumluluğunu gözetmek ve değişiklikleri canlıya almadan önce staging ortamında test etmektir. E-ticaret sitenizin sipariş onay sayfası ne kadar kişiselleştirilmiş ve bilgilendirici olursa, müşteri memnuniyeti ve marka güveni o ölçüde artar.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir