Desain Website Menggunakan Elementor Pro – Zero to Hero #2

🎯 Tujuan Bagian Ini

Di akhir bagian ini, kamu akan:

• Memilih dan mengaktifkan tema WordPress yang ringan

• Mengatur layout dasar agar Elementor bekerja optimal

• Menyiapkan halaman kosong sebagai “kanvas desain”

✅ Langkah 1: Pilih Tema yang Ringan dan Kompatibel

WordPress membutuhkan tema (theme) sebagai kerangka tampilan situs. Karena kita akan membangun layout dengan Elementor Pro, kita butuh tema yang:

• Ringan dan cepat

• Kompatibel 100% dengan Elementor

• Tidak menyisipkan desain yang mengganggu builder

🔝 3 Tema yang Direkomendasikan untuk Elementor:

📌 Rekomendasi: Untuk tutorial ini, kita akan menggunakan Astra, karena fleksibel, gratis, dan sangat ramah untuk pemula.

✅ Langkah 2: Install dan Aktifkan Tema Astra

1. Login ke Dashboard WordPress kamu

2. Arahkan ke menu Appearance → Themes

3. Klik tombol Add New

4. Cari “Astra” di kolom pencarian

5. Klik Install → Activate

🔗 Astra di WordPress.org

✅ Langkah 3: Set Astra agar Siap untuk Elementor

Astra punya fitur bawaan untuk menonaktifkan header/footer pada halaman tertentu, agar Elementor bisa digunakan secara penuh.

🔧 Aktifkan Plugin Astra:

1. Dashboard → Plugins → Add New

2. Cari “Astra Widgets” → Install & Activate

3. (Opsional) Install juga Astra Starter Templates jika ingin template siap pakai

✅ Langkah 4: Buat Halaman Kosong (Kanvas Elementor)

Agar Elementor bisa bekerja bebas, kita butuh halaman kosong tanpa elemen tema bawaan.

Cara Buat Halaman Kosong:

1. Dashboard → Pages → Add New

2. Nama halaman: Beranda

3. Di sebelah kanan, ubah Template menjadi:
   ➤ Elementor Canvas (halaman full kosong)
   atau
   ➤ Elementor Full Width (masih ada header/footer tema)

4. Klik Publish

5. Buka halaman tersebut → Klik Edit with Elementor

🎯 Sekarang kamu sudah punya “kanvas putih” tempat kamu mulai mendesain homepage blog kamu.

✅ Langkah 5: Atur Halaman Beranda Utama

Agar WordPress menampilkan halaman tersebut sebagai beranda, lakukan:

1. Dashboard → Settings → Reading

2. Pilih: “Your homepage displays” → A static page

3. Set Homepage ke: Beranda

4. Simpan perubahan

🔍 Tips Tambahan: Optimalkan Astra untuk Elementor

• Nonaktifkan sidebar: Appearance → Customize → Layout → Sidebar → No Sidebar

• Atur container ke “Full Width” agar layout tidak terjepit

• Ubah default font & warna di Customizer → biarkan Elementor yang atur style

✅ Checklist Akhir

• Tema Astra sudah aktif

• Halaman kosong sudah dibuat

• Elementor bisa digunakan secara penuh tanpa batasan

• Homepage sudah diarahkan ke halaman yang akan kamu desain

🔚 Penutup

Dengan tema ringan seperti Astra dan pengaturan halaman kosong, kamu sudah menyiapkan panggung yang ideal untuk mendesain blog yang indah dan fungsional.

Di bagian selanjutnya, kita akan mulai mendesain homepage blog kamu dengan Elementor Pro — dari hero section hingga daftar artikel terbaru.