Panduan Lengkap Blok WooCommerce

WooCommerce adalah salah satu plugin populer untuk membangun situs e-commerce di WordPress. Blok WooCommerce adalah salah satu plugin di WooCommerce, dirancang untuk membuat lebih mudah bagi pengguna untuk membuat toko online di WordPress. Blok WooCommerce membantu dalam membuat halaman toko yang dipersonalisasi, menampilkan produk Anda, dan menambahkan fitur e-commerce lanjutan seperti penyaringan produk dan pencarian - semua tanpa menulis satu baris kode. 

Anda harus menginstal plugin WordPress WooCommerce Blocks untuk menggunakan blok-blok baru ini. Plugin ini adalah lahan pengujian untuk fitur eksperimental yang dapat ditambahkan ke WooCommerce inti.

Dalam panduan praktis ini, kita akan membahas fitur-fitur WooCommerce blocks dan cara menyesuaikannya. 

Apa itu WooCommerce Block?

Blok WooCommerce adalah kumpulan blok yang terintegrasi dengan editor blok WordPress (Gutenberg) yang memungkinkan Anda menambahkan berbagai fitur dan fungsionalitas WooCommerce ke halaman dan postingan Anda dengan mudah. Tanpa menulis kode, blok-blok ini memungkinkan Anda menampilkan produk, kategori produk, filter pencarian, keranjang belanja, checkout, dan banyak lagi.

Dalam istilah yang lebih sederhana, Blok WooCommerce adalah komponen pra-bangun yang dapat Anda masukkan ke dalam situs WordPress Anda menggunakan editor blok, menyediakan cara mudah untuk menggabungkan fungsionalitas e-commerce yang didukung oleh WooCommerce. Ini adalah bagian dari plugin WooCommerce inti, sehingga Anda mendapatkannya secara otomatis ketika Anda menginstal dan mengaktifkan WooCommerce di situs WordPress Anda.

Juga, mereka terintegrasi dengan mulus dengan editor blok WordPress, memungkinkan Anda untuk membangun halaman produk kustom, tata letak kategori, dan pengalaman berbelanja menggunakan antarmuka seret-dan-jatuhkan yang familiar.

Daftar Fitur WooCommerce Block

Setelah memahami apa itu blok WooCommerce, selanjutnya, kita akan membahas setiap fitur yang disediakan satu per satu:

• Semua Produk: Menampilkan semua produk toko dalam format grid.
• Filter Produk Aktif: Menampilkan filter produk aktif dalam bentuk daftar atau sebagai chip (mirip dengan tombol).
• Semua Ulasan: Menampilkan semua ulasan produk.
• Produk Terlaris: Menampilkan produk terlaris dalam format grid.
• Checkout: Menampilkan formulir yang memungkinkan pelanggan menyelesaikan pesanan mereka.
• Keranjang: Menampilkan keranjang belanja.
• Kategori Unggulan: Menampilkan kategori produk tertentu beserta tombol ajakan bertindak.
• Produk Unggulan: Menampilkan produk unggulan yang dipilih.
• Filter berdasarkan harga: Menampilkan rentang harga yang dapat digunakan pelanggan untuk memfilter produk. Anda juga dapat mengaktifkan rentang harga yang dapat diedit dengan mengklik tombol atau teks di sini.
• Filter berdasarkan stok: Memungkinkan pemfilteran produk berdasarkan status ketersediaan stok. Fitur ini menyediakan opsi untuk menampilkan produk yang tersedia, tidak tersedia, atau sedang dipesan ulang.
• Filter berdasarkan rating: Memungkinkan pelanggan untuk memfilter produk berdasarkan rating.
• Filter berdasarkan atribut: Memfilter produk berdasarkan ukuran atau warna.
• Produk pilihan: Menampilkan produk pilihan dalam format grid, memungkinkan Anda memilih produk yang ingin ditampilkan secara spesifik.
• Keranjang mini: Menyediakan tampilan singkat keranjang belanja.
• Produk terbaru: Menampilkan produk terbaru dalam format grid. Dapat disesuaikan dengan menambah/menghapus elemen seperti judul, harga, rating, dan tombol beli.
• Produk diskon: Menampilkan produk yang sedang diskon dalam format grid dan dapat disesuaikan dengan menambah/menghapus elemen seperti judul, harga, rating, dan tombol beli.
• Pencarian produk: Menambahkan bilah pencarian untuk memudahkan pelanggan mencari produk.
• Produk berdasarkan tag: Menampilkan produk dengan tag/label tertentu dalam format grid.
• Produk berdasarkan atribut: Menampilkan produk dengan atribut tertentu (warna, ukuran, dll.) dalam format grid.
• Produk berdasarkan kategori: Menampilkan produk berdasarkan kategori dalam format grid.
• Ulasan berdasarkan produk: Menampilkan ulasan yang dikelompokkan berdasarkan produk.
• Ulasan berdasarkan kategori: Menampilkan ulasan produk dari kategori tertentu.
• Produk tunggal: Menampilkan tampilan detail untuk satu produk.
• Produk dengan rating tertinggi: Menampilkan produk dengan rating tertinggi dalam format grid.

