Cara Mudah Menyembunyikan dan Menghapus Bidang Checkout WooCommerce (Plugin dan PHP)

Diterbitkan: 2019-10-14

Pembayaran adalah salah satu langkah terpenting di toko eCommerce mana pun. Jika Anda ingin sukses dan meningkatkan penjualan Anda, Anda harus membuatnya tetap ramping. Itulah mengapa hari ini kami akan menunjukkan cara menyembunyikan dan menghapus kolom checkout WooCommerce .

Beberapa hari yang lalu, kami memberi Anda beberapa tips tentang cara mengoptimalkan situs Anda. Namun, langkah terakhir dari sales funnel sangat penting untuk menutup penjualan sehingga perlu perhatian khusus.

Mengapa menonaktifkan bidang checkout WooCommerce?

Tahukah Anda bahwa lebih dari 75% pengguna menambahkan produk ke troli tetapi kemudian meninggalkan situs web tanpa membeli apa pun? Salah satu alasan utama pengabaian keranjang belanja adalah checkout terlalu lama atau rumit .

Untuk menghindari hal ini, halaman checkout harus sederhana dan hanya memiliki kolom yang diperlukan. Ini sangat penting jika Anda menjual produk digital atau virtual seperti perangkat lunak, musik, ebook, dan sebagainya. Karena jenis produk ini tidak perlu dikirim, mereka harus memiliki halaman checkout khusus di mana Anda tidak menanyakan detail seperti alamat atau kode pos misalnya.

Untuk mengetahui lebih lanjut tentang cara meningkatkan pembayaran untuk produk digital, Anda dapat membaca artikel ini. Jadi, untuk meningkatkan konversi, Anda harus menyembunyikan bidang yang hanya menambah gangguan dan gesekan ke halaman checkout.

Mari kita lihat cara menghapus bidang checkout di WooCommerce dan mempercepat proses checkout.

Bagaimana cara menghapus bidang checkout di WooCommerce?

Karena tidak mungkin menghapus bidang checkout default WooCommerce dari dasbor WordPress, dalam tutorial ini, kami akan menunjukkan cara menyembunyikan dan menghapus bidang checkout dengan dua cara berbeda:

  1. Menggunakan plugin
  2. Dengan skrip PHP

Menggunakan plugin adalah cara termudah jika Anda bukan seorang pengembang. Skrip PHP, di sisi lain, memungkinkan Anda untuk menyembunyikan bidang checkout yang ada dan menyesuaikan toko WooCommerce Anda dengan sedikit pengkodean. Tidak ada metode yang lebih baik atau lebih buruk. Anda akan mendapatkan hasil yang sama dengan keduanya, jadi tergantung pada keahlian Anda, Anda dapat memilih salah satu yang paling cocok untuk Anda.

1) Hapus bidang checkout WooCommerce menggunakan plugin

Ada banyak alat untuk menonaktifkan dan menyembunyikan bidang di halaman checkout. Di sini kami akan menunjukkan cara melakukannya menggunakan dua plugin gratis:

  1. Manajer Pembayaran WooCommerce
  2. Pembayaran Langsung untuk WooCommerce

Alat-alat ini bekerja dengan cara yang sama tetapi memiliki beberapa perbedaan. Mari kita lihat lebih dekat bagaimana plugin ini dapat membantu Anda menghapus beberapa bidang checkout.

1.1 – Hapus bidang checkout dengan WooCommerce Checkout Manager

WooCommerce Checkout Manager adalah salah satu alat terbaik untuk menghapus bidang checkout. Plugin freemium ini memiliki versi gratis dan 3 paket premium mulai dari 19 USD (pembayaran satu kali).

Untuk menonaktifkan salah satu bidang checkout WooCommerce cukup ikuti langkah-langkah ini:

    1. Instal dan aktifkan WooCommerce Checkout Manager. Anda dapat pergi ke Plugins > Add New dan mencari “ WooCommerce Checkout Manager ” atau mengunduhnya secara gratis dari tautan ini. Alat ini memiliki versi pro dengan fitur yang lebih canggih tetapi untuk tugas ini, versi gratisnya sudah cukup.
    2. Buka tab WooCommerce di dasbor WordPress Anda
    3. Klik pada Checkout dan kemudian pada tab Penagihan .
    4. Anda akan melihat daftar semua bidang yang dapat Anda sembunyikan, jadi aktifkan saja opsi nonaktifkan pada bidang yang ingin Anda hapus.
    5. Setelah itu, Anda dapat pergi ke tab Pengiriman dan Tambahan dan menonaktifkan bidang yang ingin Anda hapus.
    6. Setelah Anda menyembunyikan semua bidang yang tidak Anda inginkan di halaman checkout WooCommerce, ingatlah untuk menyimpan perubahan dan hanya itu!

