Integrasi ShopEngine dengan Gutenberg untuk Toko WooCommerce

Akhirnya penantian berakhir! ShopEngine sekarang kompatibel dengan editor blok Gutenberg Anda. Sebelumnya, Anda hanya dapat mengakses widget ShopEngine melalui jendela Elementor, bukan?

Tapi sekarang ShopEngine tersedia lebih dari itu. Selain mengakses widget ShopEngine melalui Elementor, Anda dapat menggunakan ShopEngine di Gutenberg untuk toko WooCommerce . Namun, di Gutenberg, widget ini akan muncul sebagai blok.

Faktanya, fungsi widget Elementor dan blok Gutenberg identik. Lalu, dimana perbedaannya? Perbedaannya terletak pada aplikasinya. Untuk widget Elementor, Anda harus menarik dan melepas widget di area yang ditentukan untuk melihat hasilnya. Tetapi untuk blok Gutenberg, Anda cukup mengklik blok dan pekerjaan Anda selesai.

Sekilas Tentang Gutenberg:

Sebagai pengguna WordPress, Anda pasti sudah tidak asing lagi dengan istilah Gutenberg . Ini adalah editor konten WordPress, atau dikenal sebagai editor blok WordPress. Saat ini, Gutenberg adalah editor WordPress paling populer di kalangan pengguna WordPress karena kemudahan penggunaannya. Banyak plugin WordPress Gutenberg juga tersedia dari pengembang pihak ke-3.

Sebelumnya, orang lebih terbiasa menggunakan “Classic Editor”, editor WordPress lainnya. Sejak munculnya Gutenberg, orang-orang telah menggunakan editor blok lebih banyak dibandingkan dengan Editor Klasik. Keistimewaan Gutenberg adalah konten berbasis bloknya .

Tidak peduli apakah itu paragraf, gambar, atau tombol, masing-masing elemen ini adalah blok. Tidak seperti Editor Klasik, editor konten berbasis blok ini memungkinkan Anda memanipulasi konten dengan lebih banyak kontrol. Bagian terbaik dari editor blok ini adalah memungkinkan pengembang pihak ke-3 menyematkan blok khusus.

Dan inilah tepatnya yang akan kami fokuskan pada blog informatif ini karena mulai sekarang, banyak fitur ShopEngine akan tersedia untuk Anda di Gutenberg untuk WooCommerce. Sebelum kita membahas blok khusus ShopEngine di Gutenberg, izinkan saya menjelaskan mengapa kami mengintegrasikan ShopEngine dengan Gutenberg untuk WooCommerce .

Mengapa Mengintegrasikan ShopEngine dengan Gutenberg:

ShopEngine awalnya dirancang khusus untuk Elementor. Itu berarti Anda dapat membuat halaman WooCommerce Anda hanya untuk Elementor. Tapi sekarang, seperti yang saya sebutkan sebelumnya bahwa ShopEngine telah selangkah lebih maju setelah terintegrasi dengan Gutenberg.

Jadi, apa yang membuat kami mengintegrasikan ShopEngine dengan Gutenberg untuk WooCommerce ? Untuk menjawab pertanyaan ini, izinkan saya menyajikan kepada Anda potongan-potongan data-

Sesuai gutenstats.blog, Gutenberg telah menerima 76 juta instalasi aktif sampai sekarang. Selain itu, 264,5 juta posting ditulis dengan Gutenberg hingga saat ini.

Potongan data ini, saya rasa cukup untuk meyakinkan siapa pun bahwa mengapa kami memperluas jangkauan ShopEngine ke Gutenberg. Jutaan orang menggunakan Gutenberg untuk mengembangkan konten mereka dan kami tidak ingin mereka melewatkan fitur memukau yang ditawarkan ShopEngine.

Beberapa alasan lagi Integrasi ShopEngine dengan Gutenberg:

Izinkan saya menekankan poin bahwa Gutenberg bukan hanya editor konten . Proyek Gutenberg bertujuan untuk mengubah editor blok menjadi alat pengeditan situs lengkap dalam waktu dekat.

Idenya adalah membiarkan Anda mendesain 100% situs WooCommerce Anda dengan editor Gutenberg. Jika ini terjadi, permintaan Gutenberg kemungkinan akan meroket. Jadi, ada baiknya mengintegrasikan ShopEngine dengan Gutenberg untuk WooCommerce, bukan?

• Dengan Gutenberg, Anda tidak perlu menggunakan kode pendek untuk menyematkan konten. Sebagai gantinya, Anda dapat menerapkan blok untuk menambahkan elemen halaman yang diperlukan.
• Gutenberg bebas dari masalah kompatibilitas, sehingga pengembang dapat dengan mudah memasukkan dukungan Gutenberg di plugin mereka.
• Gutenberg mengeluarkan kode yang ringan dan juga merupakan alat yang memuat cepat.

Beberapa Blok ShopEngine Terkemuka di Gutenberg:

Sebelum saya menjelaskan blok ShopEngine, izinkan saya mengklarifikasi bahwa ShopEngine hadir dengan 65+ widget , 13+ modul , dan segudang template untuk halaman toko WooCommerce yang melayani pengguna Elementor. Setelah integrasi ShopEngine dengan Gutenberg untuk WooCommerce, Anda sekarang bisa mendapatkan akses ke 45+ blok ShopEngine di Gutenberg .