Cara menggunakan blok kisi produk di WooCommerce

Selain mempelajari fitur yang tersedia di WooCommerce blocks, mari kita coba menggunakan atau menambahkan grid produk di WooCommerce. Pastikan Anda telah menginstal plugin WooCommerce blocks di situs web Anda. Berikut cara menambahkannya:

1. Buka halaman atau postingan tempat Anda ingin menampilkan grid produk, lalu masukkan judul "Produk".

2. Di navigasi kiri, klik tombol (+) > gulir ke bawah ke bagian WooCommerce > pilih "grid produk".

3. Selanjutnya, untuk mengonfigurasi blok, buka panel sebelah kanan.

Di panel ini, Anda dapat menyesuaikan beberapa hal, termasuk:

• Pengaturan tata letak: Anda dapat menyesuaikan jumlah baris dan kolom yang ditampilkan dalam grid produk. Misalnya, mengatur keduanya menjadi 2 untuk tampilan yang seimbang.
• Pengaturan konten: Anda dapat menampilkan menu dropdown untuk mengurutkan produk. Fitur ini memungkinkan pelanggan untuk mengurutkan produk sesuai dengan preferensi mereka. Anda dapat menonaktifkannya jika tidak diperlukan.
• Gaya lanjutan: Anda dapat menambahkan kelas CSS untuk menyesuaikan tampilan.

Cara menambahkan produk unggulan ke halaman Anda

Blok Produk Unggulan memungkinkan Anda menampilkan produk tertentu di halaman atau postingan Anda. Dengan blok ini, Anda dapat memilih produk, menyesuaikan tampilannya, dan menempatkannya di konten Anda untuk menarik pengunjung ke item yang ingin Anda promosikan.

Untuk menambahkan Blok Produk Unggulan, ikuti langkah-langkah berikut:

1. Buka halaman atau postingan tempat Anda ingin menambahkannya. Misalnya, jika Anda menempatkannya di atas grid produk, buat ruang di area tersebut dan klik tombol "+" yang muncul.

2. Pilih tombol "+" pada toolbar blok untuk membuka daftar blok, lalu cari dan pilih "Produk Unggulan".

3. Pilih produk yang ingin Anda sorot, lalu klik "Selesai".
4. Untuk menyesuaikan tampilan blok, klik "Pengaturan". Di panel pengaturan, Anda dapat menyesuaikan beberapa hal termasuk:

• Tampilkan atau sembunyikan deskripsi dan harga produk.
• Konfigurasikan tampilan media (gambar dan video).
• Tambahkan teks alternatif untuk gambar produk.
• Pilih warna overlay blok.
• Sesuaikan opasitas blok.

5. Setelah menyesuaikan, Anda dapat mempublikasikan atau memperbarui halaman untuk melihat tampilan blok produk unggulan Anda.

Cara menambahkan blok filter di WooCommerce

Blok Filter WooCommerce memudahkan pelanggan untuk menemukan produk yang sesuai dengan kriteria pencarian mereka. Dengan menyediakan opsi penyaringan, pelanggan dapat dengan cepat mempersempit hasil pencarian ke produk yang relevan bagi mereka.

Untuk menambahkan blok filter, ikuti langkah-langkah berikut:

1. Buka halaman atau postingan di mana Anda ingin menempatkan blok filter.
2. Tentukan lokasi yang diinginkan untuk menempatkan blok filter.
3. Di toolbar editor blok, klik tombol "+" dan cari opsi filter WooCommerce seperti Filter Harga, Filter Stok, Filter Atribut, dan Filter Peringkat.

Sekarang, mari kita bahas setiap jenis filter yang tersedia. 

Menambahkan filter berdasarkan harga

Blok Produk Filter Harga memungkinkan Anda menambahkan fitur penyaringan yang memungkinkan pengguna memilih rentang harga yang diinginkan. Rentang harga dapat ditampilkan sebagai tombol yang dapat diedit atau teks biasa. Anda dapat menambahkan tombol jika diinginkan dan menyesuaikan tingkat judul mereka.

Menambahkan filter berdasarkan atribut

Blok Filter Atribut Produk memungkinkan pengguna untuk memfilter produk berdasarkan atribut seperti warna dan ukuran. Anda dapat memilih atribut yang ingin digunakan dari daftar yang tersedia. Tampilannya dapat berupa daftar atau menu tarik-turun. Anda juga dapat mengonfigurasi jenis kueri menjadi AND atau OR. Fitur lainnya termasuk menampilkan jumlah produk, memilih tingkat judul, menambahkan tombol, dan memilih filter.

