Panduan Lengkap Menggunakan Swatch Variasi WooCommerce dengan Cerdas [2022]
Diterbitkan: 2022-02-13Untuk meningkatkan penjualan di toko online Anda, langkah pertama adalah membuat calon pelanggan Anda terkesan secara visual. Dan untuk melakukannya, Anda harus mengoptimalkan halaman produk Anda.
Semakin mudah Anda membuat pembeli memilih produk mereka, semakin tinggi konversinya.
Jika Anda memiliki produk variabel di toko Anda, Anda ingin menampilkan semua variasi produk dengan cara yang ramah pengguna.
Salah satu tren terbaru yang telah melihat hasil yang bagus adalah penggunaan swatch untuk menyajikan variasi , daripada menu drop-down.
Oleh karena itu, gunakan contoh variasi WooCommerce untuk menyajikan varian produk dengan cara yang lebih menarik dan menarik.
Ciptakan niat pembeli yang lebih besar karena:
- Pembeli akan mendapatkan pratinjau varian daripada teks. Misalnya, mereka akan melihat warna merah secara visual, daripada memilih teks 'Merah', sehingga membantu untuk mengambil keputusan praktis.
- Lebih mudah untuk menelusuri varian dengan mengklik tombol carikan, daripada menu drop-down.
- Petak akan menarik pembeli untuk memeriksa varian, dan mungkin menciptakan niat pembeli. Seperti yang mereka katakan, semakin banyak Anda menghabiskan waktu untuk suatu produk, semakin Anda ingin membelinya.
Hari ini kita akan membahas bagaimana Anda dapat menggunakan contoh variasi di toko WooCommerce Anda dengan cara yang paling berorientasi pada hasil.
Anda akan mempelajari cara menerapkan jenis contoh variasi yang tepat tergantung pada varian produk Anda untuk meningkatkan niat pembeli.
Setelah membaca panduan ini, Anda akan dapat:
- Pahami betapa pentingnya setiap jenis swatch variasi
- Siapkan contoh warna, gambar, atau label untuk varian Anda sendiri
- Contoh penggunaan variasi swatch yang bagus
- Tingkatkan niat pembeli dan tingkatkan penjualan Anda
Jadi mari selami itu.
Daftar Isi
| # | Topik |
|---|---|
| 1. | Kapan dan mengapa menggunakan contoh variasi yang berbeda untuk hasil maksimal – dengan contoh |
| 2. | Bagaimana cara mengubah dropdown ke contoh tombol untuk variasi WooCommerce? |
| 3. | Bagaimana cara mengatur contoh warna WooCommerce untuk variasi produk? |
| 4. | Bagaimana cara mengatur contoh gambar untuk variasi produk WooCommerce? |
| 5. | Bagaimana cara mengatur contoh variasi label untuk produk variabel? |
Kapan Dan Mengapa Menggunakan Variasi Swatch yang Berbeda?

Produk variabel Anda mungkin memiliki jenis variasi yang berbeda. Anda tidak dapat menyiapkan contoh variasi unik untuk varian yang berbeda untuk membuat keterlibatan maksimum.
Variasi Warna Swatch
Sebuah produk mungkin tersedia dalam berbagai warna. Misalnya, Anda menjual sebuah t-shirt yang memiliki tiga warna, Merah, Biru, dan Kuning.
Kemudian Anda dapat menggunakan contoh variasi warna agar pelanggan Anda dapat memilih dari varian tersebut.
Secara default, WooCommerce memungkinkan orang memilih melalui menu drop-down yang membosankan. Tapi Anda bisa membuatnya lebih menarik dengan tombol carikan berwarna.
Lihat sendiri perbedaannya:
Bawaan

Menggunakan Swatch Variasi Warna