Bergantung pada jenis halaman yang Anda pilih untuk membuat templat untuk toko WooCommerce Anda, blok Gutenberg akan muncul sesuai dengan itu. Selain itu, Anda akan mendapatkan akses ke modul seperti Quick View, Variation Swatches, Product Comparison, dan Wishlist .

Mari kita lihat beberapa blok ShopEngine di Gutenberg untuk toko WooCommerce-

Judul Produk:

Blok judul Produk muncul di satu halaman untuk produk tertentu. Setelah Anda memilih satu jenis halaman untuk membangun template Anda, Anda hanya perlu mengklik blok Product Title dari sidebar.

Segera setelah itu, judul produk Anda akan muncul di halaman. Dari bilah sisi kanan, Anda dapat mengubah tag judul, perataan, warna, dan tipografi.

Daftar Produk:

Daftar produk menampilkan semua jenis produk yang Anda jual di toko WooCommerce Anda. Blok daftar produk muncul di semua jenis halaman termasuk halaman tunggal, toko, checkout, dan keranjang. Setelah Anda memilih jenis halaman, klik daftar produk dari popup atau sidebar.

Pastikan Anda memilih kategori produk agar produk ditampilkan. Dari bilah sisi kanan, Anda dapat memilih dan menyesuaikan berbagai elemen daftar produk. Anda dapat memilih jumlah produk per halaman, tag, tampilkan/sembunyikan lencana penjualan, persentase diskon, dll.

Deskripsi Produk:

Jika Anda membuat satu halaman template, blok deskripsi produk akan muncul di sidebar. Untuk membuat deskripsi produk muncul di halaman Anda, klik blok deskripsi produk. Anda dapat menyesuaikan deskripsi dan juga menyesuaikan mode dengan memodifikasi tipografi, warna, perataan, dll.

Pembayaran Pembayaran:

Seperti widget Pembayaran Checkout di Elementor, blok Pembayaran Checkout berfungsi di Gutenberg. Anda dapat melihat blok "Pembayaran Checkout" jika Anda masuk ke template build untuk halaman checkout Anda. Setelah itu, Anda dapat menambahkan blok pembayaran checkout yang Anda butuhkan untuk toko WooCommerce Anda.

Anda akan memiliki opsi untuk mengubah gaya konten, metode pembayaran, tombol, dll. Anda dapat mengubah posisi kotak centang, warna tombol, tipografi, batas, dll.

Arsip Produk:

Halaman produk yang diarsipkan berisi semua produk yang diposting di satu tempat. Untuk membuat template untuk halaman arsip di Gutenberg untuk WooCommerce, langsung saja ke sidebar kiri dan klik blok Archive Products . Semua produk inventaris akan muncul satu demi satu.

Halaman produk Arsip menawarkan banyak segmen termasuk tata letak, konten, pagination, peringkat, dll. Halaman tersebut berisi banyak elemen seperti judul produk, gambar produk, harga produk, deskripsi produk, footer produk, dan sebagainya.

Tabel Keranjang:

Di tabel keranjang, semua detail produk yang Anda pilih muncul termasuk nama produk, harga, kuantitas, subtotal, dan jumlah total. Dengan blok Tabel Keranjang ShopEngine , Anda dapat menampilkan pembeli Anda semua informasi yang relevan dengan produk Anda melalui tabel keranjang di halaman keranjang WooCommerce.

Untuk menyesuaikan konten dan menyesuaikan gaya berbagai elemen tabel keranjang, Anda akan mendapatkan parameter di bilah sisi kanan. Anda dapat mengubah warna header & footer produk, warna batas, warna teks, serta menyesuaikan bagian konten termasuk judul, harga, jumlah, total, dll.

Produk yang Baru Dilihat:

Dengan blok Produk yang Baru Dilihat ShopEngine , Anda dapat memamerkan produk yang baru saja dijelajahi atau dilihat pengguna Anda di toko WooCommerce Anda. Anda dapat menampilkan produk yang baru dilihat di halaman toko, halaman produk, halaman keranjang, dll.

Seperti blok lainnya, Anda dapat melihat parameter yang terkait dengan produk yang baru dilihat di bilah sisi kanan. Memanfaatkan parameter, Anda dapat menentukan jumlah produk yang akan ditampilkan, menampilkan/menyembunyikan lencana penjualan, mengatur celah kolom & baris, menyesuaikan ketinggian gambar produk, dll.

Berakhir:

Jadi, apa pendapat Anda tentang langkah kami untuk mengintegrasikan ShopEngine dengan Gutenberg untuk WooCommerce ? Beri tahu kami tentang pengalaman Anda dalam menerapkan blok ShopEngine di Gutenberg untuk toko WooCommerce.

Anda dipersilakan untuk memberikan umpan balik positif atau negatif tentang integrasi Gutenberg untuk WooCommerce. Kami juga akan menghargai saran dari Anda untuk merampingkan proses integrasi kami. Namun, pekerjaan kami pada integrasi ShopEngine dengan Gutenberg masih dalam proses. Sebentar lagi kita akan menyelesaikan proyeknya.