Menambahkan filter berdasarkan stok

Blok Filter Status Stok Produk memungkinkan pengguna untuk menampilkan produk berdasarkan status ketersediaannya. Mereka dapat menampilkan produk yang tersedia (stok ada), kehabisan stok (stok habis), atau dalam pemesanan kembali. Anda juga dapat mengkonfigurasinya untuk menampilkan jumlah produk, memilih tingkat judul, dan menambahkan tombol. Blok ini dapat digunakan dengan blok WooCommerce lainnya, seperti Semua Produk. Sayangnya, blok ini tidak menyediakan pratinjau saat ditambahkan ke halaman.

Blok Keranjang dan Checkout

Blok keranjang belanja kami menambahkan tampilan keranjang belanja ke halaman Anda. Anda dapat memasukkan kalkulator biaya pengiriman, memilih tautan untuk tombol checkout, dan mengatur tampilan mode gelap. Blok ini juga memberikan notifikasi bahwa Anda dapat mengatur halaman sebagai halaman keranjang belanja default di pengaturan WooCommerce. Tautan untuk memberikan umpan balik juga disertakan.

Sementara itu, blok checkout menyediakan formulir checkout untuk keranjang belanja Anda. Anda akan diberitahu bahwa halaman ini dapat diatur sebagai halaman checkout default di pengaturan WooCommerce. Ada juga opsi untuk tampilan mode gelap. Blok ini terdiri dari beberapa elemen yang dapat Anda sesuaikan secara individual. Sayangnya, blok ini tidak menyediakan pratinjau setelah ditambahkan ke halaman.

Cara Mengkustomisasi Halaman Toko di WooCommerce

Setelah mempelajari cara menggunakan berbagai Blok WooCommerce, Anda dapat menggabungkan beberapa untuk membuat halaman toko kustom yang ramah pengguna. Untuk membangun tata letak halaman toko tertentu ini, ikuti langkah-langkah berikut.

1. Buat halaman baru dan beri nama "Toko".

2. Tambahkan Pencarian Produk blok.

3. Tambahkan Daftar Kategori Produk blok

Kemudian, atur gaya tampilan ke dropdown.

4. Tambahkan Filter Harga blok.
5. Tambahkan Produk Unggulan blok dan pilih produk yang ingin Anda sorot. Konfigurasikan sesuai kebutuhan.

6. Tambahkan Semua Produk blok.

Atur jumlah kolom dan baris ke 2, dan matikan opsi dropdown pengurutan.

7. Akhirnya, publikasikan halaman untuk melihat tata letak akhir halaman toko yang telah Anda buat.

Bangun Toko Online Anda dengan WooCommerce Block & Jual Produk Anda

Setelah berhasil membuat halaman toko kustom dengan WooCommerce Blocks, Anda sekarang dapat mulai menjual produk fisik dan digital Anda. Terutama untuk produk digital, sangat penting untuk menambahkan plugin unduhan file seperti WP File Download Addon.

Plugin ini memungkinkan Anda menjual produk unduhan digital di WooCommerce. Addon WP File Download membuat pengelolaan file dan kategori file untuk produk digital WooCommerce menjadi mudah. Anda dapat dengan cepat membuat banyak produk unduhan digital yang terkait dengan satu atau beberapa file.

Selain itu, plugin ini terintegrasi dengan Dropbox, Google Drive, Microsoft OneDrive, dan fitur Social Locker . Anda dapat menyediakan file dari layanan awan ini sebagai unduhan digital WooCommerce dengan akses yang sangat terbatas melalui konektor API awan.

Dengan Addon WP File Download , menjual produk digital di toko online WooCommerce Anda menjadi lebih mudah diakses dan efisien. Setelah membangun toko Anda dengan Blok WooCommerce, plugin ini melengkapi penjualan konten digital Anda dengan sempurna.

Kesimpulan

WooCommerce Blocks adalah plugin yang memungkinkan Anda membangun toko online lengkap di WordPress tanpa menulis kode. Dengan berbagai blok, seperti kisi produk, filter, dan tampilan produk unggulan, Anda dapat dengan mudah menciptakan pengalaman berbelanja yang menarik dan ramah pengguna. Antarmuka seret-dan-lepas yang familier membuat pengembangan toko online lebih cepat dan lebih efisien.

Setelah membangun toko online Anda, langkah selanjutnya adalah menjual produk fisik dan digital. Anda dapat memanfaatkan plugin Addon WP File Download untuk menjual produk digital dengan WooCommerce, seperti e-book, perangkat lunak, atau konten multimedia.

WP File Download Addon tersedia mulai dari $49 per tahun dan telah digunakan oleh lebih dari 60.000 anggota. Jadi, apa yang Anda tunggu? Bergabunglah dengan kami untuk penjualan produk digital yang lebih baik!