Seperti yang Anda lihat, warnanya terlihat jelas. Jadi seseorang akan menemukan pemilihan lebih mudah dan lebih praktis.
Contoh Variasi Gambar
Produk tertentu lebih fleksibel dan Anda dapat menyajikan varian menggunakan contoh variasi gambar.
Misalnya, Anda menjual kotak kado dengan berbagai bentuk. Jadi daripada menyajikan pilihan drop-down, Anda dapat menampilkan varian dengan contoh gambar.
Inilah betapa menakjubkannya itu menjadi:
Bawaan

Menggunakan Swatch Variasi Gambar

Seperti yang Anda lihat, varian disajikan dalam swatch kecil untuk bentuk sehingga membuatnya lebih menarik.
Tip:
Itu selalu ideal untuk memiliki gambar dengan semua varian bersama-sama sebagai gambar unggulan untuk produk. Jika Anda tidak memilikinya, gunakan gambar varian paling populer sebagai gambar unggulan.
Contoh Variasi Label
Faktor-faktor tertentu seperti Ukuran atau Panjang sulit untuk digambarkan secara visual.
Misalnya, jika Anda menjual kaos dengan ukuran L (untuk besar), M (untuk Sedang), dan S (untuk Kecil), maka Anda tidak dapat menampilkan ukuran sebenarnya secara visual.
Dalam hal ini, Anda tetap bisa membuatnya menarik dengan menghadirkan varian menggunakan tombol carikan variasi label.
Begini caranya tetap membuat perbedaan:
Bawaan

Menggunakan Swatch Variasi Label

Meskipun tidak ada visualisasi ukuran, swatch membuat pemilihan lebih menarik. Orang akan sering mengklik swatch hanya karena penasaran.
Contoh Variasi Teks
Serupa dengan ukuran, beberapa faktor variasi lain seperti bahan atau variasi terkait kelompok usia, dll, tidak dapat digambarkan secara visual, juga tidak dapat digambarkan sebagai label.
Misalnya Anda menjual topi ukuran Kids, Teen size dan Grow-up size.
Dalam hal ini, Anda dapat mengubahnya menjadi contoh teks kancing yang menarik.
Keuntungannya di sini adalah bahwa semua variasi yang tersedia akan dicantumkan di depan pembeli dan pembeli dapat memilih hanya dengan mengklik tombol.
Berikut pratinjaunya:
Bawaan

Menggunakan Swatch Variasi Teks

Tip:
Jika Anda memiliki label ukuran selain nilai bernomor, simpan bagan di situs Anda untuk menemukan nilai ukuran yang tepat. Toko sering kehilangan penjualan karena kurangnya grafik ini. Pelanggan tidak cukup sabar untuk mengetuk Anda pada layanan pelanggan untuk mengetahui ukuran yang tepat.
Seperti yang Anda lihat, mengubah menu variasi menjadi swatch membuatnya jauh lebih menarik dan menarik.
Nah, jika Anda ingin menerapkan atraksi ini, maka Anda bisa melakukannya dengan mudah menggunakan plugin Variation Swatches For WooCommerce.
Variasi Swatch Untuk WooCommerce
Variasi Swatch untuk WooCommerce adalah plugin sederhana yang dengannya Anda dapat mengubah pilihan dropdown dasar varian menjadi contoh tombol dengan mudah. Dibutuhkan hanya beberapa klik.
Biarkan saya memberi Anda panduan langkah demi langkah tentang bagaimana Anda dapat dengan mudah mengatur swatch variasi di toko online Anda menggunakan Variasi Swatch untuk WooCommerce.
Bagaimana cara mengubah dropdown ke contoh tombol untuk variasi WooCommerce?
Seperti yang telah dibahas sebelumnya, WooCommerce menampilkan variasi sebagai opsi dropdown di halaman produk.
Namun, Anda dapat dengan mudah mengonversi opsi variasi dari dropdown ke contoh tombol hanya dalam beberapa klik, menggunakan plugin.
Inilah cara Anda melakukannya langkah demi langkah.
1. Pertama, instal dan aktifkan Variasi Swatch untuk WooCommerce.
Di dasbor admin Anda, Anda akan mendapatkan menu baru bernama Swatch. Klik di atasnya.

