Tahap 4 tutorial menempatkan produk secara otomatis
Menampilkan produk WooCommerce di halaman website, pada tempat sesuai yang diinginkan kemudian mengatur posisi tampilan sesuai dengan konsep desain yang telah direncanakan.
Sebelum lanjut ke tahapan menampilkan produk silahkan baca dari awal mengenai Tutorial Desain WordPress Mudah dan Cepat
Pada tutorial sebelumnya kita sudah membuat Slider gambar ditambah tulisan dan tombol dalam gambar, juga telah membuat blok kolom Layanan Kami. Termasuk menambahkan icon, animasi icon dan link dari masing-masing layanan menuju halaman tertentu.
Tahapan keseluruhan tutorial desain WordPres adalah sebagai berikut :
- Persiapan.
- Membuat gambar slider / bergerak ukuran besar. Menempatkan teks dan tombol WhatsApp serta nomor Telp pada slider.
- Membuat blok Layanan Kami.
- Menempatkan produk secara otomatis dari sistem toko online.
- Membuat blok kenapa memilih kami dengan cara menempatkan konten dari halaman lain.
- Membuat blok testimoni.
- Membuat blok untuk menyimpan Video.
- Membuat galeri gambar.
- Menampilkan kumpulan artikel terbaru.
- Membuat map dan form kontak.
- Mengisi bagian footer.
- Membuat popup pemberitahuan.
Cara menampilkan produk WooCommerce
Pertama yang harus dilakukan sebelum dapat menampilkan produk tentu install plugin WooCommerce terlebih dahulu kemudian tambah produk.
Kami anggap Anda sudah install WooCommerce dan sudah membuat produk tapi jika belum disini akan sedikit diulas tentang cara install plugin WooCommerce dan menambahkan produk.
Install plugin WooCommerce
Di dasbor admin menu plugin cari WooCommerce kemudian install dan aktifkan.
Tambah produk di WooCommerce
Ketika menambahkan produk penting untuk menentukan kategori supaya ketika ditampilkan bisa berdasarkan produk tertentu. Dan silahkan tambah sekitar 8 atau 12 produk karena baris dan kolom akan dibuat 2 baris dan 4 kolom.
Setelah produk ditambahkan selanjutnya tampilkan produk tersebut di halaman yang diinginkan, dalam contoh kali ini yaitu menampilkan produk di halaman Home.
Sebelum menampilkan produk, penting untuk install plugin tambahan di Elementor yaitu plugin Essential Addons for Elementor By WPDeveloper. Plugin ini untuk menambahkan fitur dan fungsi baru termasuk menampilkan produk WooCommerce.
Setelah Essential Addon ditambahkan silahkan edit halaman Home menggunakan Elementor kemudian buat blok baru, cukup satu kolom karena pengaturan kolom produk akan diatur dari Essential Addons.
Setelah produk tampil silahkan layout style produk menggunakan Essential Addons, misalnya menentukan kolom, baris, jenis tulisan, warna dan lain sebagainya.
Sampai disini menampilkan produk di halaman depan selesai dilakukan, silahkan Anda kustom tampilan sesuai yang diinginkan.
Lihat video tutorial menampilkan produk WooCommerce
Selanjutnya Tahap 5 Kenapa Memilih Kami Menggunakan Tab