Posted on by

Tips-trik Kustomisasi Halaman Checkout WooCommerce

Kustomisasi Halaman Checkout WooCommerce

wpJakarta.Com – Tips-trik Kustomisasi Halaman Checkout WooCommerce. Salah satu upaya memberikan informasi kepada pelanggan bahwa berbelanja di toko online anda adalah aman. Yaitu dengan “mempersenjatai” website tersebut dengan tools atau software keamanan. Mulai dari protokol https, implementasi HSTS, akreditasi bisnis atau berpartner dengan layanan-layanan keamanan premium (firewall, anti virus/malware).

Biasanya, ketika misalnya sebuah website toko online sudah menggunakan layanan SSL premium maka layanan tersebut akan memberikan badge. Yang tujuannya untuk bisa di pasang di halaman website anda dan pengunjung akan melihatnya. Seperti contohnya pada gambar di samping.

Pada artikel kami sebelumnya Menambahkan Gambar Checkout Aman Pada Halaman Single WooCommerce. Kita bisa menambahkan badge gambar atau logo yang mengindikasikan bahwa website toko online tersebut mengaplikasikan belanja aman. Atau terlindungi oleh software keamanan premium. Badge atau gambar tersebut di pasang pada halaman single produk WooCommerce. Gambarnya akan terpampang pada bagian bawah tombol beli, atau tombol tambah ke keranjang.

Kustomisasi halaman checkout WooCommerce dengan memasang badge belanja aman

Pada artikel ini juga sama, yaitu memasang badge perlindungan software keamanan. Namun bukan pada halaman single produk, melainkan dengan cara memasang / meng kustomisasi halaman checkout WooCommerce.

Artikel WooCommerce lainnya

Tips-trik kustomisasi halaman checkout WooCommerce

Nyatanya gambar tersebut selain bisa di aplikasikan pada halaman produk single WooCommerce. Juga bisa di pasang di halaman checkout. Tergantung dimana badge atau gambarnya mau di pasang, apakah di bagian atas, bagian bawah halaman. Atau di bagian bawah kolom shipping (sebelah kiri). Atau di bagian kanan (kolom payment).

Artikel ini akan menjelaskan tips-trik kustomisasi halaman checkout WooCommerce, dengan menempatkan gambar safe checkout di bagian bawah kolom pembayaran. Contohnya bisa di lihat pada badge gambar di paragraph pertama artikel ini.

Artikel WordPress lainnya

Tips-trik kustomisasi halaman checkout WooCommerce dengan menambahkan kode php

Tidak perlu memasang plugin untuk membuat hal tersebut. Cukup ketikan beberapa baris fungsi php ke dalam file function.php.  Namun mengedit langsung file function.php bukanlah cara yang baik, karena kode yang biasa di tambahkan pasti akan terhapus jika terdapat update tema website. Untuk menyiasatinya bisa dengan membuat site specific plugin khusus untuk menambahkan setiap kode tambahan ke dalam file WordPress. Untuk lebih jelas mengenai apa itu “site specific plugin” ? Kunjungi artikel Tips-Trik Membuat Site Specific Plugin WordPress, yang pernah di tulis di website ini.

// Gambar safe checkout dihalaman checkout
add_action( 'woocommerce_review_order_after_payment', 'img_safe_checkout', 10 );
function img_safe_checkout() {
    echo "<div><img src="https://wpjakarta.com/wp-content/uploads/2020/08/Menambahkan-Gambar-Checkout-WooCommerce.jpg"></div>";
}

Variasi kustomisasi halaman checkout wooCommerce

Kode tersebut mengambil hook woocommerce_review_order_after_payment. Sehingga gambar atau element “safe checkout” akan berada tepat di bawah tombol “buat pesanan”. Penggunaan hook lainnya di halaman checkout WooCommerce bisa saja dilakukan. Menggunakan hook yang berbeda akan membuat penempatan gambar atau element yang berbeda pula. Lihat https://codex.wordpress.org/Plugin_API/Hooks tentang list hook action / filter WooCommerce.

Artikel lainnya