Cara Membuat Halaman Toko WooCommerce Elementor Anda Sendiri

Diterbitkan: 2022-05-05

Di dunia online, Anda bisa menjadi pemilik toko dalam waktu singkat. Yang Anda butuhkan untuk memulai hanyalah koneksi internet, laptop, dan ide bisnis yang menggiurkan. Anda bahkan tidak perlu memiliki produk yang nyata – Anda dapat menjual ide! Selain lelucon – Anda dapat membuat toko web yang luar biasa dengan cukup mudah bahkan jika Anda tidak memiliki pengetahuan teknis apa pun . Anda dapat mulai dengan memilih tema WooCommerce berkualitas karena tema khusus niche biasanya menyertakan banyak fitur praktis dan berguna yang akan dibutuhkan toko Anda, dan kemudian melanjutkan untuk menyiapkan rencana bisnis!

Ada banyak elemen hebat yang dapat Anda gunakan untuk membuat toko web Anda lebih sukses, dan memiliki halaman toko Elementor WooCommerce yang dipesan lebih dahulu sangat penting.

Pada artikel ini, kami akan menunjukkan kepada Anda cara membuat halaman toko Elementor WooCommerce Anda sendiri yang indah dengan mudah. Tetap disini untuk membaca lebih lanjut tentang:

  • Halaman Toko WooCommerce
  • Menggunakan Widget Qi Addons untuk Halaman Toko WooCommerce Anda

Halaman Toko WooCommerce

Kami tahu betul bahwa membuat toko web mencakup elemen khusus yang diperlukan pengguna untuk memiliki semua informasi yang relevan tentang produk . Setiap toko akan memiliki halaman yang menyajikan produk atau kelompok produk dengan cara tertentu, dan halaman yang dirancang dengan baik ini membawa Anda selangkah lebih dekat ke toko web yang sukses. Halaman lain yang penting bagi toko adalah halaman yang berisi informasi tentang pengiriman, pembayaran, perusahaan, halaman keranjang , dan sejenisnya.

Di sini kita akan berurusan dengan halaman yang menampilkan daftar produk yang tersedia di toko dan kami akan membantu Anda membuatnya seperti seorang profesional .

Halaman Toko Elementor WooCommerce adalah halaman arsip tempat semua produk dari satu toko ditampilkan. Anda dapat dengan mudah membuat halaman ini dengan plugin WooCommerce. Setelah Anda menambahkan produk ke situs Anda, Anda perlu membuka halaman tanpa konten apa pun di dalamnya, dan dalam pengaturan WooCommerce menunjukkan bahwa halaman tersebut adalah halaman Toko Anda.

WooCommerce Shop page

Apa yang kita dapatkan dengan cara ini? Kami telah memberi tahu WooCommerce bahwa kami telah mendedikasikan halaman ini ke halaman arsip untuk semua produk dan WooCommerce akan menampilkannya sesuai dengan itu. Adapun gaya produk pada halaman itu, sangat tergantung pada tema yang Anda pilih. Jika tema cocok untuk toko, Anda dapat mengharapkannya langsung terlihat bagus dan mungkin memiliki beberapa filter . Tapi, jika tidak ada cara untuk mengedit halaman toko WooCommerce dengan Elementor gratis.

Tetapi bagaimana jika tidak semuanya sempurna dan bagaimana jika ada yang perlu diperbaiki? Ini menimbulkan masalah bagi mereka yang tidak tahu cara mengedit kode itu sendiri . Tentu saja, kami punya solusi. Jika karena alasan apa pun menurut Anda halaman default tampak tidak pantas di bawah ini, kami akan menunjukkan cara menyesuaikannya.

Menggunakan Widget Qi Addons untuk Halaman Toko WooCommerce Anda

Widget toko Qi sebagai bagian dari Qi Addons for Elementor adalah widget bergaya yang berpadu sempurna dengan gaya situs web Anda, karena menyesuaikan dengan tema yang Anda gunakan secara default . Namun, mereka juga menawarkan banyak opsi penyesuaian sehingga Anda dapat menatanya lebih lanjut sesuai keinginan Anda .

Untuk membuat halaman toko yang diinginkan, Anda perlu:

  • Untuk memasukkan produk yang diinginkan (tentu saja kategori dan tag mereka jika perlu)
  • Agar Anda memiliki pembuat halaman Elementor gratis yang diinstal
  • Untuk menginstal Qi Addons for Elementor (kami akan menunjukkan kepada Anda apa yang dapat Anda lakukan secara gratis dan apa yang bisa Anda dapatkan dengan widget premium).

Sekarang, mari kita jelaskan ini. Tentu saja, Anda tidak dapat membuat halaman toko tanpa produk, jadi itu adalah langkah pertama. Adapun Qi Addons, kami memilihnya karena beberapa alasan. Yang pertama adalah ia memiliki widget untuk membuat daftar produk , dan yang kedua adalah ia juga menawarkan banyak widget berguna lainnya yang dapat Anda gunakan di situs Anda .

Kami akan membuat halaman baru terlebih dahulu. Milik saya akan disebut sebagai halaman Toko khusus hanya misalnya, tetapi Anda cukup menyebutnya Toko .

Itu ditambahkan seperti yang lain. Saya memasukkan nama halaman, menyimpannya dan pergi ke Edit with Elementor . Tentu saja, tergantung pada temanya, sebelum Anda beralih ke Elementor dari editor Blok, Anda dapat membuat pengaturan dasar untuk halaman itu sendiri . Dalam contoh, saya menggunakan tema Qi , yang sering menjadi pilihan saya karena mengandung banyak pengaturan untuk berbagai bagian situs, yang sangat berarti bagi saya karena saya tidak perlu mengubah kode dan saya memiliki banyak opsi. untuk menata berbagai bagian situs.