Ini akan membawa Anda ke dasbor plugin.

2. Tetapkan gaya dan desain swatch dasar
Pada Pengaturan Umum, Anda akan menemukan opsi untuk mengatur warna dan batas swatch seperti biasanya ditampilkan, saat diarahkan, atau saat dipilih.
Plus Anda akan dapat mengatur ukuran font.
Konfigurasikan pengaturan ini sesuka Anda.
3. Buka Tab Kontrol
Klik pada tab Kontrol di sebelah kiri.

Tab Kontrol akan memiliki banyak opsi.

4. Aktifkan Dropdown Ke Tombol Swatch
Di sini, aktifkan opsi Dropdown To Button Swatches .

Kemudian simpan pengaturan. Sekarang Anda akan melihat bahwa variasi pada halaman produk akan ditampilkan dalam bentuk swatch tombol.
Pilihan Dropdown Default

Swatch Tombol Untuk Variasi

Setelah Anda mengaktifkan dropdown to button swatch untuk toko Anda, sekarang Anda dapat menyesuaikan swatch menjadi warna, gambar atau label swatch dengan mudah, dalam beberapa langkah sederhana.
Cara Mengatur Swatch Warna WooCommerce untuk Variasi Warna
Dengan menggunakan Color swatch, Anda dapat memberikan gambaran visual tentang warna yang akan dipilih pembeli. Jadi, tidak akan ada keraguan.
Dan seperti yang Anda lihat sebelumnya, contoh warna sangat menarik dibandingkan dengan pilihan dropdown biasa.
Untuk mengatur set up color swatch, ikuti langkah-langkah di bawah ini.
1. Aktifkan Dropdown Ke Tombol Swatch
Pertama-tama ikuti langkah-langkah untuk mengaktifkan dropdown to button swathes seperti yang dijelaskan sebelumnya.
(Klik di sini untuk membaca cara mengaktifkan dropdown ke contoh tombol.)
2. Buka Atribut Buatan Anda
Istilah variasi biasanya dikelompokkan ke dalam atribut.
Buka Dasbor > Produk > Atribut dan Anda akan menemukan daftar atribut yang telah Anda buat di toko Anda, dan opsi untuk menambahkan atribut baru.

Di sisi kanan, Anda dapat melihat daftar atribut yang dibuat yang Anda miliki.

3. Ubah Atribut yang Anda Inginkan Sebagai Jenis Warna
Arahkan mouse Anda pada nama atribut yang ingin Anda gunakan contoh warna.

Anda akan mendapatkan opsi untuk Mengedit atau Menghapus. Klik Edit dan itu akan membawa Anda ke halaman Edit atribut.


Setelah Anda berada di halaman Edit Attribute, Anda akan melihat bahwa Anda memiliki bidang untuk Type.

Klik di atasnya dan pilih opsi "Warna".

Kemudian klik tombol Perbarui di bawah ini.
4. Atur Swatch Warna Untuk Ketentuan Variasi
Setelah Anda menetapkan jenis atribut ke "Warna", sekarang Anda dapat menetapkan contoh warna ke istilah varian di bawah atribut ini.
Kembali ke Dasbor > Produk > Atribut dan di sisi kanan atribut (Anda baru saja menetapkan sebagai jenis Warna), Anda akan mendapatkan opsi untuk "Konfigurasikan istilah".

Klik pada Configure terms dan Anda akan dibawa ke halaman berikut:

Di sini, Anda dapat menambahkan istilah untuk variasi warna atau, di sisi kanan Anda dapat melihat istilah varian yang sudah Anda siapkan untuk warna di toko Anda.

Arahkan mouse Anda pada satu istilah warna dan Anda akan menemukan opsi untuk Mengedit.

Klik edit dan itu akan membawa Anda ke halaman edit. Di sini, di bawah ini Anda akan melihat bahwa Anda memiliki opsi untuk memilih warna.

