28 WooCommerce Ödeme Kancası: Görsel Bir Kılavuzdan Daha Fazlası

WooCommerce'in en iyi özelliklerinden biri kişiselleştirmedir. Kancalar yardımıyla ürün sayfalarına, sepet sayfasına ve ödeme sayfasına içerik ekleyebilirsiniz.

Bu kılavuz, tüm WooCommerce ödeme kancalarını ve bunları ödeme sayfasında nereye ve ne için yerleştirebileceğinizi listeler.

Kancaların ne olduğuna, türlerine hızlı bir şekilde göz atalım ve ardından ödeme sayfası kancalarına geçelim.

kancalar nedir?

WordPress'teki kancalar, çekirdek dosyaları değiştirmeden kod değiştirmenize veya eklemenize olanak tanır.

Kanca olarak adlandırılırlar çünkü nesneleri tutmak için gerçek hayattaki bir kanca gibi çalışırlar. E-ticaret dünyasında, kancalar ek programlar düzenliyor.

Müşteri deneyimini geliştirmek için mağaza sahipleri ve geliştiriciler bu kancaları kullanır. Paragraflar, ürün açıklamaları, simgeler, resimler, logolar ve metinler ekleyecekleri yer burasıdır.

İki ana kanca türü

Çok sayıda WordPress kancası olmasına rağmen, bunları iki türe ayırabilirsiniz:

1. Eylem kancaları
2. Filtre kancaları

Eylem kancaları

Eylem kancaları, web sitenizin herhangi bir yerine ekstra işlevsellik eklemenize olanak tanır. Bu kanca, ekstra widget'lar, menüler ve hatta bir mesaj eklemek için kullanılabilir.

Bu, bir eylem kancası örneğidir:

add_action( 'woocommerce_before_checkout_billing_form', 'storeapps_before_checkout_billing_form');
function storeapps_before_checkout_billing_form() {
   // kodunuzu buraya ekleyin
}

woocommerce_before_checkout_billing_form kanca, storeapps_callback_function ise özel komut dosyalarımızı eklemek için oluşturduğumuz işlevdir.

Filtre kancaları

Filtre kancaları, mevcut bir işlevi değiştirmenize olanak tanır. Bu kancalarda, yeni bir şey eklemiyorsunuz, sadece verileri değiştiriyor veya filtreliyorsunuz.

Örneğin:

add_filter('woocommerce_breadcrumb_defaults', 'storeapps_change_breadcrumb');
function storeapps_change_breadcrumb( $içerik ) {
   $içerik .= "Mağaza Uygulamaları";
   $içerik döndür;
}

Başka bir örnek, tüm mağazanızın Sepete Ekle düğmelerinin bir filtreyle değiştirilmesi olabilir.

WooCommerce'de neden kanca kullanılmalı?

Ne yapabileceklerini gördükten sonra bu kancaları görmezden gelmenin ve kullanmamanın neredeyse hiçbir yolu yok. Mağazanızdaki her şey özelleştirilebilir, böylece bu kancaları kullanarak istediğiniz bir WooCommerce mağazası oluşturabilirsiniz.

Kanca kullanırsanız, bu sonuçlar hakkında endişelenmenize gerek kalmayacak. Temaları değiştirmek, değişiklikleri etkilemez. Bu nedenle, tüm baş ağrılarından ve risklerden kaçınmak için kancalara bağlı kalmak daha iyidir.

Ödeme, herhangi bir mağaza için en önemli sayfa olduğundan, WooCommerce ödeme sayfası kancalarına bakalım.

Tüm WooCommerce ödeme kancaları

1. woocommerce_before_checkout_form
2. woocommerce_checkout_before_customer_details
3. woocommerce_checkout_billing
4. woocommerce_before_checkout_billing_form
5. woocommerce_after_checkout_billing_form
6. woocommerce_before_checkout_registration_form
7. woocommerce_after_checkout_registration_form
8. woocommerce_checkout_shipping
9. woocommerce_before_checkout_shipping_form
10. woocommerce_after_checkout_shipping_form
11. woocommerce_before_order_notes
12. woocommerce_after_order_notes
13. woocommerce_checkout_after_customer_details
14. woocommerce_checkout_before_order_review_heading
15. woocommerce_checkout_order_review
16. woocommerce_checkout_before_order_review
17. woocommerce_review_order_before_cart_contents
18. woocommerce_review_order_after_cart_contents
19. woocommerce_review_order_before_shipping
20. woocommerce_review_order_after_shipping
21. woocommerce_review_order_before_order_total
22. woocommerce_review_order_after_order_total
23. woocommerce_review_order_before_payment
24. woocommerce_review_order_before_submit
25. woocommerce_review_order_after_submit
26. woocommerce_review_order_after_payment
27. woocommerce_checkout_after_order_review
28. woocommerce_after_checkout_for

