TokoDaring.Com – Memahami Hook woocommerce_review_order_after_order_total di WooCommerce untuk Menambahkan Informasi Tambahan pada Halaman Checkout.

Memahami Hook woocommerce_review_order_after_order_total di WooCommerce untuk Menambahkan Informasi Tambahan pada Halaman Checkout

WooCommerce menyediakan berbagai hook yang memudahkan pengembang melakukan kustomisasi tanpa harus mengubah file inti plugin. Salah satu hook yang sering dimanfaatkan ketika mengembangkan toko online adalah woocommerce_review_order_after_order_total. Hook ini memungkinkan Anda menambahkan elemen baru tepat setelah baris total pesanan pada tabel ringkasan checkout. Posisi tersebut sangat strategis karena pelanggan biasanya memperhatikan total pembayaran sebelum menyelesaikan transaksi.

Bagi pemula, hook ini menjadi pintu masuk untuk memahami bagaimana WooCommerce menyisipkan konten secara dinamis menggunakan mekanisme action hook. Bagi developer tingkat menengah dan mahir, hook ini dapat digunakan untuk menampilkan informasi tambahan seperti estimasi pengiriman, catatan pembayaran, informasi promo, kebijakan toko, hingga validasi khusus berdasarkan kondisi tertentu. Artikel ini membahas cara kerja woocommerce_review_order_after_order_total, kapan sebaiknya digunakan, contoh implementasi, serta praktik terbaik agar kode tetap mudah dipelihara dan kompatibel dengan pembaruan WooCommerce.

Mengenal Hook woocommerce_review_order_after_order_total

Hook woocommerce_review_order_after_order_total merupakan action hook yang dieksekusi setelah WooCommerce selesai menampilkan baris total pesanan pada tabel review order di halaman checkout. Karena berada di bagian akhir tabel, hook ini sangat cocok untuk menyisipkan informasi yang berkaitan langsung dengan proses pembayaran tanpa mengganggu tampilan utama checkout.

Hook ini hanya menampilkan konten dan tidak mengembalikan nilai tertentu. Oleh karena itu, fungsi yang dihubungkan ke hook cukup menggunakan echo atau menampilkan markup HTML sesuai kebutuhan. Hal ini membuat implementasinya relatif sederhana bahkan bagi developer yang baru mulai mempelajari WordPress Hook API.

Contoh penggunaan paling umum meliputi pemberitahuan mengenai estimasi pengiriman, syarat dan ketentuan transaksi, informasi bonus pembelian, pemberitahuan minimum pembelian, atau informasi tambahan yang hanya ingin ditampilkan ketika pelanggan berada pada tahap akhir sebelum melakukan pembayaran.

Contoh Dasar

add_action( 'woocommerce_review_order_after_order_total', 'custom_checkout_notice' );

function custom_checkout_notice() {
    echo '<tr class="custom-checkout-message">';
    echo '<td colspan="2">';
    echo 'Terima kasih telah berbelanja. Pesanan akan segera diproses setelah pembayaran berhasil diverifikasi.';
    echo '</td>';
    echo '</tr>';
}

Kode di atas akan menambahkan satu baris baru setelah total pesanan pada tabel checkout.

Cara Kerja Hook dalam Siklus Checkout

Halaman checkout WooCommerce dibangun menggunakan template yang berisi berbagai action hook. Ketika halaman dimuat, WooCommerce menjalankan hook tersebut secara berurutan sehingga developer dapat menyisipkan fungsi tambahan tanpa perlu mengedit template bawaan.

Hook woocommerce_review_order_after_order_total dijalankan setelah seluruh subtotal, pajak, ongkos kirim, diskon, dan total akhir selesai ditampilkan. Dengan demikian, informasi yang ditambahkan akan muncul di bagian paling bawah tabel ringkasan pesanan sehingga mudah terlihat oleh pelanggan sebelum mereka mengklik tombol pemesanan.

Karena hook ini berada di area checkout, setiap perubahan pada keranjang belanja melalui AJAX juga dapat memicu pembaruan tampilan. Oleh sebab itu, kode yang ditambahkan sebaiknya ringan, tidak melakukan query database yang berlebihan, serta menghindari proses komputasi yang tidak diperlukan agar pengalaman pengguna tetap optimal.

Menampilkan Informasi Estimasi Pengiriman

add_action( 'woocommerce_review_order_after_order_total', 'shipping_estimation_message' );

function shipping_estimation_message() {
    echo '<tr>';
    echo '<td colspan="2">';
    echo 'Estimasi pengiriman adalah satu hingga tiga hari kerja setelah pembayaran dikonfirmasi.';
    echo '</td>';
    echo '</tr>';
}

Menampilkan Pesan Berdasarkan Total Belanja

