in

Membuat Variasi Satuan Unit Harga Produk WooCommerce

TokoDaring.Com – Membuat Variasi Satuan Unit Harga Produk WooCommerce. Kami pikir ini adalah artikel tutorial yang penting untuk kami sharing. Terlebih ketika membuat website eCommerce menggunakan WordPress dan WooCommerce.

Kami anggap penting karena kustomisasi ini sangat relevan dengan konteks fitur atau informasi sebuah website toko online.

Sebelum masuk ke tutorial bagaimana membuat variasi satuan unit harga produk WooCommerce, kami jelaskan dan gambarkan dulu dengan apa yang kami maksud dengan satuan unit harga produk WooCommerce.

Satuan unit harga produk

Bayangkan anda menjual produk sembako dengan beberapa variasi unit penjualan. Ada beras atau gula yang di jual per kilogram, minyak yang di jual per liter dan bumbu masak yang di jual per pack.

Atau anda menjual produk yang sama tapi memiliki banyak variasi satuan penjualan. Kami umpamakan anda memiliki satu produk dengan empat situasi penjualan.

  1. Ada tomat hijau yang di jual curah per kilogram.
  2. Tomat cherry yang di jual per tangkai.
  3. Tomat TW yang di jual per buah (per biji).
  4. Dan Tomat beef yang di jual per pack isi 3 buah.

Anda ingin memberikan informasi kepada pengunjung website toko daring anda tentang satuan-satuan penjualan produk tersebut langsung di halaman produk masing-masing. Sehingga kustomer akan tahu betul berapa yang akan merke bayar dan berapa banyak yang akan mereka dapatkan.

unit harga produk woocommerce
satuan unit harga produk

Unit harga produk WooCommerce

Nah, secara pengaturan (setting) default WooCommerce hal tersebut tidak memungkinkan, hingga anda harus mengkustomnya sendiri.

Ada dua cara untuk menggapai hal tersebut, yakni dengan menggunakan plugin atau mengkustomnya sendiri dengan membuat fungsi tambahan ke dalam kode WordPress.

Setting yang ada hanyalah setting satuan umum untuk berat dan dimensi yang di biasanya deklarasikan dengan kg dan cm.

Membuat variasi satuan unit harga produk WooCommerce

Membuat variasi satuan unit harga produk yang anda jual akan membantu meyakinkan kustomer terhadap produk yang ingin di belinya. Tentu hal ini bisa menambah kepercayaan dan pengalaman positif pengunjung toko online anda.

Maka tidak ada salahnya jika anda ingin mencoba membuat variasi satuan unit harga produk masing-masing. Pada artikel ini kami paparkan bagaimana caranya untuk merealisasikan hal tersebut.

Membuat variasi satuan unit harga produk WooCommerce menggunakan plugin

Kami carikan dan pilihkan dari halaman plugin repository WordPress.Org. Dan tiga di antaranya adalah sebagai berikut.

Anda cukup menginstalnya lalu melakukan setting sesuai panduan plugin tersebut masing-masing.

Membuat variasi satuan unit harga produk WooCommerce tanpa plugin

Seperti halnya WordPress yang bisa dengan mudah di kustom dengan memanfaatkan hooks. WooCommerce juga memiliki banyak hooks yang memungkinkan kita untuk mengkustomnya.

Tentu saja dengan menambahkan beberapa baris kode ke dalam file function.php child theme atau menggunakan plugin editor.

Coba tambahkan kode berikut, lalu lihat halaman katalog atau halaman produk single. Jika terdapat tambahan kata ‘per kg di samping harga produk. Jika ya, itu berarti kode kustom tersebut bekerja dengan baik.

/*
 * membuat variasi satuan unit harga
 * produk WooCommerce (per kg)
 *
 */

// halaman produk single
function tdrg_unit_harga_produk_single($price) {
 	$price_html = '<span class="amount">' . $price . ' per kg </span>'; // menambahkan 'per kg' sebagai unit harga
 	return $price_html;
}
add_filter('woocommerce_get_price_html', 'tdrg_unit_harga_produk_single');


// halaman cart
function tdrg_unit_harga_produk_cart($price) {
 	$price = $price . ' per kg';
 	return $price;
}
add_filter('woocommerce_cart_item_price', 'tdrg_unit_harga_produk_cart');


// halaman chekout
function tdrg_unit_harga_produk_checkout($quantity, $cart_item, $cart_item_key) {
 	$cart_item = ' <span class="product-quantity">' . sprintf('&times; %s', $cart_item['quantity']) . ' kg </span>';
 	return $cart_item;
}
add_filter('woocommerce_checkout_cart_item_quantity', 'tdrg_unit_harga_produk_checkout', 10, 3);

Kode di atas akan menambahkan “per kg” tepat di samping harga produk di masing-masing halaman katalog, single produk, cart dan chekout.

Perlu di catat juga bahwa kode diatas hanya akan menambahkan ‘per kg’ di semua produk, tanpa terkecuali.

Lalu bagaimana jika anda ingin mengaplikasikan unit harga yang berbeda pada masing-masing atau beberapa produk yang berbeda juga. Seperti misalnya yang kami terangkan di atas.

Kustom unit harga woocommerce

Ada dua cara yang perlu di lakukan untuk membuat unit harga yang berbeda di masing-masing produk yang berbeda. Lagi-lagi dengan menggunakan plugin atau mengkustomnya sendiri dengan menambahkan script fungsi php dengan mengkatrol hooks.

Kustom unit harga produk WooCommerce menggunakan plugin

