WooCommerce özel ödeme alanlarını kullanma: oluşturmadan doğrulamaya kadar eksiksiz bir rehber.

Neden özel ödeme alanlarına ihtiyaç duyulur?

Standart WooCommerce ödeme süreci tarafından varsayılan olarak toplanan bilgiler temel ve geneldir; örneğin isim, adres, telefon ve e-posta. Ancak işletmenizin özel ihtiyaçları olduğunda, bu bilgiler yetersiz kalır. Özel alanlar ekleyerek müşterilere daha kişiselleştirilmiş ve daha doğru bir alışveriş deneyimi sunabilirsiniz.

Örneğin, özel tasarım kekler satan bir dükkan, müşterilerden kekin üzerine yazılacak dilekleri veya mum istenip istenmediğini bilmesi gerekebilir; B2B işletmeleri, müşterilerin şirket vergi numaralarını veya satın alma sipariş numaralarını kaydetmeyi gerektirebilir; etkinlik biletleri satan dükkanlar ise katılımcıların kimlik bilgilerini doğrulama amacıyla toplamak isteyebilir. Özelleştirilebilir alanlar, standart işlemlerin ötesindeki kritik verileri toumanıza olanak tanır; bu veriler sipariş işleme, müşteri gruplandırma, kişiselleştirilmiş pazarlama ve hatta yasal uyumluluk için kullanılabilir.

Teknik açıdan bakıldığında, WooCommerce’ın ödeme sayfası, bir dizi standart alandan oluşan bir formdur ve yapısı “Eylem Kancaları” (Action Hooks) ve “Filtre Kancaları” (Filter Hooks) tarafından tanımlanır. Bu, eklentiler veya temaların fonksiyon dosyaları aracılığıyla bu kancaları kullanarak ödeme sürecine müdahale edebileceğimiz, alanları ekleyebileceğimiz, silebileceğimiz veya değiştirebileceğimiz anlamına gelir. Bu temel mekanizmayı anlamak, herhangi bir özelleştirme işlemi yapmanın temelidir.

Tavsiye edilen okuma WooCommerce E-Ticaret Sitesi Geliştirme Kılavuzu: Kurulumdan İleri Özelliklerin Uygulanmasına。

Özel ödeme alanları oluşturmanın üç yolu

WooCommerce, özel alanlar eklemek için esnek yöntemler sunar. Kendi teknik becerilerinize ve ihtiyaçlarınıza göre en uygun yöntemi seçebilirsiniz.

UltaHost WordPress Sunucusu

30 gün iade garantisi, sınırsız bant genişliği ve veritabanı kullanımı, ücretsiz DDoS koruması; 3 yıllık abonelikte indirim (50%).

Sayfaya erişin.

Eklentiler kullanarak hızlı ve kod gerektirmeden işlemler gerçekleştirin.

Kod konusunda bilgisi olmayan web yöneticileri veya hızlı bir şekilde projeyi hayata geçirmesi gereken kişiler için, özel eklentiler kullanmak en uygun yöntemdir. Piyasada “Checkout Field Editor for WooCommerce” veya “WooCommerce Checkout Manager” gibi mükemmel eklentiler bulunmaktadır.

Bu eklentiler genellikle, yeni alanlar eklemenizi sağlayan sezgisel bir arayüz sunar; bu arayüzde tıklamalar ve seçimler yaparak işlemlerinizi gerçekleştirebilirsiniz. Alan türlerini (metin kutusu, açılır menü, onay kutusu, tek seçimli buton), etiketleri, yer tutucuları, alanların zorunlu olup olmadığını ve bu alanların ödeme sayfasındaki konumunu (fatura bölümünde mi yoksa teslimat bölümünde mi) tanımlayabilirsiniz. Eklentilerin kullanımı için herhangi bir kod yazmanıza gerek kalmaz; bu da teknik engelleri büyük ölçüde azaltır ve çoğu standart ihtiyaca uygundur. Ancak dikkat edilmesi gereken bir nokta, eklentilerin web sitesinin yükünü artırabileceğidir ve özelleştirilmiş mantık çok karmaşık olduğunda yeterince esnek olmayabilecekleridir.

Kod aracılığıyla özel alanlar ekleyin.

Bu, temaları düzenleyerek en güçlü ve esnek yöntemdir. functions.php Bir dosya kullanarak veya özel bir eklenti oluşturarak bunu gerçekleştirebilirsiniz. Önemli olan, ilgili işlevleri yerine getirmek için uygun araçları kullanmaktır. woocommerce_checkout_fields Filtre kancası (Filter Hook).

