Putri Aprilia an SEO Content Writer at Niagahoster. Enjoy her articles about online business, web, and other technology-related issued.

WooCommerce Shortcodes: Buat Toko Online Jadi Lebih Menarik

4 min read

WooCommerce Shortcodes

Anda ingin mengoptimalkan fitur dan tampilan website toko online? Soalnya, apa yang disediakan Woocommerce masih kurang pas dengan kebutuhan Anda?

Jangan khawatir, Anda bisa menggunakan WooCommerce shortcodes dan berkreasi tanpa batas untuk membuat toko online yang menarik.

Nah, WooCommerce shortcode itu apa sih? Apa saja kegunaan dan bagaimana cara menambahkan WooCommerce shortcodes? 

Di artikel ini, Anda akan mengetahui semuanya secara lengkap. Yuk, simak penjelasannya di bawah ini.   

Apa itu Woocommerce Shortcodes dan Manfaatnya

WooCommerce shortcode adalah kode singkat yang dapat membantu Anda membuat fitur berdasarkan kebutuhan toko online Anda. 

Katakanlah Anda ingin menampilkan daftar produk yang paling laris di sidebar website Anda. Atau, Anda ingin menampilkan satu atau beberapa produk saja. 

Nah, dengan WooCommerce shortcodes Anda bisa menambahkan fitur tersebut dengan kode yang singkat dan melakukan kustomisasi sesuai perubahan yang diinginkan. 

Baca juga: 10+ Plugin WooCommerce Terbaik untuk Toko Online Anda

Lalu, apa sih manfaat menggunakan WooCommerce shortcodes?

  • User Experience Jadi Lebih Baik 

Pengalaman berbelanja yang lebih mudah kadang belum dipenuhi oleh WooCommerce secara default. Misalnya, tombol Add to Cart agar pembeli lebih mudah memasukkan produk ke keranjang belanja. Nah, agar tidak mengorbankan kenyamanan pengunjung, Anda bisa menambahkan fitur tersebut sendiri. 

  • Lebih Mudah

WooCommerce Shortcodes itu mudah digunakan. Tanpa menulis kode panjang, Anda bisa menampilkan fitur WooCommerce yang diinginkan dengan mudah dan cepat

Cara Menambahkan WooCommerce Shortcodes

Bagaimana cara menambahkan WooCommerce shortcodes ke halaman website Anda? Cukup mudah, langkah di bawah ini bisa Anda lakukan untuk menambahkan WooCommerce page shortcodes.

Pertama, klik Pages > Add New pada dashboard WordPress. Kemudian klik ikon , lalu cari Shortcode

Cara Menambahkan WooCommerce Shortcodes

Selanjutnya, Anda tinggal memasukkan WooCommerce shortcodes yang Anda inginkan. 

Cara Menambahkan Woocommerce Shortcodes

Baca juga: Panduan Shortcode WordPress 

Daftar WooCommerce Shortcodes  

Nah, berikut ini kami berikan list WooCommerce Shortcodes yang bisa Anda terapkan di website toko online Anda. Mari kita simak penjelasannya!

1. Cart 

[woocommerce_cart]. Kode ini bisa Anda gunakan untuk menampilkan halaman keranjang toko online Anda. 

Pada dasarnya, halaman ini bersifat dinamis. Artinya, setiap pelanggan menambahkan produk ke keranjang, halaman ini akan menampilkan produk sesuai yang ditambahkan. 

WooCommerce Shortcodes Cart

2. Checkout 

[woocommerce_checkout]. Gunakan kode ini untuk menampilkan halaman checkout produk pelanggan. 

Proses checkout merupakan salah satu aspek penting dari website toko online. Jadi, Anda harus memastikan halaman ini dapat berfungsi dengan lancar ketika pelanggan akan melakukan pembelian. 

WooCommerce Shortcodes Checkout

3. My Account

[woocommerce_my_account]. Kode ini berfungsi untuk membuat halaman “Akun Saya”. Ini terutama dibutuhkan kalau Anda ingin memahami pelanggan dengan lebih lengkap, mulai kebutuhan produk, alamat dan lainnya.

Di halaman ini, pelanggan dapat melihat detail pesanan mereka. Mereka juga dapat mengubah alamat pengiriman dan proses pembayaran. 

