Anda di halaman 1dari 9

Desain homepage

profesional.
Di chapter sebelumnya, kamu sudah sedikit utak-atik tampilan website. Apa kamu puas?
Hmm. Seharusnya belum ya. Apa yang kita coba sebelumnya, masih jauh dari tampilan
website profesional.
Itu kenapa di chapter ini kita akan coba memakai plugin page builder untuk mengubah
tampilan website.
Apa itu plugin page builder? (1)
Page builder adalah sejenis plugin yang dipakai untuk
mendesain website. Bukan cuma sembarang plugin, page
builder bisa mengubah tampilan website hanya bermodal pilih
dan klik saja.
Kamu betul-betul tak butuh pengetahuan pemrograman. Jadi,
super-duper mudah ya?
Apa itu plugin page builder? (2)
Di pasaran, ada banyak macam page builder. Mulai dari
Elementor, Beaver Builder, Site Origin, Themify, dan
sebagainya. Kamu bebas memilih manapun yang ingin dipakai.
Tapi di chapter ini, kita akan coba praktik desain
menggunakan Elementor. Dibandingkan plugin lainnya,
Elementor versi gratis memberi banyak pilihan untuk desain.
Install Elementor
Untuk install Elementor, kamu perlu klik Plugins > Add New.
Ketikkan "Elementor" di kolom pencarian. Jika sudah ketemu, klik Install Now. Tunggu beberapa saat dan klik
lagi Activate.
Jika Elementor berhasil terpasang, kamu akan lihat tampilan layar seperti ini.
Persiapan desain
Sebelum kita mulai, kita perlu mengubah tampilan depan website jadi Coming Soon atau Maintenance Mode. Kamu
nggak mau kan, websitemu yang lagi berantakan diliihat orang?
Jadi, langsung aja klik menu Elementor > Tools. Pilih tab Maintenance Mode dan cari bagian Choose Mode.
Kamu bisa memilih mode yang kamu inginkan. Lalu, jangan lupa klik Save Changes.
Memakai Elementor (1)
Oke. Langsung aja yuk cus desain homepage-mu.
Dari Dashboard, pilih menu Pages dan cari halaman yang mau kamu buat homepage. Kamu tentu bisa buat halaman
baru dengan klik tombol Add New.
Tapi di sini, kita akan pakai halaman bawaan dari tema. Langsung aja pilih salah satu halaman yang ada.
Setelah itu, kamu akan melihat tampilan yang kurang lebih seperti ini.
Tekan tombol Edit with Elementor dan tunggu loading selesai.
Memakai Elementor (2)
Begitu selesai, kamu akan lihat tampilan ini.
Sebelah kiri layarmu adalah tombol navigasi elementor. Di kanannya, kamu bisa lihat preview tampilan websitemu.
Ada banyak sekali tombol navigasi di Elementor. Biar kamu nggak kebingungan, kita pelajari dulu apa saja tombolnya.
Kuy kuy!
Memakai Elementor (3)
Pertama, Page Settings. Bagian ini bisa kamu temukan dengan klik
ikon < pada bagian kiri tulisan Elementor.
Di sini, kamu bisa atur tampilan yang akan diterapkan ke semua bagian
website. Misalnya default color, default font, dan theme style.
Kamu juga bisa mengatur desain web dengan lebih detail di Global
Settings. Jika kamu membutuhkan settings Elementor di Dashboard,
tekan saja tombol Dashboard Settings.
Lalu sisanya, di bagian More kamu akan temukan tombol navigasi
yang memudahkanmu ketika mendesain dan preview website.
Memakai Elementor (4)
Selanjutnya, kita akan lihat berbagai elemen desain Elementor.
Caranya, klik saja ikon kotak-kotak di bagian atas kanan. Kamu
bisa scroll ke bawah untuk lihat apa saja elemen yang tersedia.
Ada 3 element pada elementor yang berbayar seperti  : Pro,
WooCommerce, dan Site

Anda mungkin juga menyukai