Cara Instal dan Menggunakan Elementor di WordPress
Sulit Membuat Tampilan Website yang Menarik Tanpa Coding
Banyak pengguna baru WordPress merasa frustrasi karena tampilan website-nya terlihat kaku dan kurang menarik.
Template bawaan terasa membosankan, dan mengubah desain butuh pengetahuan HTML dan CSS yang tidak semua orang punya.
Akibatnya, banyak pemilik website akhirnya pasrah memakai tampilan standar — padahal desain yang bagus bisa menarik lebih banyak pengunjung dan meningkatkan kepercayaan terhadap brand.
Website yang Tidak Menarik Bisa Menurunkan Kredibilitas
Tampilan website adalah kesan pertama bagi pengunjung.
Kalau desain website kamu berantakan, susah dibaca, atau tidak mobile-friendly, maka:
- Pengunjung cepat meninggalkan situs (bounce rate tinggi).
- Peluang penjualan atau pendaftaran berkurang.
- Website terlihat tidak profesional.
Padahal, kamu tidak perlu jadi desainer web profesional untuk punya tampilan yang menarik.
Solusinya? Gunakan Elementor — Page Builder paling populer di WordPress!
Instal dan Gunakan Elementor untuk Desain Website Profesional
Elementor adalah plugin drag and drop yang memungkinkan kamu membuat tampilan website secara visual — tanpa menulis satu baris kode pun.
Kamu bisa menambahkan teks, gambar, tombol, video, dan animasi hanya dengan tarik dan lepas (drag & drop).
Yuk, simak cara instal dan penggunaannya langkah demi langkah 👇
Langkah 1: Instal Plugin Elementor di WordPress
Berikut langkah-langkah lengkapnya:
- Masuk ke Dashboard WordPress.
- Pilih menu Plugins → Add New (Tambah Baru).
- Ketik “Elementor” di kolom pencarian.
- Klik Install Now (Pasang Sekarang) pada plugin Elementor Website Builder.
- Setelah selesai, klik Activate (Aktifkan).
🎉 Selesai! Elementor sekarang sudah aktif di website kamu.
💡 Tips SEO: Pastikan versi WordPress dan PHP kamu sudah terbaru agar Elementor berjalan lancar tanpa error.
Langkah 2: Membuat Halaman Baru untuk Diedit di Elementor
Setelah instalasi selesai, saatnya membuat halaman:
- Masuk ke menu Pages → Add New (Tambah Baru).
- Beri judul halaman, misalnya “Beranda” atau “Tentang Kami.”
- Klik tombol Edit with Elementor (Edit dengan Elementor).
Tunggu beberapa detik — dan voila! Kamu masuk ke tampilan editor Elementor yang super intuitif.
Langkah 3: Mengenal Tampilan Editor Elementor
Berikut bagian-bagian penting dari tampilan editor Elementor:
- Sidebar Kiri: Berisi elemen-elemen seperti Heading, Image, Button, Video, dll.
- Kanvas Utama: Tempat kamu mendesain halaman.
- Panel Bawah: Tombol Preview, Save Draft, dan Update.
Kamu bisa tarik (drag) elemen dari kiri ke area tengah, lalu atur tampilannya sesuai keinginan.
Langkah 4: Menambahkan Elemen Desain ke Halaman
Beberapa elemen dasar yang bisa kamu tambahkan:
- Heading (Judul): Untuk membuat judul besar di halaman.
- Text Editor: Untuk menambahkan paragraf atau deskripsi.
- Image: Untuk menampilkan gambar.
- Button: Untuk membuat tombol ajakan (CTA).
- Video: Untuk menampilkan video dari YouTube.
- Icon Box: Untuk menampilkan ikon + teks singkat.
Contoh:
Kamu bisa buat tampilan “Beranda” dengan urutan:
👉 Hero Section (judul besar + gambar)
👉 Tentang Kami
👉 Layanan
👉 Testimoni
👉 Kontak
Langkah 5: Gunakan Template Siap Pakai dari Elementor
Kalau kamu ingin hasil cepat tanpa desain manual:
- Klik ikon folder (📁) di halaman editor.
- Pilih tab Pages untuk memilih template utuh, atau Blocks untuk bagian tertentu.
- Klik Insert untuk memasukkan ke halamanmu.
Kamu bisa ubah semua teks, gambar, dan warna sesuai identitas bisnismu.
💡 Tips: Gunakan template dengan desain bersih dan ringan agar website tetap cepat.
Langkah 6: Simpan dan Publikasikan Halaman
Kalau desain sudah sesuai keinginan:
- Klik tombol Update (Perbarui) di pojok bawah.
- Klik Preview Changes untuk melihat hasilnya.
🎉 Sekarang halaman WordPress kamu sudah tampil profesional berkat Elementor!
Langkah 7: Sesuaikan Tampilan Mobile (Responsif Design)
Elementor memungkinkan kamu menyesuaikan tampilan untuk:
- Desktop
- Tablet
- Smartphone
Klik ikon Responsive Mode (📱) di bawah panel editor, lalu sesuaikan ukuran font, jarak, atau layout agar tampil sempurna di semua perangkat.
Tips Menggunakan Elementor agar Website Lebih Profesional
- Gunakan maksimal 2–3 warna utama agar desain tetap konsisten.
- Pilih font dari Google Fonts yang mudah dibaca (seperti Poppins, Lato, Open Sans).
- Gunakan gambar ringan yang dikompres agar loading cepat.
- Hindari terlalu banyak animasi yang membuat halaman berat.
- Tambahkan tombol CTA (Call to Action) di bagian penting halaman.
Bonus: Plugin Pendukung Elementor yang Wajib Dicoba
| Kebutuhan | Plugin Rekomendasi | Fungsi |
|---|---|---|
| Optimasi Gambar | Smush | Kompres gambar otomatis |
| SEO | Rank Math SEO | Optimasi halaman & meta tag |
| Formulir Kontak | WPForms | Buat form tanpa coding |
| Navigasi | Elementor Header & Footer Builder | Custom header/footer mudah |
| Desain Tambahan | Essential Addons for Elementor | Tambah 100+ widget desain |
Kesimpulan
Membuat website profesional kini bisa dilakukan siapa saja — tanpa coding, tanpa ribet.
Dengan Elementor, kamu bisa mendesain tampilan website sesuai keinginan hanya dengan drag & drop.
Langkahnya sederhana:
- Instal Elementor.
- Buat halaman baru.
- Tambahkan elemen atau template.
- Atur desainnya.
- Klik “Update.”
Website kamu langsung tampil keren, cepat, dan responsif! 🚀