Sorotan Plugin Divi: Divi BodyCommerce

Divi BodyCommerce adalah plugin pihak ketiga untuk Divi yang memberi Anda kendali atas desain toko Anda dari halaman produk ke halaman checkout dan segala sesuatu di antaranya. Ini dirancang dengan mempertimbangkan konversi dan memberi Anda kontrol penuh atas desain toko Anda menggunakan Divi Builder.

Ketika sebuah plugin menawarkan banyak modul dan fitur seperti yang satu ini, mereka cenderung menjadi kewalahan untuk digunakan. Namun, itu bukan masalah dengan yang satu ini karena semuanya mudah diikuti dan ada lebih banyak video langkah demi langkah daripada plugin apa pun yang pernah saya lihat. Pada artikel ini, kita akan melihat Divi BodyCommerce dan melihat apa yang dapat dilakukan dan betapa mudahnya menggunakannya.

Instalasi dan Pengaturan Divi BodyCommerce

Unggah dan aktifkan plugin seperti biasa. Untuk mengaktifkan lisensi, buka Divi Engine > BodyCommerce License di menu dasbor.

Mengklik BodyCommerce di menu dasbor membuka pengaturan. Ini adalah jenis pengaturan yang sama yang Anda harapkan untuk dilihat untuk WooCommerce. Di sini, Anda dapat memilih halaman Anda. Setelah Anda membuat tata letak untuk halaman ini, buka halaman pengaturan ini dan pilih. Anda juga dapat mengatur halaman ke lebar penuh dan memilih untuk memiliki template produk yang berbeda untuk setiap kategori.

Modul Divi BodyCommerce

53 modul baru ditambahkan ke Divi Builder. Ini semua adalah elemen yang Anda butuhkan untuk mendesain setiap aspek toko WooCommerce Anda termasuk halaman produk, halaman akun, halaman arsip, keranjang belanja, dll. Semuanya diberi kode warna sehingga Anda tidak dapat melewatkannya. Warna sebenarnya menunjukkan untuk apa modul itu. Misalnya, modul merah untuk halaman produk. Beberapa menggunakan gradien untuk menunjukkan bahwa mereka bekerja dengan dua jenis halaman. Gambar ini menunjukkan 24 modul pertama.

Berikut adalah 29 modul berikutnya. Modul menambahkan elemen halaman seperti penjualan atas, penjualan silang, penggeser, produk terkait, korsel, galeri, berbagi, tab, remah roti, dan banyak lagi. Loops membuat daftar produk untuk membangun halaman toko Anda. Mereka menyertakan tab dan opsi Konten, Desain, dan Lanjutan yang diharapkan.

Catatan – Jika halaman tidak dimuat, pastikan Anda tidak menggunakan modul pada halaman yang tidak dirancang untuk bekerja pada halaman tersebut. Beberapa modul bersifat global dan berfungsi dengan halaman apa pun, tetapi yang lain dimaksudkan untuk jenis halaman tertentu. Misalnya, Anda tidak dapat menggunakan modul halaman produk pada halaman loop.

Membuat dan Menetapkan Halaman

Mari kita lihat cara membuat halaman dan mengaturnya sebagai default untuk kategori tersebut. Pertama, buat tata letak di Perpustakaan Divi.

Selanjutnya, buka Divi Engine > BodyCommerce di menu dasbor. Pilih tab untuk jenis halaman yang Anda buat, lalu pilih tata letak untuk halaman tersebut. Anda dapat membuat tata letak sebanyak yang Anda inginkan dan menggunakannya untuk berbagai jenis halaman dan untuk masing-masing kategori.

Contoh Divi BodyCommerce

Berikut adalah beberapa contoh yang saya buat. Ini hanya contoh kecil dari apa yang dapat dilakukan dengan plugin ini.

Halaman Toko Divi BodyCommerce

Untuk halaman toko, saya baru saja menambahkan modul halaman arsip loop produk.

Inilah halaman dengan pengaturan default. Setiap elemen dapat disesuaikan dengan Divi Builder.

Ini dia dalam tata letak Tea Shop. Ini adalah pengaturan default dengan pengecualian batas. Saya mengaturnya untuk menampilkan 6 produk.

Anda dapat menyesuaikan beberapa elemen secara langsung.

Saya telah menambahkan latar belakang hijau ke lencana dan tombol penjualan, mengatur tata letak untuk menampilkan 6 kolom, menambahkan bayangan kotak ke produk, dan menambahkan hamparan hijau. Saya terkesan dengan jumlah opsi untuk tata letak.