add_action( 'woocommerce_review_order_after_order_total', 'minimum_order_information' );

function minimum_order_information() {

    if ( WC()->cart->total > 1000000 ) {

        echo '<tr>';
        echo '<td colspan="2">';
        echo 'Pesanan Anda memenuhi syarat untuk mendapatkan layanan prioritas.';
        echo '</td>';
        echo '</tr>';

    }

}

Implementasi Hook untuk Berbagai Kebutuhan Bisnis

Salah satu keunggulan woocommerce_review_order_after_order_total adalah fleksibilitasnya dalam mendukung berbagai kebutuhan bisnis. Tidak hanya digunakan untuk menampilkan teks statis, hook ini juga dapat mengambil data dari WooCommerce, WordPress, maupun plugin lain sehingga informasi yang ditampilkan selalu relevan dengan kondisi transaksi pelanggan. Pendekatan ini membantu meningkatkan transparansi selama proses checkout dan dapat mengurangi pertanyaan pelanggan setelah pesanan dibuat.

Pada toko dengan volume transaksi tinggi, hook ini sering dimanfaatkan untuk memberikan informasi yang bersifat dinamis. Sebagai contoh, toko dapat menampilkan estimasi waktu pemrosesan berdasarkan metode pengiriman yang dipilih, memberikan informasi mengenai bonus pembelian ketika total belanja telah memenuhi syarat tertentu, atau mengingatkan pelanggan mengenai dokumen yang harus dipersiapkan sebelum pesanan dikirim. Semua informasi tersebut dapat ditampilkan tepat sebelum pelanggan menyelesaikan pembayaran sehingga peluang informasi tersebut dibaca menjadi lebih besar.

Developer juga dapat mengombinasikan hook ini dengan berbagai fungsi bawaan WooCommerce seperti WC()->cart, WC()->session, WC()->customer, maupun metadata pengguna. Dengan demikian, setiap pelanggan dapat melihat informasi yang berbeda sesuai dengan isi keranjang belanja, lokasi pengiriman, metode pembayaran, atau status keanggotaan mereka. Pendekatan seperti ini membuat pengalaman checkout terasa lebih personal tanpa harus memodifikasi template inti WooCommerce.

Contoh Menampilkan Informasi Berdasarkan Metode Pengiriman

add_action( 'woocommerce_review_order_after_order_total', 'shipping_method_notice' );

function shipping_method_notice() {

    $chosen_methods = WC()->session->get( 'chosen_shipping_methods' );

    if ( ! empty( $chosen_methods ) && $chosen_methods[0] === 'flat_rate:1' ) {

        echo '<tr>';
        echo '<td colspan="2">';
        echo 'Pengiriman reguler membutuhkan waktu sekitar dua hingga empat hari kerja.';
        echo '</td>';
        echo '</tr>';

    }

}

Contoh Menampilkan Informasi Berdasarkan Login Pelanggan

add_action( 'woocommerce_review_order_after_order_total', 'member_information' );

function member_information() {

    if ( is_user_logged_in() ) {

        $user = wp_get_current_user();

        echo '<tr>';
        echo '<td colspan="2">';
        echo 'Selamat datang kembali, ' . esc_html( $user->display_name ) . '.';
        echo '</td>';
        echo '</tr>';

    }

}

Praktik Terbaik Menggunakan woocommerce_review_order_after_order_total

Meskipun hook ini terlihat sederhana, penerapan yang kurang tepat dapat menyebabkan tampilan checkout menjadi berantakan atau bahkan memengaruhi performa halaman. Oleh karena itu, setiap implementasi sebaiknya mengikuti standar pengembangan WordPress dan WooCommerce agar tetap kompatibel dengan pembaruan di masa mendatang.

Gunakan fungsi sanitasi dan escaping seperti esc_html(), esc_attr(), maupun wp_kses_post() ketika menampilkan data yang berasal dari pengguna atau database. Langkah ini penting untuk mencegah potensi kerentanan keamanan seperti Cross Site Scripting atau XSS. Selain itu, hindari mencetak HTML secara berlebihan apabila informasi yang ingin ditampilkan sebenarnya dapat diringkas menjadi satu atau dua baris.

Praktik lain yang tidak kalah penting adalah menempatkan seluruh fungsi kustom di dalam plugin khusus atau child theme. Hindari menambahkan kode langsung ke file inti WooCommerce karena setiap pembaruan plugin akan menghapus perubahan tersebut. Dengan menyimpan seluruh kustomisasi di lokasi yang tepat, proses pemeliharaan menjadi lebih mudah dan risiko konflik saat pembaruan dapat diminimalkan.

Contoh Menggunakan Escape Output

add_action( 'woocommerce_review_order_after_order_total', 'secure_checkout_message' );