Her bir kancaya, nereye yerleştirildiğine ve nasıl ekleyebileceğinize ayrıntılı olarak bakalım.

1. woocommerce_before_checkout_form
Kanca, ödeme formundan önce tanımlanır. Ödeme sayfasındaki kupon alanının üstüne yerleştirilir.

add_action( 'woocommerce_before_checkout_form', 'storeapps_before_checkout_form', 10 );
function storeapps_before_checkout_form() {
	echo '<h2>woocommerce_before_checkout_form</h2>';
}

2. woocommerce_checkout_before_customer_details
Kanca, müşteri detaylarından hemen önce ödeme formunda tanımlanır.

add_action( 'woocommerce_checkout_before_customer_details', 'storeapps_checkout_before_customer_details', 10 );
function storeapps_checkout_before_customer_details() {
	echo '<h2>woocommerce_checkout_before_customer_details</h2>';
}

3. woocommerce_checkout_billing
Bu, ödeme sayfasına eklenen yeni bir kancadır. Ödeme sayfasındaki faturalandırma formu şablonu bu kanca kullanılarak eklenir.

add_action('woocommerce_checkout_billing', 'storeapps_checkout_billing');
function storeapps_checkout_billing() {
    echo '<h2>woocommerce_checkout_billing</h2>';
}

4. woocommerce_before_checkout_billing_form
Kanca, faturalandırma formunun başlangıcından önce tanımlanır.

add_action( 'woocommerce_before_checkout_billing_form', 'storeapps_before_checkout_billing_form', 10 );
function storeapps_before_checkout_billing_form() {
	echo '<h2>woocommerce_before_checkout_billing_form</h2>';
}

5. woocommerce_after_checkout_billing_form
Kanca, fatura formunun doldurulmasından sonra tanımlanır.

add_action( 'woocommerce_after_checkout_billing_form', 'storeapps_after_checkout_billing_form', 10 );
function storeapps_after_checkout_billing_form() {
	echo '<h2>woocommerce_after_checkout_billing_form</h2>';
}

6. woocommerce_before_checkout_registration_form
Kanca, hesap oluşturma formundan sonra faturalama formu şablonunda tanımlanır. Bu, konuk kullanıcılar için yürütülecektir.

add_action('woocommerce_before_checkout_registration_form', 'storeapps_before_checkout_registration');
function storeapps_before_checkout_registration_form() {
    echo '<h2>woocommerce_before_checkout_registration_form</h2>';
}

7. woocommerce_after_checkout_registration_form
Bu kanca, faturalandırma formu şablonunda tanımlanmıştır. Bu, konuk kullanıcılar için yürütülecektir.

add_action('woocommerce_after_checkout_registration_form', 'storeapps_after_checkout_registration_form');
function storeapps_after_checkout_registration_form() {
    echo '<h2>woocommerce_after_checkout_registration_form</h2>';
}

8. woocommerce_checkout_shipping
Bu kanca, gönderim formundan önce gönderim formu şablonunda tanımlanır.

add_action('woocommerce_checkout_shipping', 'storeapps_checkout_shipping');
function storeapps_checkout_shipping() {
    echo '<h2>woocommerce_checkout_shipping</h2>';
}

9. woocommerce_before_checkout_shipping_form
Bu kanca, nakliye formunun başlangıcından hemen önce tanımlanır.

add_action( 'woocommerce_before_checkout_shipping_form', 'storeapps_before_checkout_shipping_form', 10 );
function storeapps_before_checkout_shipping_form() {
	echo '<h2>woocommerce_before_checkout_shipping_form</h2>';
}

10. woocommerce_after_checkout_shipping_form
Bu kanca, nakliye formunun tamamlanmasından sonra tanımlanır.

add_action( 'woocommerce_after_checkout_shipping_form', 'storeapps_after_checkout_shipping_form', 10 );
function storeapps_after_checkout_shipping_form() {
	echo '<h2>woocommerce_after_checkout_shipping_form</h2>';
}

11. woocommerce_before_order_notes
Bu kanca, ödeme sayfasındaki sipariş notları alanından önce tanımlanır.

add_action( 'woocommerce_before_order_notes', 'storeapps_before_order_notes', 10 );
function storeapps_before_order_notes() {
	echo '<h2>woocommerce_before_order_notes</h2>';
}

