WooCommerce Ödeme Sayfası Nasıl Düzenlenir
Yayınlanan: 2021-07-21
WooCommerce mağazanızdaki ödeme sayfasını düzenlemek ister misiniz? Okumaya devam edin, çünkü size bir çözüm sunacağız.
Ödeme sayfasının, müşterilerin mağazanızda sunduğunuz ürün veya hizmet için ödeme yaptığı yer olduğunu unutmamak önemlidir. Bu nedenle, onu doğru bir şekilde almalısınız.
Bununla birlikte, WooCommerce size varsayılan bir yapılandırma sağlar, ancak profesyonel bir görünüme sahip olmadığı için zorunluluktan özelleştirmeniz gerekebilir. Bu, dönüşüm oranlarınızı artırmanıza yardımcı olacaktır.
WooCommerce Ödeme Sayfası Nasıl Düzenlenir
Sayfayı özelleştirmenin iki yolu vardır:
- Özel Ödeme Şablonu – WooCommerce belgeleri, ödeme şablonunu temanıza aşağıdaki gibi bir klasör yapısında kopyalayabileceğinizi açıkça belirtir: woocommerce/checkout/form-checkout.php. Bu, form-checkout.php'yi gereksinimlerinize göre özelleştirebileceğiniz anlamına gelir.
- Eklentiler – Ödeme sayfasını özelleştirmek için kullanılabilecek çeşitli uzantılar vardır. Bazıları ücretsiz, bazıları ise ücretli uzantılardır.
- Özel kod – Bu yöntem biraz aldatıcıdır ve çözümleri uygulamanız için biraz teknik bilgi gerektirir. Ancak, yalnızca küçük bir düzenleme yapmak istiyorsanız ve bir eklenti satın almak istemiyorsanız bu mükemmel bir çözümdür. Bu dersimizde bu yöntemi kullanacağız.
WooCommerce Ödeme Sayfasını Düzenleme Adımları
Başlamadan önce, WooCommerce'in her sayfasında eylem kancaları olduğunu belirtmekte fayda var. İşlem kancaları, ödeme sayfasından öğe eklemek veya çıkarmak için kullanılabilir. Ödeme sayfasında 9 eylem kancası vardır:
- woocommerce_before_checkout_form
- woocommerce_checkout_before_customer_details
- woocommerce_checkout_billing
- woocommerce_checkout_shipping
- woocommerce_checkout_after_customer_details
- woocommerce_checkout_before_order_review
- woocommerce_checkout_order_review
- woocommerce_checkout_after_order_review
- woocommerce_after_checkout_form
Ek olarak, temanızın düzenine bağlı olarak mevcut olabilecek 7 ek kanca vardır. Onları burada kontrol edebilirsiniz.
Size yardımcı olmak için bazı örnekler paylaşmaya karar verdik. İşte izlemeniz gereken adımlar:
- WordPress sitenize giriş yapın ve yönetici kullanıcı olarak Gösterge Tablosuna erişin.
- Pano menüsünden Görünüm Menüsü > Tema Düzenleyici Menüsü öğesine tıklayın. Tema Editörü sayfası açıldığında müşteriye kargo detayları ile ilgili mesaj ekleyecek olan fonksiyonu ekleyeceğimiz tema fonksiyonları dosyasını arayınız.
- php dosyasına aşağıdaki kodu ekleyin:
add_action( 'woocommerce_before_checkout_shipping_form', function() {
echo 'Don\'t forget to include your unit number in the address!';
});
- Bu sonuç:
- Herhangi bir alanı değiştirmek istiyorsanız, woocommerce_checkout_fields filtresini kullanabilirsiniz. Örneğin, fatura telefon numarası alanını kaldırmak için aynı dosyaya aşağıdaki kodu ekleyin:
// Hook in
add_filter( 'woocommerce_checkout_fields' , 'njengah_override_checkout_fields' );
// Our hooked in function - $fields is passed via the filter!
function njengah_override_checkout_fields( $fields ) {
unset($fields['billing']['billing_phone']); return $fields; }
- Gönderim telefon numarası alanı eklemek için aşağıdaki kodu ekleyin:
// Hook in
add_filter( 'woocommerce_checkout_fields' , 'njengah_override_checkout_fields' );
// Our hooked in function - $fields is passed via the filter!
function njengah_override_checkout_fields( $fields ) {
$fields['shipping']['shipping_phone'] = array(
'label' => __('Phone', 'woocommerce'),
'placeholder'=> _x('Phone', 'placeholder', 'woocommerce'),
'required' => false,
'class' => array('form-row-wide'),
'clear' => true
);
return $fields;
}
/**
* Display field value on the order edit page
*/
add_action( 'woocommerce_admin_order_data_after_shipping_address', 'njengah_custom_checkout_field_display_admin_order_meta', 10, 1 );
function njengah_custom_checkout_field_display_admin_order_meta($order){
global $post_id;
$order = new WC_Order( $post_id );
echo '<p><strong>'.__('Field Value').':</strong> ' . get_post_meta($order->get_id(), '_shipping_field_value', true ) . '</p>';
}
- Posta Kodu veya Posta Kodu alanının yer tutucusunu değiştirmek için aşağıdaki kodu ekleyin:
add_filter( 'woocommerce_checkout_fields' , 'njengah_override_checkout_fields' );
// Our hooked in function - $fields is passed via the filter!
function njengah_override_checkout_fields( $fields ) {
$fields['billing']['billing_postcode']['placeholder'] = 'Postal Code';
return $fields;
}
Çözüm
Özetle, ödeme sayfasını düzenlemek için WooCommerce eylem kancalarını nasıl kullanabileceğinizi paylaştık. WooCommerce belgelerini burada görüntüleyebileceğinizi unutmamak önemlidir.
Kodlamaya aşina değilseniz, bir eklenti kullanmanızı öneririz. Ayrıca kalifiye bir WordPress geliştiricisine danışabilirsiniz.
Umarız bu eğitim, probleminize bir çözüm bulmanıza yardımcı olmuştur.
Benzer Makaleler
- Checkout'ta WooCommerce Yükleme Dosyası Nasıl Kurulur
- Öne Çıkan Ürün Adı Vitrininin Altına Nasıl İçerik Eklenir
- WooCommerce Kayıt E-posta Doğrulaması Nasıl Eklenir
- Eklenti Kullanmadan WordPress'te Numara Sayfalandırma Nasıl Oluşturulur
- Örneklerle WordPress Özel Kancaları do_action ve application_filters Kullanma Kılavuzu
- WooCommerce Sepeti ve Ödemeyi Aynı Sayfada Nasıl Kurulur
- WooCommerce'de Ürün Kategorisi Sayfası Nasıl Özelleştirilir
- WooCommerce Özel Tek Ürün Sayfası Oluşturun
- Sepet Sayfasına WooCommerce Kargo Hesaplayıcı Nasıl Eklenir
- WooCommerce Kayıt Formunda Şartlar ve Koşulları Kabul Edin Onay Kutusu
- WooCommerce'de Sepeti Görüntüle Düğmesi Nasıl Eklenir
- Mevcut Ürün Nasıl Alınır WooCommerce
- Özel Ürün Alanları Nasıl Eklenir WooCommerce
- WooCommerce'de E-posta Şablonu Nasıl Değiştirilir
- WooCommerce Nasıl Kurulur
- WooCommerce'e PayPal Ekspres Ödeme Nasıl Eklenir
- WooCommerce Ödeme Alanı Yer Tutucu Metni Nasıl Değiştirilir