Bu hook, ödeme bilgileri alanlarını değiştirmenize olanak tanır. Örneğin, “Fatura Bilgileri” bölümüne şirket adını girmek için bir alan eklemek istiyorsanız aşağıdaki kodu yazabilirsiniz:

Tavsiye edilen okuma WooCommerce ürün sayfalarına özel alanlar ve meta veriler nasıl eklenir?。

add_filter( 'woocommerce_checkout_fields', 'custom_add_checkout_field' );
function custom_add_checkout_field( $fields ) {
    $fields['billing']['billing_company_custom'] = array(
        'label'       => __('公司名称（自定义）', 'woocommerce'),
        'placeholder' => _x('请输入您的完整公司名', 'placeholder', 'woocommerce'),
        'required'    => true,
        'class'       => array('form-row-wide'),
        'clear'       => true,
        'priority'    => 25, // 控制显示顺序，数字越小越靠前
    );
    return $fields;
}

Bu kod, faturalama alanına zorunlu bir metin kutusu ekler. Önemli olan, alan dizisinin anahtar adlarıdır (örneğin…). billing_company_custom) ve bulunduğu alan kümesi (field set)['billing'] 或 ['shipping']、['order']）。

WooCommerce’un koşullu mantık (conditional logic) özelliklerini kullanmak

Bazen belirli bir alanın yalnızca belirli koşullar altında görünmesini istersiniz. Örneğin, müşteri “Hediye Paketleme” hizmetini seçtiğinde “Hediye Kartı Mesajı” alanının görünmesini isteyebilirsiniz. Bu, JavaScript kullanarak veya koşullu mantığı destekleyen eklentiler aracılığıyla gerçekleştirilebilir.

Saf kod uygulamaları genellikle yardımcı araçlara ihtiyaç duyar. woocommerce_after_checkout_billing_form 或 woocommerce_after_checkout_shipping_form Belirli bir alanın HTML yapısını çıkarmak için “hook” (düğüm) kullanılır ve diğer alanlardaki (örneğin onay kutuları) değişiklikleri dinlemek için jQuery betiği yazılır; bu sayede hedef alanın görünüp görünmemesi kontrol edilir. Ancak bu yöntem, JavaScript becerileri açısından belirli gereksinimler barındırır. Daha basit bir yol ise, görselleştirilebilir koşul mantığı ayarlamaları sunan gelişmiş alan yönetim eklentilerini kullanmaktır.

hosting.com Paylaşımlı Barındırma

AMD EPYC CPU'lar, NVMe SSD depolama ve LiteSpeed ile yüksek performans, 7/24, 7x7 uzman şirket içi destek, SSL, kaba kuvvet, kötü amaçlı yazılım ve DDoS koruması dahil gelişmiş güvenlik önlemleri, 73%'ye kadar tasarruf

Sayfaya erişin.

Özel alan verilerini doğrulayın ve kaydedin.

Sadece sayfada alanları göstermek yeterli değildir; verilerin doğruluğunu sağlamak ve bunları veritabanına güvenli bir şekilde kaydetmek çok önemli adımlardır.

Ön uç ve arka uç veri doğrulaması

Geçersiz veya kötü niyetli veri gönderimlerini önlemek için doğrulama işleminin sunucu tarafında (arka uçta) yapılması gerekmektedir. Bu, aşağıdaki yöntemlerle sağlanır: woocommerce_checkout_process Eylem kancaları (action hooks) tarafından gerçekleştirilir.

Önceki örneğe devam edersek, eğer eklediğimiz… billing_company_custom Bu bir zorunlu alandır; müşterinin bu alanı boş bırakmadığından emin olmamız gerekiyor.

Tavsiye edilen okuma WooCommerce Geliştirme Uygulamaları: Sıfırdan Profesyonel E-Ticaret Siteleri Oluşturmak。

add_action('woocommerce_checkout_process', 'custom_validate_checkout_field');
function custom_validate_checkout_field() {
    if ( isset($_POST['billing_company_custom']) && empty($_POST['billing_company_custom']) ) {
        wc_add_notice( __( '请填写“公司名称（自定义）”。', 'woocommerce' ), 'error' );
    }
}