Klik "Pilih Warna" dan Anda akan mendapatkan opsi untuk menetapkan warna.

Pilih warna yang sesuai dan klik Select Color lagi.
Kemudian klik tombol Perbarui di bawah ini.
Setelah diperbarui, kembali dan Anda akan melihat bahwa pratinjau warna ada tepat di samping nama istilah varian warna masing-masing.

Lakukan hal yang sama untuk sisa variasi warna dan hanya itu. Sekarang produk Anda akan memiliki contoh variasi warna alih-alih pilihan dropdown untuk varian warna.
Menggunakan Swatch Variasi Warna

Bagaimana cara mengatur contoh gambar untuk variasi produk WooCommerce?
Dengan menggunakan Image swatch, Anda dapat menampilkan varian tertentu sebagai swatch yang menarik saat melihat produk.
Dan seperti yang Anda lihat sebelumnya, contoh gambar sangat menarik, dibandingkan dengan pilihan dropdown biasa.
Untuk mengatur set up gambar swatch, ikuti langkah-langkah di bawah ini.
1. Aktifkan Dropdown Ke Tombol Swatch
Pertama-tama ikuti langkah-langkah untuk mengaktifkan dropdown to button swathes seperti yang dijelaskan sebelumnya.
(Klik di sini untuk membaca cara mengaktifkan dropdown ke contoh tombol.)
2. Buka Atribut Buatan Anda
Istilah variasi biasanya dikelompokkan ke dalam atribut.
Buka Dasbor > Produk > Atribut dan Anda akan menemukan daftar atribut yang telah Anda buat di toko Anda, dan opsi untuk menambahkan atribut baru.

Di sisi kanan, Anda dapat melihat daftar atribut yang dibuat yang Anda miliki.

3. Tetapkan Atribut yang Anda Inginkan Sebagai Jenis Gambar
Arahkan mouse Anda ke nama atribut yang ingin Anda gunakan contoh gambarnya.

Anda akan mendapatkan opsi untuk Mengedit atau Menghapus. Klik Edit dan itu akan membawa Anda ke halaman Edit atribut.

Setelah Anda berada di halaman Edit Attribute, Anda akan melihat bahwa Anda memiliki bidang untuk Type.

Klik di atasnya dan pilih opsi "Gambar".

Kemudian klik tombol Perbarui di bawah ini.
4. Atur Swatch Warna Untuk Ketentuan Variasi
Setelah Anda menetapkan jenis atribut ke "Gambar", sekarang Anda dapat menetapkan contoh gambar ke istilah varian di bawah atribut ini.
Kembali ke Dasbor > Produk > Atribut dan di sisi kanan atribut (Anda baru saja menetapkan sebagai Jenis gambar), Anda akan mendapatkan opsi untuk "Konfigurasikan istilah".

Klik pada Configure terms dan Anda akan dibawa ke halaman berikut:

Di sini, Anda dapat menambahkan istilah untuk variasi atau, di sisi kanan Anda dapat melihat istilah varian yang sudah Anda miliki (di bawah atribut ini).

Arahkan mouse Anda pada satu istilah dan Anda akan menemukan opsi untuk Mengedit istilah tersebut.

Klik edit dan itu akan membawa Anda ke halaman edit. Di sini, di bawah ini Anda akan melihat bahwa Anda memiliki opsi untuk mengunggah atau menambahkan gambar.

Klik "Unggah/Tambah Gambar" dan Anda dapat mengunggah gambar atau memilih gambar dari perpustakaan media Anda.

Pilih gambar yang sesuai lalu klik tombol Perbarui di bawah.
Setelah diperbarui, kembali dan Anda akan melihat bahwa pratinjau gambar ada di samping nama istilah varian.

Lakukan hal yang sama untuk varian lainnya dan hanya itu. Sekarang produk Anda akan memiliki contoh variasi gambar alih-alih pilihan dropdown untuk varian ini.
Menggunakan Swatch Variasi Gambar