Ya, tentu ada plugin yang bisa di pasang untuk membuat satuan unit harga kustom per produk. Namun kami tidak membahas bagaimana cara melakukannya menggunakan plugin.

Kami skip dan langsung memberikan saja dengan membuat script fungsi baru yang harus di tambahkan dengan mengkatrol hook WooCommerce.

Kustom unit harga produk WooCommerce tanpa plugin

Cara di atas memang hanya membuat satu unit harga saja (per kg), dari baris script berikut $price_html = '<span class="amount">' . $price . ' per kg </span>'; terlihat ada string per kg yang di tambahkan (tanpa variabel).

Sedangkan untuk membuat unit harga yang berbeda di setiap produk, anda perlu memiliki variabel dengan membuat custom field.

Nantinya custom field tersebut akan di munculkan di setiap produk dan di isi dengan data meta sebagai unit harga yang di inginkan untuk masing-masing produk tersebut.

Dan berikut urutan langkah dari membuat custom field, mengisinya dengan data meta hingga menambahkan script fungsinya.

Membuat Variasi Satuan Unit Harga Produk WooCommerce
field kustom unit harga woocommerce
  1. Pilih satu produk untuk anda edit.
  2. Pastikan untuk memunculkan blok atau seksi custom field di bawah editor produk atau pada sidebar halaman edit produk seperti gambar di samping.
  3. Jika tidak ada blok custom field yang di maksud, simak artikel berikut untuk membuat custom field WordPress.
  4. Buat field baru dan beri nama ‘unit_harga. (Gunakan huruf kecil dan underscores _ sebagai pemisah).
  5. Berikan nilai atau value untuk custom field tersebut sesuai yang di inginkan, misalnya sebagai berikut :
    • Untuk produk QTY per pcs berikan value “per pcs” atau “/pcs”.
    • Untuk produk QTY berat berikan value “per kg” atau “/kg”.
    • Untuk produk QTY per ekor berikan value “per ekor” atau “/ekor”.
  6. Setting semua produk anda satu persatu.
  7. Jika produk anda sudah terlampau banyak anda bisa mengupdate database menggunakan query SQL dengan mengupdate tabel wp_postmeta.
  8. Berikutnya tambahkan kode script berikut pada file function.php child theme atau plugin editor.
// Halaman produk single
add_filter('woocommerce_get_price_html', 'tdrg_unit_harga_single',  10, 2);
function tdrg_unit_harga_single($price, $product) {
	$tdrg_tipe_harga = get_post_meta( $product->get_id(), 'unit_harga', true);
	if($ydrg_tipe_harga) {
		$price_html = '<span class="amount">' . $price . ' ' . $tdrg_tipe_harga  . '</span>';	
	}
	else {
		$price_html = '<span class="amount">' . $price .  '</span>';	
	}
	return $price_html;
}

// Halaman cart
add_filter('woocommerce_cart_item_price', 'tdrg_unit_harga_cart', 10, 3);
function tdrg_unit_harga_cart($price, $cart_item, $cart_item_key) {
$tdrg_tipe_harga = get_post_meta($cart_item['product_id'], 'unit_harga', true);
	if ($tdrg_tipe_harga) {
		$price = $price . ' ' . $tdrg_tipe_harga;	
	}
	else {
		$price = $price;	
	}
	return $price;
}

// Halaman checkout
add_filter('woocommerce_checkout_cart_item_quantity', 'tdrg_unit_harga_checkout', 10, 3);
function tdrg_unit_harga_checkout($quantity,$cart_item, $cart_item_key) {
$tdrg_tipe_harga = get_post_meta($cart_item['product_id'], 'unit_harga', true);
	if ($tdrg_tipe_harga) {
		$cart_item = ' ' . sprintf('× %s ', $cart_item['quantity']) . $tdrg_tipe_harga . '';
	}
	else {
		$cart_item = ' ' . sprintf('× %s', $cart_item['quantity']) . '';		
	}
	return $cart_item;
}

Nah, mudah bukan ? Memberikan informasi-informasi yang esensial terkait produk yang anda jual tentu dapat membantu kustomer anda untuk menentukan pilihan produk yang di jual.


Tentang TokoDaring [impresum]

TokoDaring.Com adalah ‘media online’ dengan artikel-artikel yang praktis di bidang ecommerce. Kami menulis dengan bahasa yang menyenangkan dan mudah di pahami. Mulai dari teknologi, platform dan update, hingga secara teknis bagaimana mendesain dan memaksimalkan website ecommerce untuk dapat membantu orang-orang yang baru memulai atau sudah ada pada bisnis online.

Unit usaha TokoDaring.Com adalah sebagai penyuplai bahan makanan untuk usaha kuliner (daging, sayur, buah, bumbu & rempah) yang melayani pembelian kebutuhan suplai b2b kerjasama antar usaha (restoran/kafe/hotel/katering/kuliner/rumah sakit). Produk pesanan akan di antarkan langsung ke dapur produksi usaha tanpa ada biaya pengiriman (gratis ongkir).

Divisi kreatif TokoDaring.Com melayani order pembuatan website, cetak digital, food & video photography. Hingga platform untuk promosi bisnis via halaman business listing.

Written by TokoDaring

TokoDaring.Com | Where Cooking & Coding are Met!!! We Make F & B Commerce More Fun!!!

cara memasang captcha di website

Cara Memasang Captcha Di Website eCommerce WordPress

custom halaman login wordpress

Custom Halaman Login WordPress eCommerce Agar Terlihat Menarik