Ini adalah tata letak gaya blog. Akan terlihat bagus jika Anda memiliki deskripsi produk yang lebih panjang.

Halaman Produk Divi BodyCommerce

Saya membuat tata letak halaman produk di Perpustakaan Divi dan memilihnya sebagai tata letak default di pengaturan BodyCommerce. Ini hanyalah tata letak dasar untuk mendapatkan gambaran tentang apa yang dapat dilakukan modul.

Ini sederhana, tetapi ini adalah tempat yang baik untuk memulai. Ini menunjukkan judul, galeri, dan penggeser produk.

Saya memasukkan beberapa halaman produk dan modul global secara acak.

Itu mulai menunjukkan hal-hal yang dapat dilakukan dengan BodyCommerce. Mari kita lakukan beberapa Divi di halaman ini.

Berikut adalah beberapa penyesuaian sederhana dengan Divi Builder. Yang saya lakukan hanyalah menambahkan latar belakang ke bagian dan baris dan menyesuaikan batas untuk tombol dan bidang pencarian.

Dalam hal ini, saya telah menambahkan baris baru untuk produk terkait dan memindahkan modul pencarian ke baris itu. Saya juga mengubah tata letak untuk produk dan mengubah gambar produk menjadi galeri. Saya mengaturnya ke gulir vertikal. Jika demo WooCommerce memiliki lebih banyak gambar untuk produk ini, mereka akan ditampilkan dalam kolom vertikal di sebelah kiri. Ini hanya menggores permukaan tingkat penyesuaian yang dapat dilakukan dengan halaman produk.

Keranjang Belanja Divi BodyCommerce

Saya sedang membangun halaman keranjang belanja menggunakan halaman kontak di tata letak Bakery. Saya menggunakan modul Cart Products dan Cart Totals. Mereka tidak menampilkan konten mereka saat melihat di Visual Builder, tapi Anda masih bisa membangun di Visual Builder. Modul menyediakan banyak fitur lain seperti cross-selling.

Berikut keranjang belanja menggunakan pengaturan default. Saya memiliki dua modul dalam tata letak 2 kolom tunggal.

Inilah halaman keranjang belanja setelah beberapa perubahan. Saya mengubah ke tata letak kolom tunggal, menambahkan beberapa spasi ke kanan kiri, menambahkan warna latar belakang dari tata letak, mengubah warna tombol dan warna teks agar sesuai dengan tata letak, dan menambahkan bayangan kotak.

Dokumentasi Divi BodyCommerce

Dokumentasi disediakan dalam bentuk tertulis di situs web pengembang dan dengan serangkaian video di YouTube. Saya suka itu mencakup keduanya. Tautan disediakan di menu dasbor Divi Engine. Anda juga dapat melihat video dengan mengeklik salah satu fitur di situs web pengembang. Ini menciptakan struktur yang menarik untuk menemukan video yang Anda butuhkan. Ini sebenarnya bagaimana saya menemukan video yang ingin saya lihat.

Harga Divi BodyCommerce

BodyCommerce memiliki tiga lisensi untuk dipilih:

• 1 situs – £24
• 5 situs – £50
• Situs tak terbatas – £96

Anda dapat membeli BodyCommerce dari situs web pengembang.

Mengakhiri Pikiran

Divi BodyCommerce memberikan tingkat kontrol yang mengesankan atas produk dan desain halaman WooCommerce. Saya baru saja menyentuh apa yang bisa dilakukannya. Anda juga dapat menyesuaikan layar login, lencana, halaman akun, halaman terima kasih, formulir, halaman pencarian, dan banyak lagi. Bahkan termasuk template email, ikon kustom, swatch, dan AJAX untuk keranjang belanja. Saya senang bisa membuat tata letak yang berbeda untuk setiap kategori.

Modul dan tata letaknya mudah digunakan. Saya memang mengikuti video di halaman pengembang untuk membuat contoh saya. Videonya detail dan mudah diikuti. Saya tidak kesulitan membuat jenis halaman apa pun yang saya inginkan.

BodyCommerce menyediakan lebih banyak alat dan penyesuaian daripada plugin WooCommerce/Divi yang pernah saya lihat sejauh ini. Jika Anda menggunakan WooCommerce dengan Divi dan Anda ingin menyesuaikan halaman WooCommerce Anda, BodyCommerce adalah pilihan yang mudah.

Kami ingin mendengar dari Anda. Sudahkah Anda mencoba BodyCommerce untuk Divi dan WooCommerce? Beri tahu kami pendapat Anda tentang hal itu di komentar.

Gambar Unggulan melalui Letters-Shmetters / shutterstock.com