wc_add_notice() Fonksiyon, ödeme sayfasının üst kısmında bir hata mesajı görüntüler ve kullanıcı hataları düzeltene kadar siparişin gönderilmesini engeller. Bu mesaj içinde, e-posta formatının kontrolü, sayı aralıklarının doğrulanması veya düzenli ifadelerin (regular expressions) kullanılması gibi daha karmaşık doğrulama işlemleri de gerçekleştirebilirsiniz.

Alan verilerini siparişe kaydedin.

Doğrulama işlemi tamamlandıktan sonra, özel alanların değerlerini sipariş meta verilerine (Order Meta) kaydetmemiz gerekiyor; böylece bunları daha sonra arka planda ve e-postalarda görüntüleyebiliriz. Bunun için şu adımları izlememiz gerekiyor: woocommerce_checkout_update_order_meta Eylem kancaları (Action Hooks).

InterServer Paylaşımlı Barındırma

Paylaşımlı hosting aylık $2.50 USD, ilk ay $0.1 USD promosyon kodu tryinterserver, 461 bulut uygulaması komut dosyası, tek tıklamayla yükleme.

Sayfaya erişin.

add_action('woocommerce_checkout_update_order_meta', 'custom_save_checkout_field');
function custom_save_checkout_field( $order_id ) {
    if ( ! empty($_POST['billing_company_custom']) ) {
        update_post_meta( $order_id, '_billing_company_custom', sanitize_text_field($_POST['billing_company_custom']) );
    }
}