WooCommerce Shortcodes My Account

4. Order Track 

[woocommerce_order_tracking]. WooCommerce shortcodes ini akan membuat halaman pelacakan pesanan. Dengan halaman fitur ini, pelanggan bisa memantau proses pengiriman pesanannya.

WooCommerce Shortcodes Order Track

5. Product Limit

[products limit=”6”] . Kode ini berfungsi untuk menampilkan berapa banyak produk ditampilkan dalam satu halaman. 

Sebagai contoh, Anda bisa membatasinya dengan 6 produk per halaman. Hasil tampilannya akan sebagai berikut. 

WooCommerce Shortcodes Product Limit

6. Column Limit 

[products limit=”4″ columns=”4″] – WooCommerce shortcodes ini berfungsi untuk menentukan berapa jumlah produk dalam satu kolom. 

Sebagai contoh, jika dalam satu kolom terdiri dari 4 produk, hasilnya akan seperti ini:

Column Limit

7. Pagination 

[products columns=”6” paginate=”true”] . Kode ini bisa Anda gunakan untuk membagi produk ke beberapa halaman berbeda. Terutama, jika produk yang Anda miliki sangat banyak.

Katakanlah, Anda ingin menampilkan enam produk dalam satu kolom pada setiap halamannya. Maka produk ke tujuh dan selanjutnya akan ditempatkan di halaman berikutnya. Contoh tampilannya sebagai berikut:

Pagination

8. Recent Products 

[products limit=”4″ columns=”4″ orderby=”date” order=”DESC” visibility=”visible”] . WooCommerce shortcodes ini berfungsi untuk menampilkan produk terbaru. 

Dengan kode orderby=”date”, produk akan ditampilkan berdasarkan tanggal input. Lalu order=”DESC” berarti produk akan diurutkan berdasarkan tanggal input yang paling baru. 

Sebagai contoh, untuk menampilkan empat produk terbaru dalam satu kolom sesuai contoh di atas, hasil tampilannya akan seperti ini: 

Recent Product

[products limit=”4″ columns=”2″ visibility=”featured” ] . WooCommerce shortcode ini  akan menampilkan beberapa produk pilihan atau produk unggulan toko online Anda. 

Sebagai contoh, dengan kode di atas, Anda akan menampilkan empat produk unggulan dengan tampilan dua produk per kolom halaman. 

Featured Products

10. On Sale Products 

[products limit=”12″ columns=”4″ orderby=”date” on_sale=”true”] . Kalau toko online Anda sedang menggelar promo sales, Anda bisa menampilkan produk-produk khusus yang sedang diskon. 

Dengan menambahkan WooCommerce shortcode seperti di atas, tampilannya akan menjadi begini: 

On Sale Products

11. Best Selling Products

[products limit=”3″ columns=”3″ best_selling=”true” ]  . WooCommerce Shortcodes berikut digunakan jika Anda ingin menampilkan produk terlaris. 

Sebagai contoh, di shortcode tersebut Anda ingin menampilkan tiga produk terlaris dalam satu baris. Tampilannya akan sebagai berikut:

Best Selling Products

12. Top Rated Products

[products limit=”6” columns=”3” orderby=”date” order=”ASC” top_rated=”true” ]  . Tampilkan produk dengan rating terbaik menggunakan WooCommerce ini. Tentunya fitur review harus sudah diaktifkan di toko online Anda.

Menggunakan kode di atas, Anda akan menampilkan produk dengan rating terbaik menggunakan urutan tanggal input berupa enam produk per halaman. Hasilnya sebagai berikut:

Top Rated Products

13.  Special Category Products

[products limit=”8″ columns=”4″ category=”hoodies, tshirts” cat_operator=”AND”] . Ingin menampilkan produk dengan kategori produk tertentu saja? Gunakan WooCommerce shortcodes ini.

Misalnya, Anda ingin menampilkan kategori hoodie dan tshirt saja. Maka, tentukan kategori produknya, jumlah produk per halaman dan batasan per kolom. Hasilnya akan seperti berikut:

Special Category Products