Bagaimana cara mengatur contoh variasi label untuk produk variabel?
Dengan menggunakan Label swatch, Anda dapat menampilkan varian tertentu yang dapat dikenali dengan huruf atau angka tunggal.
Dan seperti yang Anda lihat sebelumnya, contoh Label lebih menarik, dibandingkan dengan pilihan dropdown biasa.
Untuk mengatur set up label swatch, ikuti langkah-langkah di bawah ini.
1. Aktifkan Dropdown Ke Tombol Swatch
Pertama-tama ikuti langkah-langkah untuk mengaktifkan dropdown to button swathes seperti yang dijelaskan sebelumnya.
(Klik di sini untuk membaca cara mengaktifkan dropdown ke contoh tombol.)
2. Buka Atribut Buatan Anda
Istilah variasi biasanya dikelompokkan ke dalam atribut.
Buka Dasbor > Produk > Atribut dan Anda akan menemukan daftar atribut yang telah Anda buat di toko Anda, dan opsi untuk menambahkan atribut baru.

Di sisi kanan, Anda dapat melihat daftar atribut yang dibuat yang Anda miliki.

3. Tetapkan Atribut yang Anda Inginkan Sebagai Jenis Label
Arahkan mouse Anda ke nama atribut yang ingin Anda gunakan contoh labelnya.

Anda akan mendapatkan opsi untuk Mengedit atau Menghapus. Klik Edit dan itu akan membawa Anda ke halaman Edit atribut.

Setelah Anda berada di halaman Edit Attribute, Anda akan melihat bahwa Anda memiliki bidang untuk Type.

Klik di atasnya dan pilih opsi "Label".

Kemudian klik tombol Perbarui di bawah ini.
4. Tetapkan Label Swatch Untuk Ketentuan Variasi
Setelah Anda menetapkan jenis atribut ke "Label", sekarang Anda dapat menetapkan contoh label ke istilah varian di bawah atribut ini.
Kembali ke Dasbor > Produk > Atribut dan di sisi kanan atribut (Anda baru saja menetapkan sebagai jenis Label), Anda akan mendapatkan opsi untuk "Konfigurasikan istilah".

Klik pada Configure terms dan Anda akan dibawa ke halaman berikut:

Di sini, Anda dapat menambahkan istilah untuk variasi atau, di sisi kanan Anda dapat melihat istilah varian yang sudah Anda miliki (di bawah atribut ini).

Arahkan mouse Anda pada satu istilah dan Anda akan menemukan opsi untuk Mengedit istilah tersebut.

Klik edit dan itu akan membawa Anda ke halaman edit. Di sini, di bawah ini Anda akan melihat bahwa ada bidang untuk Anda memasukkan karakter Label.

Masukkan Label yang ingin Anda tampilkan.

Kemudian klik tombol Perbarui di bawah ini.
Setelah diperbarui, kembali dan Anda akan melihat bahwa pratinjau label ada di samping nama istilah varian.

Lakukan hal yang sama untuk varian lainnya dan hanya itu. Sekarang produk Anda akan memiliki contoh variasi label alih-alih pilihan dropdown untuk varian ini.
Menggunakan Swatch Variasi Label

Kesimpulan
Jelas bahwa pilihan dropdown untuk produk variabel tidak lagi disukai. Cara terbaik untuk menawarkan variasi adalah dengan menggunakan swatch.
Dan bagian terbaiknya adalah, ini sangat mudah diterapkan dan dapat dilakukan hanya dalam beberapa klik menggunakan plugin Variation Swatches for WooCommerce.
Jadi saya sarankan Anda mencoba plugin dan memanfaatkan manfaat dari variasi swatch WooCommerce. Manfaatkan menarik pembeli dengan mudah tanpa banyak usaha.
Jika Anda ingin mempelajari cara membuat produk variabel, Anda dapat mengikuti panduan ini:
- Panduan Lengkap Untuk Membuat Produk Variabel WooCommerce
