27+ Kait Checkout WooCommerce Diilustrasikan
Diterbitkan: 2022-07-02Dalam posting ini, Anda akan belajar cara menggunakan kait checkout di WooCommerce. Tetaplah sampai akhir, karena kita akan melihat kait utama dan memberi Anda contoh apa yang dapat Anda lakukan dengannya. Mereka membantu Anda menyesuaikan halaman checkout untuk meningkatkan tingkat konversi Anda.
Kait WooCommerce
Hooks adalah fungsi hebat yang memungkinkan Anda mengubah atau menambahkan kode tanpa memodifikasi file inti. Mereka memberikan banyak fleksibilitas, dan pengembang menggunakannya untuk mengubah fungsionalitas default WooCommerce.
Anda harus mencatat bahwa ada dua jenis kait yang berbeda:
- Kait tindakan – Mereka memungkinkan Anda untuk menambahkan kode khusus untuk melakukan tindakan tertentu ketika suatu peristiwa terjadi.
- Kait filter – Mereka mengubah perilaku variabel atau fungsi yang ada.
Kait Pembayaran WooCommerce
Hooks membantu pengembang untuk membuat solusi yang disesuaikan secara praktis dan fleksibel. Kait checkout adalah salah satu jenis dari beberapa kait yang didukung oleh WooCommerce. Kait checkout dapat digunakan untuk menambahkan beberapa konten sebelum bidang penagihan, menerapkan beberapa logika untuk menaikkan harga atau membatasi pengguna berdasarkan peran, sebelum peninjauan pesanan atau setelah formulir pembayaran, dan banyak lagi.
Anda harus memperhatikan bahwa kait WooCommerce bekerja persis seperti kait asli WordPress. Sebelum kita mulai, saya sangat menyarankan untuk membuat tema anak agar perubahan Anda tidak hilang.
Halaman Checkout WooCommerce memiliki kait berikut:
1. woocommerce_before_checkout_form
Kait woocommerce_before_checkout_form didefinisikan sebelum formulir checkout. Itu ditempatkan di atas bidang kupon pada halaman checkout.
add_action( 'woocommerce_before_checkout_form', 'njengah_before_checkout_form', 10 );fungsi njengah_before_checkout_form(){ echo '<h2>woocommerce_before_checkout_form</h2>'; }
2. woocommerce_checkout_before_customer_details
Kait woocommerce_checkout_before_customer_details didefinisikan dalam formulir checkout tepat sebelum detail pelanggan.
add_action( 'woocommerce_checkout_before_customer_details', 'njengah_checkout_before_customer_details', 10 ); fungsi njengah_checkout_before_customer_details(){ echo '<h2>woocommerce_checkout_before_customer_details</h2>'; }
3. woocommerce_checkout_billing
Woocommerce_checkout_billing adalah pengait baru yang ditambahkan ke halaman checkout. Templat formulir penagihan di halaman checkout disertakan menggunakan kait ini.
add_action('woocommerce_checkout_billing', 'njengah_checkout_billing');fungsi njengah_checkout_billing() { echo '<h2>woocommerce_checkout_billing</h2>'; }
4. woocommerce_before_checkout_billing_form
Kait woocommerce_before_checkout_billing_form ditentukan sebelum dimulainya formulir penagihan.
add_action( 'woocommerce_before_checkout_billing_form', 'njengah_before_checkout_billing_form', 10 ); fungsi njengah_before_checkout_billing_form(){ echo '<h2>woocommerce_before_checkout_billing_form</h2>'; }
5. woocommerce_after_checkout_billing_form
Kait woocommerce_after_checkout_billing_form ditentukan setelah formulir penagihan selesai.
add_action( 'woocommerce_after_checkout_billing_form', 'njengah_after_checkout_billing_form', 10 );fungsi njengah_after_checkout_billing_form(){ echo '<h2>woocommerce_after_checkout_billing_form</h2>'; }
6. woocommerce_before_checkout_registration_form
Kait woocommerce_before_checkout_registration_form ditentukan dalam templat formulir penagihan setelah formulir pembuatan akun. Ini akan dijalankan untuk pengguna tamu.
add_action('woocommerce_before_checkout_registration_form', 'njengah_checkout_billing'); fungsi njengah_checkout_billing() { echo '<h2>woocommerce_before_checkout_registration_form</h2>'; }
7. woocommerce_after_checkout_registration_form
Kait woocommerce_after_checkout_registration_form didefinisikan dalam templat formulir penagihan. Ini akan dijalankan untuk pengguna tamu.
add_action('woocommerce_after_checkout_registration_form', 'njengah_after_checkout_registration_form');function njengah_after_checkout_registration_form() { echo '<h2>woocommerce_after_checkout_registration_form</h2>'; }
8. woocommerce_checkout_shipping
Kait woocommerce_checkout_shipping ditentukan dalam templat formulir pengiriman sebelum formulir pengiriman.
add_action('woocommerce_checkout_shipping', 'njengah_checkout_shipping'); fungsi njengah_checkout_shipping() { echo '<h2>woocommerce_checkout_shipping</h2>'; }
9. woocommerce_before_checkout_shipping_form
Kait woocommerce_before_checkout_shipping_form didefinisikan tepat sebelum formulir pengiriman dimulai.
add_action( 'woocommerce_before_checkout_shipping_form', 'njengah_before_checkout_shipping_form', 10 );fungsi njengah_before_checkout_shipping_form(){ echo '<h2>woocommerce_before_checkout_shipping_form</h2>'; }
10. woocommerce_after_checkout_shipping_form
Kait woocommerce_after_checkout_shipping_form ditentukan setelah formulir pengiriman selesai.
add_action( 'woocommerce_after_checkout_shipping_form', 'njengah_after_checkout_shipping_form', 10 ); fungsi njengah_after_checkout_shipping_form(){ echo '<h2>woocommerce_after_checkout_shipping_form</h2>'; }
11. woocommerce_before_order_notes
Kait woocommerce_before_order_notes ditentukan sebelum bidang catatan pesanan pada halaman checkout.
add_action( 'woocommerce_before_order_notes', 'njengah_before_order_notes', 10 );fungsi njengah_before_order_notes(){ echo '<h2>woocommerce_before_order_notes</h2>'; }
12. woocommerce_after_order_notes
Kait woocommerce_after_order_notes ditentukan setelah bidang catatan pesanan pada halaman checkout.
add_action( 'woocommerce_after_order_notes', 'njengah_after_order_notes', 10 ); fungsi njengah_after_order_notes(){ echo '<h2>woocommerce_after_order_notes</h2>'; }
13. woocommerce_checkout_after_customer_details
Kait woocommerce_checkout_after_customer_details ditempatkan setelah selesainya detail pelanggan yaitu setelah bidang penagihan & pengiriman.
add_action( 'woocommerce_checkout_after_customer_details', 'njengah_checkout_after_customer_details', 10 );fungsi njengah_checkout_after_customer_details(){ echo '<h2>woocommerce_checkout_after_customer_details</h2>'; }
14. woocommerce_checkout_before_order_review_heading
Kait woocommerce_checkout_before_order_review_heading didefinisikan dalam template checkout sebelum judul tinjauan pesanan yaitu "Pesanan Anda". Kait ini telah ditambahkan di WooCommerce v3.6.0.
add_action('woocommerce_checkout_before_order_review_heading', 'njengah_checkout_before_order_review_heading'); function njengah_checkout_before_order_review_heading() { echo '<h2>woocommerce_checkout_before_order_review_heading</h2>';}
15. woocommerce_checkout_order_review
Kait woocommerce_checkout_order_review didefinisikan dalam template checkout utama. Templat tabel ulasan pesanan disertakan menggunakan kait ini.
add_action('woocommerce_checkout_order_review', 'njengah_checkout_order_review'); function njengah_checkout_order_review() { echo '<h2>woocommerce_checkout_order_review</h2>'; }
16. woocommerce_checkout_before_order_review
Kait woocommerce_checkout_before_order_review ditentukan sebelum detail pesanan di halaman checkout.
add_action( 'woocommerce_checkout_before_order_review', 'njengah_checkout_before_order_review', 10 );fungsi njengah_checkout_before_order_review(){ echo '<h2>woocommerce_checkout_before_order_review</h2>'; }
17. woocommerce_review_order_before_cart_contents
Kait woocommerce_review_order_before_cart_contents didefinisikan di dalam badan tabel pesanan sebelum konten.
add_action( 'woocommerce_review_order_before_cart_contents', 'njengah_review_order_before_cart_contents', 10 ); fungsi njengah_review_order_before_cart_contents(){ echo '<h2>woocommerce_review_order_before_cart_contents</h2>'; }
18. woocommerce_review_order_after_cart_contents
Kait woocommerce_review_order_after_cart_contents didefinisikan di dalam badan tabel pesanan setelah semua konten.
add_action( 'woocommerce_review_order_after_cart_contents', 'njengah_review_order_after_cart_contents', 10 );fungsi njengah_review_order_after_cart_contents(){ echo '<h2>woocommerce_review_order_after_cart_contents</h2>'; }
19. woocommerce_review_order_before_shipping
Kait woocommerce_review_order_before_shipping ditentukan sebelum bagian pengiriman di tabel pesanan.
add_action( 'woocommerce_review_order_before_shipping', 'njengah_review_order_before_shipping', 10 ); fungsi njengah_review_order_before_shipping(){ echo '<h2>woocommerce_review_order_before_shipping</h2>'; }
20. woocommerce_review_order_after_shipping
Kait woocommerce_review_order_after_shipping ditentukan setelah bagian pengiriman di tabel detail pesanan.
add_action( 'woocommerce_review_order_after_shipping', 'njengah_review_order_after_shipping', 10 ); fungsi njengah_review_order_after_shipping(){ echo '<h2>woocommerce_review_order_after_shipping</h2>'; }
21. woocommerce_review_order_before_order_total
Kait woocommerce_review_order_before_order_total ditentukan sebelum bagian total & setelah bagian pengiriman di tabel detail pesanan.
add_action( 'woocommerce_review_order_before_order_total', 'njengah_review_order_before_order_total', 10 ); fungsi njengah_review_order_before_order_total(){ echo '<h2>woocommerce_review_order_before_order_total</h2>'; }
22. woocommerce_review_order_after_order_total
Kait woocommerce_review_order_after_order_total ditentukan setelah bagian total & dalam tabel detail pesanan.
add_action( 'woocommerce_review_order_after_order_total', 'njengah_review_order_after_order_total', 10 ); fungsi njengah_review_order_after_order_total(){ echo '<h2>woocommerce_review_order_after_order_total</h2>'; }
23. woocommerce_review_order_before_payment
Kait woocommerce_review_order_before_payment ditentukan sebelum bagian metode pembayaran di halaman checkout.
add_action( 'woocommerce_review_order_before_payment', 'njengah_review_order_before_payment', 10 ); fungsi njengah_review_order_before_payment(){ echo '<h2>woocommerce_review_order_before_payment</h2>'; }
24. woocommerce_review_order_before_submit
Kait woocommerce_review_order_before_submit ditentukan sebelum tombol 'Pesan' pada halaman checkout.
add_action( 'woocommerce_review_order_before_submit', 'njengah_review_order_before_submit', 10 ); fungsi njengah_review_order_before_submit(){ echo '<h2>woocommerce_review_order_before_submit</h2>'; }
25. woocommerce_review_order_after_submit
Kait woocommerce_review_order_after_submit ditentukan setelah tombol 'Pesan' pada halaman checkout.
add_action( 'woocommerce_review_order_after_submit', 'njengah_review_order_after_submit', 10 ); fungsi njengah_review_order_after_submit(){ echo '<h2>woocommerce_review_order_after_submit</h2>'; }
26. woocommerce_review_order_after_payment
Kait woocommerce_review_order_after_payment ditentukan setelah seluruh bagian pembayaran termasuk tombol 'Tempatkan Pesanan'.
add_action( 'woocommerce_review_order_after_payment', 'njengah_review_order_after_payment', 10 ); fungsi njengah_review_order_after_payment(){ echo '<h2>woocommerce_review_order_after_payment</h2>'; }
27. woocommerce_checkout_after_order_review
Kait woocommerce_checkout_after_order_review ditentukan setelah bagian tinjauan pesanan pada halaman checkout, yang mencakup tabel detail pesanan, dan bagian pembayaran.
add_action( 'woocommerce_checkout_after_order_review', 'njengah_checkout_after_order_review', 10 ); fungsi njengah_checkout_after_order_review(){ echo '<h2>woocommerce_checkout_after_order_review</h2>'; }
28. woocommerce_after_checkout_form
Kait woocommerce_after_checkout_form didefinisikan di akhir setelah formulir checkout.
add_action( 'woocommerce_after_checkout_form', 'njengah_after_checkout_form', 10 ); fungsi njengah_after_checkout_form(){ echo '<h2>woocommerce_after_checkout_form</h2>'; }
Kesimpulan
Posting ini menggambarkan semua kait WooCommerce yang tersedia di halaman checkout. Kait ini memungkinkan Anda untuk menyesuaikan halaman checkout sesuai dengan kebutuhan Anda.
Jika ini pertama kalinya Anda menggunakan hook, Anda dapat menyalin skrip ini dan menempelkannya langsung ke file functions.php dari Tema Anak Anda. Anda sekarang bisa berkreasi dan menyesuaikan halaman checkout untuk meningkatkan tingkat konversi.
Atau, Anda dapat menggunakan plugin untuk menyesuaikan bagian ini jika Anda tidak terbiasa dengan kodenya. Jika Anda memerlukan penyesuaian lebih lanjut, harap pertimbangkan untuk menyewa pengembang WordPress yang memenuhi syarat.
Artikel Serupa
- Apa itu Tema Etalase Toko WooCommerce? [Dijawab]
- Cara Menempatkan Keranjang WooCommerce dan Checkout di Satu Halaman
- Cara Menambahkan Bidang Ekstra di Formulir Pembayaran WooCommerce
- Cara Menyesuaikan Halaman Checkout Etalase
- Cara Menghapus Halaman Keranjang WooCommerce Storefront Theme
- Cara Menyembunyikan Pajak Saat Checkout Jika Nilai Bidang Ada WooCommerce
- Bagaimana Menyembunyikan Bidang Nama Perusahaan Halaman Checkout WooCommerce
- Cara Menghapus Tombol Checkout WooCommerce
- Cara Mengubah Kuantitas Di WooCommerce Checkout
- Cara Menghapus Halaman Checkout Informasi Tambahan WooCommerce