Kode ini sekaligus berguna untuk menampilkan produk selain yang ditentukan. Cukup mengubah cat_operator ke NOT IN. Misalnya, [products limit=”8″ columns=”4″ category=”hoodies, tshirts” cat_operator=”NOT IN”] 

Hasilnya akan muncul semua produk kecuali hoodies dan t-shirt:

Special Category Products

14. Single Product

[products_page]. WooCommerce shortcodes ini berfungsi untuk menampilkan produk tunggal. Nah, Anda dapat menggunakan ID produk atau SKU untuk menampilkannya.  

Contoh shortcode-nya seperti berikut ini. 

[product_page id=”243″] atau [product_page sku=”woo-hoodie”] 

Single Products

[related_products limit=”3″] . Ingin membantu pengunjung mendapatkan produk sejenis? WooCommerce shortcodes ini bisa membantu mereka. 

Anda bisa menampilkan produk terkait di setiap halaman produk tunggal. Sebagai contoh, jika ingin menampilkan tiga produk terkait seperti shortcode tersebut,  hasilnya akan sebagai berikut: 

WooCommerce Shortcodes Related Products

Optimasi Website Toko Online Anda dengan WooCommerce Shortcodes!

Nah itulah panduan WooCommerce shortcodes yang bisa Anda terapkan. 

Anda bisa lebih mudah melakukan kustomisasi website toko online sesuai keinginan. Mulai dari membuat website user friendly dengan menu dan tampilan produk yang lebih tertata hingga menambah fitur agar  pengalaman pengunjung belanja lebih baik. 

Pada akhirnya, kalau user experience terjaga, semakin betah pengunjung berada di toko online Anda. Kesempatan untuk berbelanja lebih banyak juga lebih besar.

Selain itu, website dengan user experience yang baik, berpeluang menduduki peringkat atas hasil pencarian Google. Artinya, lebih banyak calon pembeli lain yang dapat diundang untuk mengunjungi toko online Anda. Efeknya, pembelian produk pun meningkat.

Hanya dengan sebuah shortcode singkat, manfaatnya cukup besar, ya?

Nah, tunggu apa lagi? Buatlah website toko online Anda sesuai dengan tujuan bisnis dan kenyamanan konsumen.   

Putri Aprilia an SEO Content Writer at Niagahoster. Enjoy her articles about online business, web, and other technology-related issued.
[{"code":""
[{"code":""
"label":"Coba Lagi"
"label":"Coba Lagi"
"win":false}
"win":false}
{"code":"HOSTING50"
{"code":"HOSTING50"
"label":"Extra Diskon 50rb "
"label":"Extra Diskon 50rb "
"win":true}
"win":true}
{"code":"HOSTING20"
{"code":"HOSTING20"
"label":"Extra Diskon 20rb "
"label":"Extra Diskon 20rb "
"win":true}
"win":true}
{"code":"HOSTING100"
{"code":"HOSTING100"
"label":"Extra Diskon 100rb "
"label":"Extra Diskon 100rb "
"win":true}
"win":true}
{"code":""
{"code":""
"label":"Belum Beruntung"
"label":"Belum Beruntung"
"win":false}
"win":false}
{"code":"HOSTING20"
{"code":"HOSTING20"
"label":"Extra Diskon 20rb "
"label":"Extra Diskon 20rb "
"win":true}
"win":true}
{"code":""
{"code":""
"label":"Coba Lagi"
"label":"Coba Lagi"
"win":false}
"win":false}
{"code":"HOSTING50"
{"code":"HOSTING50"
"label":"Extra Diskon 50rb "
"label":"Extra Diskon 50rb "
"win":true}
"win":true}
{"code":"HOSTING20"
{"code":"HOSTING20"
"label":"Extra Diskon 20rb "
"label":"Extra Diskon 20rb "
"win":true}
"win":true}
{"code":"FREESHIPPING"
{"code":"FREESHIPPING"
"label":"Coba Lagi"
"label":"Coba Lagi"
"win":false}
"win":false}
{"code":""
{"code":""
"label":"Sedikit Lagi! "
"label":"Sedikit Lagi! "
"win":false}
"win":false}
{"code":"HOSTING50"
{"code":"HOSTING50"
"label":"Extra Diskon 50rb "
"label":"Extra Diskon 50rb "
"win":true}]
"win":true}]