Pendek dan manis, bukan? Selain menghapus bidang, plugin ini juga memungkinkan Anda menambahkan bidang baru, membuat bidang opsional atau wajib, mengubah urutan tampilan bidang, menerapkan logika kondisional, dan banyak lagi. Jadi, jika Anda menginginkan alat untuk menyesuaikan checkout, WooCommerce Checkout Manager adalah pilihan yang sangat baik.

1.2 – Hapus bidang checkout dengan Direct Checkout untuk WooCommerce

WooCommerce Direct Checkout adalah plugin luar biasa yang dirancang untuk menyederhanakan proses checkout dan halaman checkout. Alat ini bertujuan untuk mempercepat proses pembayaran guna memberikan pengalaman pembelian yang lebih baik kepada pengguna. Tidak seperti WooCommerce Checkout Manager yang memungkinkan Anda untuk mengaktifkan dan menonaktifkan bidang, Direct Checkout membantu Anda menghapus bidang yang tidak perlu dan meningkatkan tingkat konversi .

Ini adalah alat freemium. Ini memiliki versi gratis dengan fitur dasar dan 3 paket premium mulai dari 19 USD (pembayaran satu kali). Untuk menghapus bidang dari halaman checkout WooCommerce dengan Direct Checkout, Anda perlu:

  1. Instal dan aktifkan WooCommerce Direct Checkout. Di dasbor WP Anda, Anda dapat pergi ke Plugins > Add New dan cari “ WooCommerce Direct Checkout ” atau unduh secara gratis dari tautan ini.
  2. Buka tab WooCommerce di dasbor WordPress Anda.
  3. Tekan Checkout Langsung , lalu buka tab Checkout .
  4. Di sini, Anda akan melihat daftar semua bidang yang dapat Anda hapus seperti negara, negara bagian, komentar pesanan, teks kebijakan, kolom, dan lainnya. Dari tab Umum , Anda juga dapat mengarahkan pengguna dari halaman produk langsung ke pembayaran dari opsi Add to cart redirect to .
  5. Setelah Anda menghapus bidang yang tidak Anda inginkan di halaman checkout, cukup simpan perubahannya.

Kesimpulannya, jika Anda menginginkan solusi yang cepat dan mudah, kedua plugin ini adalah pilihan yang sangat baik. Mereka memungkinkan Anda untuk menghapus bidang checkout WooCommerce dalam beberapa klik dan mengoptimalkan toko Anda.

Selain sangat mudah digunakan, alat ini memiliki kinerja yang sangat baik dan merupakan dua plugin checkout terbaik untuk WooCommerce. Kelemahan utama dari metode ini adalah ketika Anda memasang plugin, Anda sedang memodifikasi kode situs web Anda. Ini meningkatkan kerumitannya dan kemungkinan memecahkan sesuatu. Akibatnya, skrip yang disesuaikan dapat menjadi metode yang baik jika Anda merasa nyaman dengan menulis beberapa baris kode.

2) Hapus bidang checkout WooCommerce dengan skrip PHP

CATATAN : Sebelum memulai, kami sarankan Anda membuat tema anak. Dengan cara ini, alih-alih menyesuaikan file tema induk, Anda akan memodifikasi tema anak sehingga penyesuaian Anda tidak akan ditimpa saat Anda memperbarui tema induk. Jika Anda tidak ingin membuat tema anak, Anda dapat membuat cadangan lengkap situs Anda jika terjadi kesalahan.