update_post_meta() Fonksiyon, temizlenmiş alan değerlerini anahtar-değer çiftleri şeklinde saklar. wp_postmeta Tabloda, anahtar adları genellikle bir alt çizgiyle başlar (örneğin: _billing_company_customBu, bazı arka plan arayüzlerinde bunun “gizli” meta veri olarak görülmesine yardımcı olur.

Ön tarafta ve arka tarafta alan verilerini gösterin.

Veriler kaydedildikten sonra, bunların birçok kritik noktada görülebilir ve yönetilebilir olmasını sağlamanız gerekir.

Sipariş detaylarında ve e-postada gösterilsin.

Hem mağaza sahibinin hem de müşterilerin kaydedilen bilgileri görebilmesi için, bu bilgileri yönetim arayüzündeki sipariş detayları sayfasına ve hem müşterilere hem de yöneticilere gönderilen sipariş e-postalarına eklememiz gerekiyor.

Yönetim arayüzünden sipariş detaylarını değiştirmek için şu yöntemi kullanabilirsiniz: woocommerce_admin_order_data_after_billing_address Kancalar:

add_action('woocommerce_admin_order_data_after_billing_address', 'custom_display_field_in_admin', 10, 1);
function custom_display_field_in_admin($order){
    $company_custom = get_post_meta( $order->get_id(), '_billing_company_custom', true );
    if ( $company_custom ) {
        echo '<p><strong>'.__('自定义公司名').':</strong> '. $company_custom '.'</p>';
    }
}

Benzer şekilde, kullanın. woocommerce_email_order_meta_fields Filtre, bu alanı sipariş e-postasının içeriğine ekleyebilir.

“Hesabım” bölümündeki sipariş görünümünde gösterilsin.

Müşteriler, hesap sayfalarında geçmiş sipariş detaylarını incelediklerinde, aynı zamanda o sırada girdikleri bilgileri de görebilmelidir. Bu, şu şekilde sağlanır: woocommerce_order_details_after_order_table Eylem kancası (Action Hook) uygulaması:

add_action('woocommerce_order_details_after_order_table', 'custom_display_field_in_order_view', 10, 1);
function custom_display_field_in_order_view( $order ) {
    $company_custom = get_post_meta( $order->get_id(), '_billing_company_custom', true );
    if ( $company_custom ) {
        echo '<h2>'.__('额外信息').'</h2>';
        echo '<table class="woocommerce-table shop_table extra_info"><tbody>';
        echo '<tr><th>'.__('自定义公司名').':</th><td>'. $company_custom '.'</td></tr>';
        echo '</tbody></table>';
    }
}

Özetle.

WooCommerce ödeme sürecine özel alanlar eklemek, talep analizinden, geliştirme ve uygulamaya, veri yönetimine kadar uzanan bir süreçtir. Önemli olan nokta, WooCommerce’un hook (eklemeler) sistemini anlamak ve bunu etkili bir şekilde kullanmaktır. woocommerce_checkout_fields Filtre eklemek için alanları kullanın. woocommerce_checkout_process Eylem doğrulandı ve onaylandı. woocommerce_checkout_update_order_meta Eylemler tarafından toplanan veriler, son olarak çeşitli gösterim araçları aracılığıyla arka planda, e-postada ve kullanıcı arayüzünde sunulur. Başlangıç seviyesindeki kullanıcılar için güvenilir eklentiler iyi bir başlangıç noktası olabilir; ancak yüksek özelleştirilebilirlik ve performans arayan geliştiriciler için kod yazmak en iyi seçenektir. Hangi yöntem kullanılırsa kullanılsın, net bir veri akışı tasarımı ve titiz doğrulamalar, işlevlerin stabil kalmasını ve kullanıcı deneyiminin iyileştirilmesini sağlamanın anahtarıdır.

Sıkça Sorulan Sorular.

Eklenen özel alanlar neden ödeme sayfasında gösterilmiyor?

Lütfen aşağıdaki adımları takip ederek sorunu giderin: Öncelikle, kodunuzun temaya doğru şekilde eklendiğinden emin olun. functions.php Dosya veya özel eklentide herhangi bir dilbilgisi hatası bulunmamaktadır. İkincisi, alan dizisinin anahtarlarının doğru bir şekilde iç içe geçirilip geçirilmediğini kontrol edin. $fields['billing']、$fields['shipping'] 或 $fields['order'] 之中。然后，查看浏览器控制台是否有 JavaScript 错误，这可能与字段的 class 或优先级设置冲突。最后，清空网站和浏览器的缓存后再次尝试。

Özel bir alanı seçmeli (isteğe bağlı) veya zorunlu (zorunlu) olarak nasıl ayarlayabilirim?

Kod aracılığıyla bir alan eklerken, bu alanı alan dizisinde ayarlayabilirsiniz. 'required' => true 或 'required' => falseEğer bir alan zaten zorunlu (gerekli) ise ancak bunu isteğe bağlı hale getirmek istiyorsanız, sadece ilgili alanın ayarlarını değiştirmeniz yeterlidir. woocommerce_checkout_fields Filtreleme fonksiyonunda, bu alanın değeri… required Parametreyi `false` olarak değiştirmeniz yeterlidir. Lütfen unutmayın ki, değişiklikten sonra ilgili ayarları da buna göre ayarlamanız veya kaldırmanız gerekecektir. woocommerce_checkout_process İçindeki doğrulama mantığı.

Özel alanların verileri veritabanında nerede saklanır?

Özel alanların değerleri esas olarak WordPress’in veritabanında saklanır. wp_postmeta Veritabanı tablolarında (tablo önekleri farklı olabilir), her kayıt aşağıdaki şekilde belirtilir: post_id(Mesajdaki “(Corresponding order ID)” ifadesi, bir siparişin tanımlayıcısını belirtmek için kullanılmıştır. Bu ifade, siparişin kimliğini veya ilişkili verilerini ifade edebilir.) wp_posts Tablodaki sipariş kayıtları birbirine bağlıdır ve bu bağlantı şu şekilde sağlanmıştır: meta_key(Yani, kaydederken kullandığınız anahtar adı, örneğin…) _billing_company_customBelirlemek için kullanılır.meta_value Bu durumda, depolanan alanın gerçek değeri kullanılır. Bunu veritabanı yönetim araçları veya WordPress aracılığıyla yapabilirsiniz. get_post_meta() Fonksiyon, bu verileri sorgular.

Farklı ürünlere göre farklı özel alanlar (custom fields) gösterebilir miyiz?

Tabii ki, ancak bu daha karmaşık bir mantık gerektirir. Yaygın bir yöntem şu şekildedir: Öncelikle, ürüne türünü belirtmek için özel bir kategori veya meta alan ekleyin. Daha sonra ödeme sayfasında, bu bilgileri kullanın. woocommerce_after_checkout_form Tüm olası özel alanların HTML kodlarını “kancalar” veya benzeri yöntemlerle çıkarın; ancak bunları varsayılan olarak CSS kullanarak gizleyin. Daha sonra, alışveriş sepeti içeriğindeki değişiklikleri veya belirli ürünlerin seçilmesini dinleyen bir JavaScript betiği yazın ve mevcut alışveriş sepetindeki ürün türüne göre ilgili alan gruplarını dinamik olarak gösterin veya gizleyin. Son olarak, arka uçta yapılan doğrulama ve kaydetme işlemlerinde de ürün türüne göre ilgili alanların verilerini koşullu olarak işleyin.