12. woocommerce_after_order_notes
Bu kanca, ödeme sayfasındaki sipariş notları alanından sonra tanımlanır.

add_action('woocommerce_after_order_notes', 'storeapps_after_order_notes', 10);
function storeapps_after_order_notes() {
	echo '<h2>woocommerce_after_order_notes</h2>';
}

13. woocommerce_checkout_after_customer_details
Kanca, müşteri ayrıntılarını tamamladıktan sonra, yani faturalama ve nakliye alanlarından sonra yerleştirilir.

add_action( 'woocommerce_checkout_after_customer_details', 'storeapps_checkout_after_customer_details', 10 );
function storeapps_checkout_after_customer_details() {
	echo '<h2>woocommerce_checkout_after_customer_details</h2>';
}

14. woocommerce_checkout_before_order_review_heading
Bu kanca, ödeme şablonunda sipariş inceleme başlığından, yani "Siparişiniz"den önce tanımlanır. Bu kanca WooCommerce v3.6.0'a eklendi.

add_action('woocommerce_checkout_before_order_review_heading', 'storeapps_checkout_before_order_review_heading');
function storeapps_checkout_before_order_review_heading() {
    echo '<h2>woocommerce_checkout_before_order_review_heading</h2>';
}

15. woocommerce_checkout_order_review
Kanca, ana ödeme şablonunda tanımlanır. Sipariş gözden geçirme tablosu şablonu bu kanca kullanılarak dahil edilmiştir.

add_action('woocommerce_checkout_order_review', 'storeapps_checkout_order_review');
function storeapps_checkout_order_review() {
    echo '<h2>woocommerce_checkout_order_review</h2>';
}

16. woocommerce_checkout_before_order_review
Bu kanca, ödeme sayfasındaki sipariş ayrıntılarından önce tanımlanır.

add_action( 'woocommerce_checkout_before_order_review', 'storeapps_checkout_before_order_review', 10 );
function storeapps_checkout_before_order_review() {
	echo '<h2>woocommerce_checkout_before_order_review</h2>';
}

17. woocommerce_review_order_before_cart_contents
Bu kanca, içerikten önce sipariş tablosu gövdesi içinde tanımlanır.

add_action( 'woocommerce_review_order_before_cart_contents', 'storeapps_review_order_before_cart_contents', 10 );
function storeapps_review_order_before_cart_contents() {
	echo '<h2>woocommerce_review_order_before_cart_contents</h2>';
}

18. woocommerce_review_order_after_cart_contents
Bu kanca, tüm içerikten sonra sipariş tablosu gövdesi içinde tanımlanır.

add_action( 'woocommerce_review_order_after_cart_contents', 'storeapps_review_order_after_cart_contents', 10 );
function storeapps_review_order_after_cart_contents() {
	echo '<h2>woocommerce_review_order_after_cart_contents</h2>';
}

19. woocommerce_review_order_before_shipping
Bu kanca sipariş tablosunda sevkiyat bölümünden önce tanımlanmıştır.

add_action( 'woocommerce_review_order_before_shipping', 'storeapps_review_order_before_shipping', 10 );
function storeapps_review_order_before_shipping() {
	echo '<h2>woocommerce_review_order_before_shipping</h2>';
}

20. woocommerce_review_order_after_shipping
Bu kanca, sipariş ayrıntıları tablosundaki nakliye bölümünden sonra tanımlanır.

add_action( 'woocommerce_review_order_after_shipping', 'storeapps_review_order_after_shipping', 10 );
function storeapps_review_order_after_shipping() {
	echo '<h2>woocommerce_review_order_after_shipping</h2>';
}

21. woocommerce_review_order_before_order_total
Bu kanca, sipariş ayrıntıları tablosundaki toplam bölümden önce ve nakliye bölümünden sonra tanımlanır.

add_action( 'woocommerce_review_order_before_order_total', 'storeapps_review_order_before_order_total', 10 );
function storeapps_review_order_before_order_total() {
	echo '<h2>woocommerce_review_order_before_order_total</h2>';
}

22. woocommerce_review_order_after_order_total
Bu kanca, toplam bölümden sonra ve sipariş ayrıntıları tablosunda tanımlanır.

add_action( 'woocommerce_review_order_after_order_total', 'storeapps_review_order_after_order_total', 10 );
function storeapps_review_order_after_order_total() {
	echo '<h2>woocommerce_review_order_after_order_total</h2>';
}

23. woocommerce_review_order_before_payment
Bu kanca, ödeme sayfasındaki ödeme yöntemleri bölümünden önce tanımlanır.

