Menampilkan Jumlah Total Belanja Di Keranjang WooCommerce

TokoDaring.Com – Menampilkan Jumlah Total Belanja Di Keranjang WooCommerce. Jika Anda ingin meningkatkan pengalaman berbelanja pelanggan di toko WooCommerce Anda, ada beberapa cara untuk melakukannya.

Artikel terkait :

Menampilkan Satuan Berat Produk WooCommerce Di Halaman Arsip Produk

Dalam posting ini, kami akan memberikan informasi dalam untuk memberikan layanan yang lebih baik kepada pelanggan. Yaitu dengan menampilkan jumlah total belanja di keranjang. Dari situ, Anda akan memiliki pemahaman yang lebih baik tentang jumlah total keranjang dan menampilkannya di toko daring WooCommerce Anda.

Kenapa harus menampilkan jumlah total belanja di keranjang WooCommerce?

Memberi tahu pengunjung jumlah total produk yang sudah dipilih saat menjelajahi toko

Sebagian besar pelanggan cenderung memasukkan lebih dari satu barang di keranjang belanja. Karenanya, dengan jumlah total yang ditampilkan di toko online anda, pelanggan akan melihat jumlah uang yang mereka perlu keluarkan untuk membayar semua barang saat berbelanja.

Tidak perlu berpindah halaman

Cara tradisional bagi pengunjung untuk mengetahui jumlah total belanja mereka adalah dengan menuju ke halaman ke keranjang belanja untuk melihat jumlah total produk yang dipilih. Namun ketika ditempatkan di halaman toko, mereka tidak perlu lagi berpindah keranjang belanja, yang terkadang membuang waktu dan membuat mereka bingung.

Tingkatkan pengalaman berbelanja

Dengan menampilkan jumlah total di setiap halaman toko WooCommerce Anda, pelanggan akan selalu mengetahui harga total untuk semua produk yang mereka inginkan. Sehingga mereka dapat dengan mudah memodifikasi jumlah dan jenis produk yang sesuai dengan dompet mereka, yang akan meningkatkan tingkat kepuasan dan kemungkinan penjualan toko Anda.

Di mana anda ingin menampilkan jumlah total belanja di keranjang WooCommerce?

Ada banyak tempat di halaman tempat Anda dapat menempatkan jumlah total keranjang. Itu bisa berupa header, footer, bagian tengah halaman Anda, atau lokasi mana pun yang Anda suka. Namun, lokasi yang kami rekomendasikan untuk Anda adalah header. Dengan menempatkan jumlah total keranjang di header, pelanggan akan langsung melihat harganya.

Jika pilihan Anda ada di tengah halaman atau footer, pengunjung harus menggulir ke tempat tertentu untuk melihatnya, ini bukan ide yang bagus, terutama jika item yang mereka inginkan berada tepat di bagian atas hasil pencarian.

Bagaimana Cara menampilkan jumlah total belanja di keranjang WooCommerce?

Secara default, WooCommerce tidak menawarkan fitur bawaan untuk membuat jumlah total keranjang terlihat. Oleh karena itu, pengguna and perlu menggunakan metode kustomisasi lainnya untuk melakukannya. Untungnya, itu bisa dilakukan dengan mudah, Anda dapat melakukannya dengan menggunakan beberapa potong kode sesuai panduan berikut.

Kami tahu bahwa banyak orang akan berhenti membaca dan menyerah karena takut akan coding. Namun demikian, jangan khawatir, panduan ini sangat mudah diikuti, Anda hanya perlu menyalin dan menempelkannya ke toko dalam editor WooCommerce Anda.

Berikut caranya, panduan ini menunjukkan kepada Anda cara menampilkan jumlah total keranjang di header toko WooCommerce Anda.

1. Buka file editor

Untuk mengubah kode di toko WooCommerce Anda, tentunya langkah pertama adalah membuka Editor. Masuk ke akun WordPress Anda dan buka dasbor. Di sana, gulir ke bawah untuk membuka Penampilan dan pilih Editor.

2. Edit file header.php

Faktanya, jumlah item dan harga totalnya akan diperbarui secara otomatis melalui AJAX di WooCommerce. Akibatnya, Anda perlu memastikan bahwa WooCommerce diaktifkan di akun WordPress Anda. Untuk melakukannya, tempatkan cuplikan kode ini di mana saja di file tema WooCommerce Anda.

<?php global $woocommerce; ?>
 <a class="your-class-name" href="<?php echo $woocommerce->cart->get_cart_url(); ?>"
title="<?php _e('Cart View', 'woothemes'); ?>">
<?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'),
 $woocommerce->cart->cart_contents_count);?>  -
<?php echo $woocommerce->cart->get_cart_total(); ?>
</a>

Kemudian, klik file bernama header.php untuk menempelkan kode-kode ini di bawah menu navigasi.

<html <?php language_attributes(); ?> class="no-js no-svg">
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="profile" href="http://gmpg.org/xfn/11">
    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="page" class="site">
    <a class="skip-link screen-reader-text" href="#content"><?php _e('Skip to content', 'twentyseventeen'); ?></a>
    <header id="masthead" class="site-header" role="banner">
        <?php get_template_part('template-parts/header/header', 'image'); ?>
        <?php if (has_nav_menu('top')) : ?>
        <div class="navigation-top">
            <div class="wrap">
                <?php get_template_part('template-parts/navigation/navigation', 'top'); ?>
                <!--Custom cart start-->
                <?php global $woocommerce; ?>
                <a class="your-class-name" href="<?php echo $woocommerce->cart->get_cart_url(); ?>"
                   title="<?php _e('Cart View', 'woothemes'); ?>">
                    <?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'),
                    $woocommerce->cart->cart_contents_count);?>  -
                    <?php echo $woocommerce->cart->get_cart_total(); ?>
                </a>
                <!--Custom cart end-->
            </div>
            <!-- .wrap -->
        </div><!-- .navigation-top -->
        <?php endif; ?>
    </header>
    <!-- #masthead -->
    <?php
    // If a regular post or page, and not the front page, show the featured image.
    if (has_post_thumbnail() && (is_single() || (is_page() && !twentyseventeen_is_frontpage()))) :
        echo '<div class="single-featured-image-header">';
        the_post_thumbnail('twentyseventeen-featured-image');
        echo '</div><!-- .single-featured-image-header -->';
    endif;
    ?>
    <div class="site-content-contain">
        <div id="content" class="site-content">

3. Edit file functions.php

Buka tab baru dan akses toko WooCommerce Anda dan Anda akan melihat jumlah total keranjang ditampilkan di header halaman Anda.

Namun, hal itu tidak dilakukan karena keranjang tidak akan diperbarui saat Anda menambahkan produk yang sama ke keranjang belanja Anda. Untuk mengatasi masalah ini, buka functions.php di file tema. Setelah itu, salin dan tempel cuplikan kode berikut:

add_filter('add_to_cart_custom_fragments', 'woocommerce_header_add_to_cart_custom_fragment');
function woocommerce_header_add_to_cart_custom_fragment( $cart_fragments ) {
                global $woocommerce;
                ob_start();
                ?>
                <a class="cart-contents" href="<?php echo $woocommerce->cart->get_cart_url(); ?>" title="<?php _e('View   cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?></a>
                <?php
                $cart_fragments['a.cart-contents'] = ob_get_clean();
                return $cart_fragments;
}

Kesimpulan, Menampilkan Jumlah Total Belanja Di Keranjang WooCommerce

Kesimpulannya, tidak sulit untuk menampilkan jumlah total belanja di keranjang toko online WooCommerce Anda. Ikuti lagi tiga langkah diatas.

Artikel terkait :