function secure_checkout_message() {

    $message = get_option( 'custom_checkout_message' );

    if ( ! empty( $message ) ) {

        echo '<tr>';
        echo '<td colspan="2">';
        echo esc_html( $message );
        echo '</td>';
        echo '</tr>';

    }

}

Contoh Menampilkan Informasi dari Pengaturan WooCommerce

add_action( 'woocommerce_review_order_after_order_total', 'store_contact_information' );

function store_contact_information() {

    $email = get_option( 'admin_email' );

    echo '<tr>';
    echo '<td colspan="2">';
    echo 'Apabila mengalami kendala saat pembayaran, silakan hubungi ' . esc_html( $email );
    echo '</td>';
    echo '</tr>';

}

Bagian berikutnya akan membahas penggunaan hook pada skenario lanjutan, ringkasan artikel, serta lima pertanyaan yang paling sering diajukan mengenai woocommerce_review_order_after_order_total.

Skenario Penggunaan Lanjutan dan Tips Optimasi

Hook woocommerce_review_order_after_order_total tidak hanya berguna untuk menampilkan informasi sederhana, tetapi juga dapat menjadi bagian dari strategi peningkatan pengalaman pengguna di halaman checkout. Banyak pengembang memanfaatkannya untuk memberikan informasi yang bersifat kontekstual berdasarkan kondisi transaksi yang sedang berlangsung. Karena posisinya berada tepat sebelum pelanggan menyelesaikan pembayaran, informasi yang ditampilkan memiliki peluang besar untuk diperhatikan sehingga dapat membantu mengurangi kebingungan maupun pertanyaan setelah pesanan dibuat.

Dalam implementasi yang lebih kompleks, hook ini dapat dikombinasikan dengan data dari plugin pihak ketiga, API eksternal, maupun metadata produk. Misalnya, toko dapat menampilkan estimasi waktu produksi untuk produk pre-order, menginformasikan jadwal pengiriman berikutnya berdasarkan wilayah pelanggan, atau memberikan pemberitahuan apabila terdapat produk yang memerlukan penanganan khusus. Pendekatan seperti ini membantu meningkatkan transparansi proses pembelian sekaligus memberikan pengalaman checkout yang lebih profesional.

Meskipun fleksibel, setiap implementasi sebaiknya tetap memperhatikan performa halaman checkout. Hindari melakukan pemanggilan API eksternal secara langsung ketika hook dijalankan karena dapat memperlambat waktu muat halaman. Jika membutuhkan data dari layanan lain, gunakan mekanisme cache atau simpan data sementara di database sehingga informasi tetap dapat ditampilkan dengan cepat tanpa mengurangi kenyamanan pelanggan saat melakukan pembayaran.

Contoh Menampilkan Informasi Produk Pre Order

add_action( 'woocommerce_review_order_after_order_total', 'preorder_notice' );

function preorder_notice() {

    foreach ( WC()->cart->get_cart() as $cart_item ) {

        $product = $cart_item['data'];

        if ( get_post_meta( $product->get_id(), '_preorder', true ) ) {

            echo '<tr>';
            echo '<td colspan="2">';
            echo 'Salah satu produk merupakan pre order sehingga waktu pengiriman akan mengikuti jadwal produksi.';
            echo '</td>';
            echo '</tr>';

            break;
        }

    }

}

Contoh Menampilkan Informasi Berdasarkan Kategori Produk

add_action( 'woocommerce_review_order_after_order_total', 'cold_product_notice' );

function cold_product_notice() {

    foreach ( WC()->cart->get_cart() as $cart_item ) {

        if ( has_term( 'produk-beku', 'product_cat', $cart_item['product_id'] ) ) {

            echo '<tr>';
            echo '<td colspan="2">';
            echo 'Produk beku akan dikirim menggunakan kemasan khusus untuk menjaga kualitas selama pengiriman.';
            echo '</td>';
            echo '</tr>';

            break;
        }

    }

}

Ringkasan

Hook woocommerce_review_order_after_order_total merupakan salah satu action hook yang sangat berguna untuk melakukan kustomisasi halaman checkout WooCommerce tanpa mengubah file inti plugin. Posisinya yang berada setelah total pesanan menjadikannya tempat yang ideal untuk menampilkan informasi tambahan yang berkaitan dengan proses transaksi, seperti estimasi pengiriman, pemberitahuan promosi, informasi pembayaran, maupun kebijakan toko. Dengan memahami cara kerja hook ini serta mengikuti praktik terbaik dalam penulisan kode, developer dapat menciptakan pengalaman checkout yang lebih informatif, profesional, aman, dan mudah dipelihara pada berbagai jenis toko WooCommerce.

Pertanyaan Umum Tentang hook woocommerce_review_order_after_order_total