Setelah saya buat tutorial header dan footer minggu lalu, masih banyak yang belum mengerti cara memaksimalkan Elementor. Yang sering saya lihat adalah masalah di bagian Home. Nah, kali ini saya buatkan tutorial membuat halaman depan website dengan Elementor.
Sebenarnya tidak sulit kok. Hanya perlu ketelitian karena banyak tombol yang harus di klik. Dan Anda perlu paham tombol mana yang harus di klik untuk menghasilkan layout yang diinginkan.
Daftar Isi:
- Menentukan Page Layout
- Slider dengan Elementor
- Menggunakan Blok dari Elementor Library
- Testimonial dan Ratings
- Membuat Tabel Harga
- Bereksperimen dengan Elementor
Nah, sekarang saatnya kita coba membuat halaman depan website. Yang saya gunakan adalah Elementor Pro + Essential Addons for Elementor Pro. Anda bisa membelinya di sini.
Kalau Anda berminat untuk beli dari developernya langsung dengan harga lebih mahal, silakan klik di sini.
Komposisi Website Profesional yang baik, umumnya terdiri dari tiga halaman utama, yaitu:
- Halaman depan atau Home
- Kontak
- Tentang Kami (About Us)
Tentukan Page Layout Website dengan Elementor
Kalau Anda memakai Tema WordPress, maka pilih di Page Setting > Page Layout > Default untuk menampilkan tampilan Tema pilihan Anda.
Saya lebih suka menggunakan Elementor Full Width karena lebih fleksibel dan enak dilihat.
Tutorial Slider Website dengan Elementor
Klik 
pada panel navigasi Elementor di sisi kiri , ketik Slide, lalu Drag and Drop di blok kosong di sisi kanan.
- Klik tanda
dan atur Content Width dari Boxed menjadi Full Width. - Sesuaikan Height menjadi 550px.
- Silakan atur backgrond, featured image, atau text sesuai yang Anda perlukan.
- Aktifkan Background Overlay jika dirasa perlu.
Hasilnya kurang lebih akan menjadi seperti ini
Menggunakan Blok dari Elementor Library
Sekarang saatnya menambah fitur. Anda bisa membuat fitur sendiri jika mau, tapi lebih mudah menggunakan blok yang sudah ada di library Elementor.
- Klik pada tanda
dan klik Blocks. - Pada menu drop down di sisi kiri, pilih Features.
- Pilih sesuai keinginan Anda dan dapat mendeskripsikan produk Anda dengan baik, klik Insert.
Testimonial dan Ratings
Social proof penting untuk produk Anda. Gunakan Widget Testimonial atau Review agar produk Anda lebih meyakinkan.
Masukkan Testimonial Carousel Elementor dan tampilkan review produk Anda. Tidak perlu berbohong mengenai review produk karena pelanggan dapat membedakan testimonial asli dan palsu.
Dalam beberapa kasus, testimonial yang buruk malah bisa menambah kepercayaan pelanggan pada produk Anda.
Cara Membuat Tabel Harga dengan Elementor
Jika produk Anda bervariasi dan banyak, gunakan Woocommerce Plugins yang akan saya tulis tutorialnya dalam waktu dekat.
Sekarang saya akan menuliskan cara membuat tabel harga sederhana.
- Cari widget Price Table dan masukkan ke halaman Anda.
- Desain satu Price Table sesuai dengan keinginan Anda
- Buat desain price table menarik dan tampilkan fitur terbaik produk Anda. Saya sangat menyarankan untuk membuat Three Tier Pricing.
- Jika Anda tidak ingin repot seperti saya, masukkan block template seperti memasukkan feature tadi.
- Cukup ubah harga, jenis font, dan mungkin warna agar selaras dengen keseluruhan desain.
Eksperimen dengan Elementor
Website yang di desain menggunakan Elementor pada umumnya memiliki desain dan “feel” yang sama satu dengan lainnya.
Ini karena tidak banyak yang berusaha mendalami, sejauh apa Elementor dapat membuat website.
Elementor dapat membuat variasi website yang luar biasa dan saya sudah membuktikannya.
Saya sangat menyarankan jika Anda ingin memahami Elementor dan menggunakan semua fitur yang ada di dalamnya dengan baik hingga menghasilkan desain yang sangat bervariasi satu dengan lainnya, maka dedikasikan satu website untuk Anda belajar.
Tiru desain website yang memenangkan awards dengan Elementor dan munculkan kreativitas Anda.
Saya berusaha membuat tutorial website dengan Elementor setiap minggunya.
Tuliskan komentar di bawah tentang website mana yang ingin Anda tiru, dan lihat apakah kita bisa buat yang sama dengan Elementor.