Di bagian ini, kami akan menunjukkan bagaimana Anda dapat menghapus bidang checkout dari checkout WooCommerce yang mengkodekan solusi Anda sendiri. Jika Anda telah memeriksa tutorial kami tentang cara mengedit bidang checkout, Anda akan terbiasa dengan hook WooCommerce. Dalam hal ini, kita akan menggunakan hook woocommerce_checkout_fields dan kita akan menyebutnya quadlayers_remove_checkout_fields sebagai berikut:

 add_filter( 'woocommerce_checkout_fields' , 'quadlayers_remove_checkout_fields' );

Ini adalah jenis kait filter, yang berarti ia harus mengembalikan sesuatu saat Anda menjalankannya. Dan apa yang akan kembali? Data dengan bidang yang ingin Anda hapus.

Hapus nama belakang

Misalnya, jika Anda ingin menghapus bidang nama belakang, Anda dapat menggunakan yang berikut ini:

 unset($fields['billing']['billing_last_name']);

Setelah itu, Anda perlu memasukkannya ke dalam fungsi dengan nama yang sama dengan yang Anda gunakan di kait filter pada langkah pertama ( quadlayers_remove_checkout_fields ):

 function quadlayers_remove_checkout_fields( $fields ) {

unset($fields['billing']['billing_last_name']); 

kembalikan $bidang; 

}

Terakhir, masukkan skrip lengkap untuk menghapus nama belakang bidang WooCommerce di file functions.php dari tema anak seperti yang ditunjukkan di bawah ini:

 add_filter( 'woocommerce_checkout_fields' , 'quadlayers_remove_checkout_fields' ); 

function quadlayers_remove_checkout_fields( $fields ) { 

unset($fields['billing']['billing_last_name']); 

kembalikan $bidang; 

}

Hapus bidang lainnya

Jadi, jika Anda ingin menghapus bidang lain, Anda perlu menambahkan baris yang sesuai. Di bawah ini Anda dapat menemukan nama bidang yang tersedia yang dapat Anda hapus:

 unset($fields['billing']['billing_first_name']);
unset($fields['billing']['billing_last_name']);
unset($fields['billing']['billing_company']);
unset($fields['billing']['billing_address_1']);
unset($fields['billing']['billing_address_2']);
unset($fields['billing']['billing_city']);
unset($fields['billing']['billing_postcode']);
unset($fields['billing']['billing_country']);
unset($fields['billing']['billing_state']);
unset($fields['billing']['billing_phone']);
unset($fields['order']['order_comments']);
unset($fields['billing']['billing_email']);
unset($fields['account']['account_username']);
unset($fields['account']['account_password']);
unset($fields['account']['account_password-2']);

Bagaimana cara menampilkan bidang checkout yang sebelumnya telah Anda hapus?

Apa yang dapat Anda lakukan jika Anda telah menghapus beberapa bidang checkout yang ingin Anda tampilkan lagi? Cukup hapus baris kode yang menyembunyikan bidang tertentu yang ingin Anda tampilkan. Misalnya, jika Anda menonaktifkan bidang kode pos dari bagian penagihan dan sekarang Anda ingin menambahkannya lagi, Anda harus menghapus baris berikut dari file functions.php tema anak Anda:

 unset($fields['billing']['billing_postcode']);

Demikian pula, jika Anda ingin menampilkan beberapa bidang sekaligus, Anda dapat menghapus beberapa baris sekaligus.

Bonus: Bagaimana cara menghapus Tab Informasi Tambahan di WooCommerce?

Tab Informasi Tambahan hadir secara default di WooCommerce. Karena tab ini hanya ditampilkan ketika produk memiliki berat, dimensi, atau atribut, terkadang tab ini tidak terlalu berguna. Ada dua cara untuk menonaktifkan tab Informasi Tambahan:

  1. Via PHP : Mengedit file functions.php .
  2. Melalui CSS : Mengedit file style.css .

Dari segi kinerja, metode PHP lebih baik karena menghentikan pemuatan tab (daripada memuatnya lalu menyembunyikannya). Jadi di sini kami akan menunjukkan cara menghapus tab Informasi Tambahan dengan skrip PHP .

CATATAN : Untuk menghindari kehilangan penyesuaian saat Anda memperbarui tema, kami sarankan Anda menerapkan perubahan ini ke tema anak Anda.

  1. Buka FTP Anda dan buka folder wp-content . Lalu, buka tema dan buka folder child_theme Anda.
  2. Di sana, buka file functions.php .
  3. Pergi ke bawah dan masukkan kode berikut:
 add_filter( 'woocommerce_product_tabs' , 'quadlayers_remove_product_tabs' );