Add new shop page

Saat masuk ke Elementor, hal pertama yang harus dilakukan adalah mencari widget produk dengan mengetik 'search' di kolom pencarian. Anda akan mengenali widget Qi dengan ikon merah bawaannya .

Mungkin yang paling penting bagi kami adalah Daftar Produk , yang memungkinkan kami untuk menampilkan daftar produk – semua atau produk yang dipilih berdasarkan kriteria yang diberikan . Ini adalah widget gratis.

Dan jangan lupakan yang lainnya. Daftar Kategori Produk berfungsi untuk menunjukkan kategori toko kami, juga gratis. Widget Product Slider menawarkan cara menarik untuk menampilkan produk menggunakan slider, juga gratis. Perbandingan Produk membantu kami menampilkan produk yang dipilih dan membandingkan fiturnya – ini adalah widget premium. Jika Anda menggunakan tema Qi, Anda juga akan memiliki Daftar Produk Esensial yang menawarkan cara untuk menampilkan daftar produk dari demo tema tertentu sehingga kami tidak akan fokus padanya.

Product widgets

Seperti yang saya katakan Daftar Produk adalah widget yang paling penting bagi saya dan saya menambahkannya ke halaman.

Product list widget

Seperti yang sudah Anda ketahui, ketika Anda menambahkan widget di halaman, Anda akan menemukan pengaturannya di sebelah kiri, dan di sebelah kanan, Anda bisa melihat langsung bagaimana tampilan widget di halaman Anda .

Tab Umum dan Gaya ditautkan ke widget itu sendiri sementara tab Lanjutan ada di pengaturan tab Elementor dan sudah tidak asing lagi bagi Anda jika Anda pernah menambahkan widget ke halaman. Bagaimanapun, Elementor sangat mudah digunakan sehingga Anda tidak memerlukan penjelasan khusus, terutama untuk widget ini di mana semuanya intuitif dan mudah dinavigasi.

Mengapa kami menyukai widget Qi Addons? Karena kita dapat menentukan sendiri berapa banyak kolom yang ingin kita miliki pada daftar , kita dapat mengatur ruang antar item sendiri. Kita dapat menentukan ukuran gambar , kita dapat memilih berapa banyak produk yang akan ada di halaman kita , apakah kita akan menggunakan pagination , dan jenis apa, jika kita memiliki lebih dari satu halaman produk. Qi masuk ke detail bahkan dengan pilihan font dan pengaturan hover . Ada beberapa tata letak untuk daftar. Kami juga dapat menampilkan hanya produk dari kategori tertentu, tag, penulis, dan kriteria tampilan yang berbeda tersedia . Dengan Qi, menambahkan widget sering kali berubah menjadi proses yang menyenangkan dan kreatif, dan kami yakin Anda akan penasaran untuk menjelajahi banyak pilihan yang ada pada Anda sendiri.

Pada pandangan pertama pada tab Style, Anda akan takjub melihat betapa detail pengaturannya. Anda akan melihat bahwa stylization dibagi menjadi beberapa kategori sehingga lebih mudah untuk dinavigasi .

Product list style options

Widget lain digunakan dengan cara yang hampir sama. Jangan ragu untuk bermain, dan bereksperimen karena semua perubahan yang Anda buat akan terlihat secara real time dan Anda dapat dengan mudah membatalkan gerakan apa pun .

Anda selalu dapat mencari inspirasi di halaman arahan widget dengan penulis jika Anda bertanya-tanya bagaimana cara menata daftar Anda, tetapi sekali lagi, mainkan.

Product examples

Tambahan yang bagus untuk halaman toko Anda juga bisa berupa widget Slider . Hal ini dapat membuat halaman terlihat lebih dinamis dan interaktif , elemen yang bergerak selalu menarik perhatian pengguna, terutama ketika ia dapat berinteraksi dengannya.

Slider products

Kombinasi widget daftar Produk dan widget Slider Produk bisa sangat menarik .

Juga, widget lain yang saya suka gunakan di halaman toko dan lainnya adalah Daftar Kategori Produk . Ini berfungsi untuk menunjukkan kategori tertentu dengan cara yang menarik dan membantu pengguna menjangkau sekelompok produk yang mereka minati .

Category list

Widget perbandingan produk juga sangat menarik, dan berguna terutama karena pembeli saat ini suka membuat keputusan yang tepat tentang berbelanja dan suka membandingkan produk untuk memastikan mereka membuat pilihan terbaik. Menambahkan perbandingan produk WooCommerce juga sangat mudah dan dapat dilakukan tanpa pengetahuan teknis atau coding khusus.

Comparision

Kesimpulannya

Seperti yang Anda lihat, membuat halaman toko Elementor WooCommerce bukanlah ilmu roket dan Anda dapat melakukannya sendiri. Anda juga dapat dengan mudah mempelajari cara mengedit halaman toko WooCommerce juga, dan menyesuaikannya agar sesuai dengan kebutuhan Anda dengan sempurna. Jika Anda memiliki pertanyaan terkait topik artikel ini, jangan ragu untuk menghubungi kami di bagian komentar. Kami berharap dapat mendengar tentang pengalaman Anda dengan Qi Addons for Elementor!

Kami harap artikel ini bermanfaat. Jika Anda menyukainya, jangan ragu untuk membaca beberapa artikel ini juga!

  • Tema WooCommerce Elementor Paling Ramah Pelanggan
  • eBook Tema WordPress untuk Meningkatkan Penjualan Online
  • Apa Praktik SEO Woocommerce Terbaik?