add_action( 'woocommerce_review_order_before_payment', 'storeapps_review_order_before_payment', 10 );
function storeapps_review_order_before_payment() {
	echo '<h2>woocommerce_review_order_before_payment</h2>';
}

24. woocommerce_review_order_before_submit
Bu kanca, ödeme sayfasındaki 'Sipariş Ver' düğmesinden önce tanımlanır.

add_action( 'woocommerce_review_order_before_submit', 'storeapps_review_order_before_submit', 10 );
function storeapps_review_order_before_submit() {
	echo '<h2>woocommerce_review_order_before_submit</h2>';
}

25. woocommerce_review_order_after_submit
Bu kanca, ödeme sayfasındaki 'Sipariş Ver' düğmesinden sonra tanımlanır.

add_action( 'woocommerce_review_order_after_submit', 'storeapps_review_order_after_submit', 10 );
function storeapps_review_order_after_submit() {
	echo '<h2>woocommerce_review_order_after_submit</h2>';
}

26. woocommerce_review_order_after_payment
Bu kanca, 'Sipariş Ver' düğmesi dahil olmak üzere tüm ödeme bölümünden sonra tanımlanır.

add_action( 'woocommerce_review_order_after_payment', 'storeapps_review_order_after_payment', 10 );
function storeapps_review_order_after_payment() {
	echo '<h2>woocommerce_review_order_after_payment</h2>';
}

27. woocommerce_checkout_after_order_review
Bu kanca, sipariş ayrıntıları tablosu ve ödeme bölümünü içeren ödeme sayfasındaki sipariş inceleme bölümünden sonra tanımlanır.

add_action( 'woocommerce_checkout_after_order_review', 'storeapps_checkout_after_order_review', 10 );
function storeapps_checkout_after_order_review() {
	echo '<h2>woocommerce_checkout_after_order_review</h2>';
}

28. woocommerce_after_checkout_form
Bu kanca, ödeme formunun sonunda tanımlanır.

add_action( 'woocommerce_after_checkout_form', 'storeapps_after_checkout_form', 10 );
function storeapps_after_checkout_form() {
	echo '<h2>woocommerce_after_checkout_form</h2>';
}

Ödeme sayfasındaki varsayılan eylemleri kaldırma

Varsayılan olarak, WooCommerce tarafından aşağıdakileri eklemek için yalnızca bazı kancalar kullanılır:

• ödeme formundan önce giriş formu (woocommerce_checkout_login_form)
• ödeme formundan önceki kupon formu (woocommerce_checkout_coupon_form)
• sipariş inceleme tablosu sipariş inceleme bölümüne (woocommerce_order_review)
• ödeme tablosu ayrıca sipariş inceleme bölümüne (woocommerce_checkout_payment)

Bu kod aşağıda gösterildiği gibi kolayca kaldırılabilir. WordPress kod parçacıklarını güvenli bir şekilde eklemek için bu dokümana da başvurabilirsiniz.

/**
 * Varsayılan WooCommerce ödeme kancalarını kaldırın
 */
remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_login_form', 10 );
remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_coupon_form', 10 );
remove_action( 'woocommerce_checkout_order_review', 'woocommerce_order_review', 10 );
remove_action( 'woocommerce_checkout_order_review', 'woocommerce_checkout_payment', 20 );

WooCommerce'de özel ödeme alanı düzenleyicisi

Yukarıdaki örnekler, basit kod parçacıklarıyla bazı metinlerin WooCommerce ödeme sayfasına nasıl ekleneceğini gösterir.

Peki ya özel ödeme alanları? Özel kodlama çok daha fazla çalışma gerektirir.

Ancak Cashier'in yardımıyla, temel WooCommerce alanlarını düzenleyebilir/ekleyebilir/kaldırabilir ve ayrıca nakliye, faturalandırma ve ek alanlar bölümü için özel alanlar ekleyebilirsiniz.

toparlamak

Umarım bu kılavuz, tüm önemli WooCommerce ödeme kancalarını kapsamanıza yardımcı olmuştur.

Çevrimiçi mağazanızın ödeme sayfasını daha iyi hale getirmek için bunları kullanın. Sonuç olarak, bir ödeme sayfası müşterilerinize açılan bir ağ geçidi gibidir ve bu kancalar, akıllıca kullanılırsa mağazanızın genel kullanıcı deneyimini iyileştirebilir.

Ve daha fazla ödeme optimizasyonu için WooCommerce ödeme eklentileri her zaman yardıma hazır.