function quadlayers_remove_product_tabs ( $tabs ) {
unset( $tabs['tambahan_informasi'] );
kembali $tab;
}

Ingatlah untuk menyimpan perubahan dan kemudian menyegarkan halaman. Itu dia! Anda telah menghapus tab Informasi Tambahan!

Hapus tab deskripsi dan ulasan

Selain itu, Anda dapat menyingkirkan tab deskripsi dan tab ulasan dengan kode berikut:

 add_filter( 'woocommerce_product_tabs' , 'quadlayers_remove_product_tabs' );
function quadlayers_remove_product_tabs( $tabs ) {
unset( $tabs['deskripsi'] );
tidak disetel( $tabs['ulasan'] );
kembali $tab;
}

Bidang checkout WooCommerce mana yang harus Anda hapus?

Jadi bidang checkout mana yang harus Anda hapus? Itu tergantung pada apakah Anda menjual produk fisik atau digital dan seberapa banyak informasi dari pelanggan Anda yang ingin Anda dapatkan. Namun, perlu diingat bahwa formulir pembayaran yang lebih panjang biasanya memiliki konversi yang lebih rendah. Pelanggan cenderung menghindari checkout yang lama jadi berikut adalah beberapa tips untuk menjaga halaman checkout tetap pendek:

  • Jika Anda menjual produk digital, sembunyikan semua kolom yang terkait dengan pengiriman seperti alamat, kode pos, kota, dan sebagainya.
  • Hanya tampilkan bidang wajib. Anda dapat menyembunyikan atau menciutkan bidang opsional seperti nama perusahaan.
  • Nonaktifkan validasi kode pos untuk mengurangi gesekan pada halaman checkout.
  • Jika Anda menjual produk fisik, jadikan detail penagihan sebagai detail pengiriman secara default untuk menyembunyikan bidang yang tidak perlu.
  • Jika memungkinkan, gunakan IsiOtomatis untuk mengurangi waktu yang dihabiskan pengguna untuk mengisi formulir.
  • Gunakan hanya satu bidang untuk nama. Alih-alih menampilkan 3 bidang (nama depan, nama tengah, dan nama belakang), Anda bisa menggunakan bidang Nama Lengkap .

Pilihan lain untuk mengurangi langkah-langkah di halaman checkout dan meningkatkan konversi adalah dengan menggunakan tombol beli cepat untuk WooCommerce. Sebagian besar pengguna pemain eCommerce besar karena ini adalah cara yang sangat efektif untuk mempercepat proses pembelian dan membiarkan pembeli membeli dalam satu klik.

Kesimpulan

Kesimpulannya, halaman checkout Anda dapat memiliki dampak besar pada bisnis Anda dan memberi Anda keunggulan kompetitif. Oleh karena itu, kunci untuk mengoptimalkannya dan meningkatkannya sebanyak yang Anda bisa.

Dalam tutorial ini, kita telah melihat dua cara berbeda untuk menghapus dan menonaktifkan bidang checkout WooCommerce . Masing-masing dari mereka memiliki pro dan kontra sehingga Anda harus memilih salah satu yang paling sesuai dengan keterampilan dan kebutuhan Anda.

WooCommerce Checkout Manager dan Direct Checkout adalah plugin hebat yang memungkinkan Anda menonaktifkan bidang dengan cara yang cepat dan mudah. Namun, mereka membuat kode toko lebih kompleks. Fungsi PHP, di sisi lain, memerlukan beberapa pengkodean tetapi lebih bersih dan tidak akan menghabiskan sumber daya apa pun. Selain menghapus bidang checkout, Anda juga dapat meningkatkan proses pembelian di situs Anda dengan membuat corong penjualan.

Terakhir, jika Anda ingin meningkatkan halaman checkout Anda, kami sarankan Anda melihat tutorial kami untuk menyesuaikan checkout di WooCommerce dan panduan kami tentang cara mengedit bidang checkout .

Metode mana yang Anda pilih? Apakah Anda tahu cara lain untuk menghapus bidang checkout WooCommerce? Tinggalkan komentar di bawah dan bagikan pengalaman Anda dengan kami.