Panduan Mudah Membuat Website di 2022

Panduan terlengkap yang mungkin belum pernah Anda temui di tempat lain.
Dibuat khusus untuk pemula.

cara membuat website pemula
Setelah menghabiskan lebih dari 2 minggu dalam pengujian, akhirnya saya berhasil menyelesaikan update panduan cara membuat website ini. Saya percaya Anda akan menyukainya :)
WIllya-Randika

By Willya Randika
Updated: January 25, 2022 / 65 Komentar


Saya menulis panduan cara membuat website ini untuk membantu pemula yang ingin bisa membuat website sendiri, tapi..

  • Tidak mau belajar coding
  • Dan tidak mau mengeluarkan uang untuk menyewa jasa web designer dan developer

Faktanya, untuk bisa membuat website, Anda tidak selalu membutuhkan hal-hal diatas.

Saya percaya sebagian besar dari Anda bisa berhasil.

Lalu, apa yang Anda butuhkan?

  1. Investasikan beberapa jam dari waktu Anda
  2. Dan ikuti panduan yang bagus

Saya sediakan nomor 2 nya, dan Anda hadirkan nomor 1 nya.

Sudah lengkap? Ayo mulai!

6 Langkah Mudah Membuat Website

Memilih Platform Website Terbaik
Langkah 1: Memilih Platform Website
Memilih domain dan hosting
Langkah 2: Memilih Domain dan Hosting
Install wordpress
Langkah 3: Menginstall WordPress via cPanel
Memilih Tema
Langkah 4: Memilih Tema Website
Kustomisasi tema
Langkah 5: Kustomisasi Tema Website
Membangun halaman menggunakan Elementor
Langkah 6: Membangun Halaman Website

Langkah 1: Memilih Platform Terbaik

Memilih Platform Website Terbaik
Ada lebih dari 100+ platform tersedia di internet. Memilih satu diantaranya adalah keputusan pertama yang perlu Anda ambil. Saya akan pandu Anda menemukan yang terbaik: mudah dipelajari, gratis dan yang sudah memiliki komunitas yang besar.

Pertama-tama, apa itu platform?

Dahulu, sekitar tahun 2004 atau 2005, membuat website itu sulit. Anda perlu setidaknya belajar CSS dan HTML untuk membuat website.

Belum lagi belajar bagaimana cara men-design websitenya sebelum meng-coding nya.

Tidak mudah, membutuhkan waktu dan mungkin Anda perlu pergi kesalah satu tempat terpencil agar bisa fokus dalam mempelajarinya 🙂

Di tahun 2021 ini, faktanya Anda bahkan tidak perlu mempelajari itu semua untuk membuat website yang dapat menambah penghasilan/penjualan Anda di dunia online, karena sebagian orang telah membuat sebuah platform yang dapat mempermudah Anda dalam membuat website.

Dengan adanya platform, Anda dapat membuat website sendiri tanpa perlu ikut pelatihan kursus.

Apa Platform Terbaik untuk Membuat Website?

Ada banyak pilihan platform yang dapat Anda pilih untuk membuat website. Jumlahnya lebih dari seratus ketika saya mengeceknya di situs W3Tech.

Menurut statistik, berikut adalah platform yang paling banyak digunakan:

Platform market share enitre traffic

Seperti yang Anda lihat dalam statistik diatas, WordPress adalah platform yang paling populer di dunia dengan jumlah market share mencapai 43%.

Pertanyaannya: Mengapa WordPress begitu populer? Karena WordPress...

  • Mudah digunakan / user-friendly
  • GRATIS dan tidak ada iklan yang akan disematkan ke website Anda
  • Memiliki komunitas yang besar
  • Website yang dibangun dengannya akan tampak responsive di semua perangkat termasuk handphone dan tablet

Bagaimana dengan platform lainnya, seperti website builder: WIX, Squarespace dan Weebly?

Mereka adalah pilihan platform yang juga bagus. Hanya saja memiliki beberapa keterbatasan, seperti:

  • Tidak gratis
  • Perlu memilih paket minimal yang seharga $8.5/bulan (WIX) untuk menghapus iklan
  • Bandwidth dan storage yang terbatas pada paket termurahnya (WIX)
  • Website yang Anda tempatkan dalam platform mereka bukan 100% milik Anda

Untuk Anda yang baru memulai, saya menyarankan menggunakan WordPress.

Saya pribadi juga menggunakan WordPress di semua website yang saya miliki (termasuk Penasihat Hosting) dan saya percaya WordPress juga akan cocok buat Anda.

Dan kabar baiknya: Anda akan belajar bagaimana cara membuat website menggunakan WordPress dalam panduan ini.


Bagaimana dengan piliihan website builder, seperti WIX dan SquareSpace?

Faktanya, Anda juga bisa menggunakan website builder seperti WIX, Squarespace dan Weebly di WordPress dengan bantuan plugin yang akan saya jelaskan lebih detail nanti pada bab 5 dalam panduan ini.

Langkah 2: Memilih Domain dan Hosting

Memilih domain dan hosting
Website itu dimulai dari sebuah nama domain - bukan design. Anda membutuhkan sebuah nama sebelum memulai membangun website Anda.

Memilih Nama Domain

Website itu dimulai dari sebuah nama domain. Bukan design.

Domain adalah nama website Anda. Sebuah alamat yang orang akan orang gunakan ketika mencoba mengunjungi website Anda melalui browser.

Misalnya, nama domain website ini adalah penasihathosting.com. 

Memiliki nama domain yang bagus adalah suatu langkah awal yang sangat penting.

Apa alasannya?

Pertama karena nama domain dapat membantu Anda membangun merek yang akan menempel di benak pelanggan atau pengunjung Anda.

Kedua, nama domain dapat membantu menentukan target pasar Anda. Contohnya domain website saya: penasihathosting.com.

Jadi, setelah memilih platform (WordPress), yang Anda butuhkan selanjutnya adalah nama domain.

Jika Anda masih bingung menentukan nama domain, berikut saya berikan beberapa tips yang semoga dapat mempermudah Anda mencari nama domain yang tepat:

  • Jika Anda berencana membuat website untuk diri Anda sendiri, maka Anda bisa menggunakan nama Anda sebagai domainnya: NamaAnda.com.
  • Jika membuat website untuk perusahaan, maka Anda juga bisa menggunakan nama perusahaan: NamaPerusahaanAnda.com.
  • Jika untuk organisasi, maka Anda bisa juga menggunakan nama organisasi, misalnya GenerasiBebasRiba.com

Dan gunakan ekstensi domain yang populer agar website Anda terlihat lebih professional, seperti:

  • .com
  • .net
  • .org (biasanya digunakan untuk organisasi)
  • .sch.id (cocok digunakan untuk website sekolah)
  • .ponpes.id (cocok digunakan untuk pesantren)
  • .co.id (untuk perusahaan yang sudah memiliki izin usaha)
  • .id (cocok untuk personal, tapi sekarang penggunannya sudah umum dan tidak hanya cocok untuk website personal saja)

Tips lainnya:

  • Hindari trademarks atau merk dagang, misalnya nama domain: reviewhpSAMSUNG.com
  • Hindari menggunakan tanda penghubung  atau nomor
  • Dan keep it simple

Oia, harga domain tidak terlalu mahal, yaitu mulai dari Rp145.000 per tahun nya.

Note: Saya akan kasih tau Anda cara mendapatkan domain gratis selama 1 tahun pada tahap selanjutnya.

Memilih Web Hosting

Web hosting adalah sebuah server untuk menyimpan data-data website secara online. Fungsinya adalah untuk menghubungkan website Anda dengan internet.

Mungkin Anda bertanya-tanya: Apa bedanya web hosting dengan domain?

Bedanya hosting dengan domain

Domain hanyalah sebuah alamat, seperti alamat rumah. Sedangkan hosting adalah rumahnya.

Tanpa adanya alamat (domain) dan rumah (hosting), orang tidak akan bisa masuk ke website Anda.

Itu sebabnya Anda membutuhkan keduanya agar website Anda bisa diakses oleh semua orang di internet dari seluruh dunia.

Anda sudah belajar bagaimana cara memilih domain. Lalu, bagaimana caranya memilih hosting?

Ada lebih dari 100 provider hosting di Indonesia. Memilih satu diantara ratusan bukan pekerjaan yang mudah. 

Memilih hosting adalah milestone terpenting pertama yang perlu Anda lalui, karena:

  • Salah-salah memilih hosting, website Anda bisa kena masalah dikemudian hari, seperti data hilang, website sering error/tidak bisa diakses, dan semacamnya
  • Salah-salah memilih hosting, website Anda bisa mudah kena malware, mudah dimasuki hacker, dan semacamnya

Pada intinya, salah memilih hosting, justru tidak akan membantu Anda dalam menghasilkan penjualan, malah cost yang akan bertambah karena Anda harus pindah-pindah provider hosting.

Masalah hosting ini cukup kompleks.

Memilih satu diantara banyaknya pilihan itu mudah-mudah sulit. Mudah menemukannya, karena memang ada banyak pilihan yang tersedia, tapi sulit untuk menemukan yang terbaik.

Untungnya, kami di Penasihat Hosting telah melakukan penelitian selama lebih dari 25 bulan terhadap 21 provider hosting paling populer di Indonesia. (baca hasil penelitian)

Tujuannya? Salah satunya, agar orang yang baru memulai membuat website seperti Anda tidak salah dalam memilih hosting.

Dan rekomendasi hosting terbaik untuk pemula berdasarkan hasil penelitian kami adalah DomaiNesia setidaknya karena 5 faktor kuat berikut:

  • Hosting atau server mereka stabil
  • Kecepatannya juga cukup bisa diandalkan
  • Supportnya bagus dan dapat diandalkan
  • Fitur yang cukup banyak
  • Plus penawaran harga yang cukup bersaing

Dapatkan Hosting dan Domain di DomaiNesia

Disclosure: Support Anda membantu website ini terus berjalan. Kami menggunakan link affiliasi, dimana kami akan menerima komisi sebesar 25% dari pembelian hosting Anda tanpa ada biaya tambahan dibebankan keapda Anda. Baca lebih lengkap.

Diskon spesial: Kami berhasil menegosiasikan harga hosting yang lebih murah. Anda cukup memasukkan kode promo: BUATWEBSITE ketika checkout untuk mendapatkan diskon 35% (berlaku ketika perpanjangan). Lumayan, bukan?

Garansi hosting: DomaiNesia menawarkan garansi hosting selama 20 hari. Jika Anda kecewa dengan layanan mereka, Anda bisa meminta refund dan uang Anda akan kembali (dikurangi biaya domain).

Saya akan pandu cara membeli hosting dan domain di DomaiNesia berikut ini:

1. Kunjungi www.DomaiNesia.com (link referral/affiliate)

Kunjungi DomaiNesia

(1) Masukkan nama domain yang Anda inginkan pada form nama domain "A better web awaits.."
(2) Jika domain yang Anda pilih tersedia, klik tombol "Pesan paket hemat". 

Jika tidak tersedia, silahkan mencari nama domain lain nya atau pilih ekstensi yang berbeda (.com, .id, .net, .org, dll).

2. Isi detail pembelian paket hosting

(1) Pilih paket hosting Anda. Saran saya adalah paket Super (2GB) dan Anda akan mendapatkan gratis domain selama satu tahun.
(2) Lokasi server boleh Anda pilih Singapore atau Jakarta. Keduanya bagus, tapi saya prefer Singapore.
(3) Pilih siklus pembayaran hosting. Jika Anda memilih 1 tahun, maka Anda akan mendapatkan gratis 1 domain.
(4) Pastikan bahwa nama domain Anda sudah benar. Perhatikan setiap karakternya, karena jika salah, nama domain tidak bisa di ganti jika sudah aktif.
(5) Ceklis Addons: DNS Zone Manager (Gratis)
(6) Masukkan alamat email Anda untuk pembuatan account DomaiNesia
(7) Klik tombol warna hijau "Masukkan ke Troli"

Order hosting di DomaiNesia

3. Masukkan kode promo untuk mendapatkan diskon lebih besar

Kode promo: BUATWEBSITE  (Diskon 35% dan berlaku untuk perpanjangan.)

Harga total yang harus Anda bayarkan jika sebelumnya Anda memilih paket "Super" harusnya adalah Rp 368.940 setelah mengaplikasikan kode promo kami.

Jika sudah benar, klik tombol "DAFTAR".

masukkan kupon BUATWEBSITE

4. Isi Data Diri

Isi nama depan dan belakang, institusi, email, dan password. 

Isi detail informasi tambahan

Dilanjutkan dengan mengisi alamat, nomor telepon.

Dan sebelum mengklik tombol warna hijau "Sign Up", pastikan sekali lagi bahwa semua informasi yang Anda masukkan sudah benar.

Jangan asal-asalan mengisi data diri Anda.

Isi alamat

Jika sudah benar, akan muncul pemberitahuan bahwa pendaftaran telah berhasil.

Klik tombol "Selesaikan & Bayar".

Pendaftaran berhasil

Langkah 3: Menginstall WordPress di cPanel Hosting

Install wordpress
Install WordPress di cPanel hosting itu mudah. Prosesnya engga ribet dan hanya membutuhkan waktu kurang dari 5 menit saja.

Anda sudah memiliki 2 amunisi dasar untuk membangun website, yaitu domain dan hosting.

Sekarang adalah saatnya untuk membuat website Anda online agar bisa diakses oleh semua orang di internet.

Hal pertama yang harus Anda lakukan adalah menginstal platform WordPress di hosting Anda.

Ada dua cara menginstall WordPress:

  1. Cara otomatis (one click installation)
  2. Cara manual

Kita akan gunakan cara yang paling mudah, yaitu menggunakan fitur One Click Installation (install dengan 1x klik) di cPanel hosting.

Menginstall WordPress Menggunakan Fitur One Click Installation

Hampir semua penyedia hosting menyediakan fitur One-Click Installation untuk menginstal WordPress di dalam control panel hosting.

Jika Anda memilih hosting yang bagus, Anda akan menemukan fitur ini dalam cPanel hosting Anda.

Pada contoh ini, saya menggunakan provider hosting DomaiNesia

Bagaimana jika Anda menggunakan provider hosting yang berbeda? Jangan panik, karena pengaturan nya tidak akan jauh berbeda.


1. Log in ke akun DomaiNesia Anda

atau klik link login berikut: https://my.domainesia.com/signin/

Masukkan username dan password yang sudah Anda buat pada saat mengisi form pendaftaran akun DomaiNesia sebelumnya.

1

Kemudian, klik bagian yang saya kotaki warna merah atau klik bagian products.

Klik bagian products

2

Lalu, klik pada tab "Access".

Klik pada tab Access

3

Dan klik login to cPanel.

Klik log in to cPanel

4

Anda sudah masuk ke cPanel.

Beginilah tampilan cPanel hosting DomaiNesia Anda.

Tampilan cPanel DomaiNesia

2. Pastikan Domain Anda Sudah Menggunakan SSL 

Sebelum masuk ke langkah menginstall WordPress, ada satu hal penting yang harus Anda lakukan agar website Anda terlihat professional, yaitu menginstall SSL.

Jika menggunakan SSL, maka koneksi ke website Anda akan aman, seperti ini:

Menggunakan SSL

Jika tidak menggunakan SSL = tidak aman.

Di browser Chrome, website Anda akan di labeli sebagai "Not Secure".

Tidak menggunakan SSL

Anda tidak mau website Anda terlihat tidak aman seperti diatas, bukan?

Lalu, bagaimana cara nya menginstall SSL pada website baru Anda? Caranya mudah.

Perhatikan di bagian sebelah kanan atas dari cPanel Anda, apakah primary domain Anda sudah "DV Certificate" berwarna hijau?

Perhatikan DV Certificate

Pada dasarnya, di DomaiNesia SSL sudah aktif secara otomatis. Jika belum, primary domain Anda akan diberi keterangan "No Valid Certificate".

Cara memperbaiki nya:

1

klik tombol icon obeng seperti yang saya tunjukkan di bawah ini:

Install SSL di DomaiNesia

2

Kemudian, ceklis pada bagian nomor (1), dan klik tombol 'Run AutoSSL" pada bagian nomor (2).

Ikuti 2 langkah berikut

3

Cek kembali di home cPanel, konfirmasi apakah primary domain Anda sudah "DV Certificate" atau belum.

Jika sudah, silahkan lanjut ke langkah ketiga.

Perhatikan DV Certificate

3. Redirect HTTP ke HTTPS (Bagus untuk SEO)

Agar domain selalu menggunakan https (secure dan bagus untuk SEO), maka Anda harus melakukan redirect dari http ke https, jika tidak, maka orang lain dapat mengakses dua versi dari website Anda. 

Satu yang http (not secure)
Satu lagi yang https (secure/karena sudah terinstall SSL)

Karena itu, Anda perlu melakukan redirect http ke https.

Di cPanel, Anda dapat dengan mudah melakukan redirect ini dengan 1x klik saja.

Ada beberapa cara, tergantung provider hosting dan control panel yang Anda gunakan:

1. Jika menggunakan DomaiNesia

1

Klik Nginx pada cPanel

Klik pada bagian Nginx

2

Kemudian klik tab "Force HTTPS" dan klik tombol "Enable" seperti yang saya contohkan pada gambar dibawah.

redirect http ke https

2. Jika menggunakan provider lain (selain DomaiNesia)

1

Klik pada bagian Domains.

Klik Domains

2

Lalu klik klik tombol yang saya arahkan pada gambar dibawah.

Redirect http to https

4. Kembali Ke Tutorial Cara Menginstall WordPress

1

Cari dan klik logo WordPress atau bila tidak ada, pilih Softaculous Apps Installer

Pilih scripts WordPress

2

Klik tombol biru "Install Now"

Klik tombol Biru Install Now

3

Kemudian, Isi informasi yang dibutuhkan. Ikuti petunjuk pada gambar dibawah ini:

install WordPress di cPanel Hosting

Jangan lupa mengisi admin email dengan email aktif Anda. Ini bisa digunakan juga untuk melakukan reset password jika Anda lupa suatu saat nanti.

Tunggu sekitar 1-3 menit hingga WordPress terinstall dengan sempurna.

WordPress sedang diinstall

Jika sudah terinstall:

Website WordPress sudah berhasil diinstall

Melakukan Sedikit Penyesuaian Pada Website WordPress Baru

Oke, sekarang Anda sudah berhasil menginstal WordPress. Website Anda sudah bisa diakses oleh semua orang di internet.

Anda bisa coba buka website Anda dengan mengetik nama domain Anda di browser. Misalnya: penasihathosting.com di address bar Google Chrome.

Tetapi, saat ini website Anda masih terlihat baru dan kosong.

masih kosong

Sebelum mengisi nya dengan konten, Anda perlu mengurus beberapa hal penting terlebih dahulu untuk membuat website terlihat siap.

1

Log in ke Dashboard WordPress Anda

Apabila Anda tidak yakin bagaimana caranya, ketik: http://domainanda.com/wp-admin/ 

(ganti "domainanda.com" dengan nama domain Anda). 

Log in ke WordPress

Masukkan username atau alamat email dan password (yang Anda buat pada saat menginstal WordPress).

Ketika Anda sudah log in, beginilah tampilan dashboard WordPress Anda:

Dashboard WordPress

2

Ganti Judul dan Tagline Website Anda

Judul dan tagline adalah bagian pertama yang perlu Anda sesuaikan.

Buatlah judul dan tagline yang mencerminkan isi website Anda.

Sebagai contoh, judul website ini adalah "Penasihat Hosting" dan taglinenya adalah "Review Penyedia Layanan Web Hosting Terbaik".

Bagaimana caranya mengganti judul dan tagline?

Pada dasboard WordPress Anda, klik Settings -> General.

Mengganti judul dan tagline

Bingung menentukan judul dan tagline?

Jika Anda tidak yakin mau menulis apa, berikut saya berikan 4 tips jitu yang dapat membantu Anda:

  • Jika Anda membuat website untuk tujuan branding bisnis/usaha, Anda dapat menggunakan judul yang sama atau identik dengan nama domain Anda. Sebagai contoh, judul halaman Google adalah Google dan Facebook adalah Facebook.

  • Gunakan deskripsi yang menggambarkan website Anda secara keseluruhan dan gabungkan dengan nama domain Anda. Sebagai contoh, judul halaman website Tokopedia adalah "Jual Beli Online Aman dan Nyaman - Tokopedia".

  • Tanyakan pada diri Ada: "Apa tujuan website Anda?" Apa yang ingin Anda capai melalui website Anda?Anda dapat menggunakan tujuan atau yang ingin Anda capai sebagai judul dan tagline website Anda.

  • Jika Anda membuat blog personal, Anda dapat menggunakan nama Anda sendiri sebagai judul blog dan profesi Anda sebagai tagline.

3

Pastikan Website Anda Search Engine Friendly (SEO)

Ada tiga poin penting yang perlu Anda pertimbangkan ketika menyiapkan website Anda agar search engine friendly (bagus SEO nya).\

Untungnya, ketiga poin ini sangat mudah dilakukan di WordPress.

1. Jangan gunakan format yang panjang dan tidak penting pada struktur URL Anda.

Yang dimaksud struktur URL itu adalah yang seperti ini: 

http://domainanda.com/2017/02/01/category/cara-membuat-blog

Sebenarnya, engga salah menggunakan struktur URL tersebut, tapi mesin pencari tidak menyukai struktur yang panjang seperti contoh diatas.

Sebaiknya gunakan struktur URL yang pendek dan hindari penggunaan tanggal.

http://domainanda.com/cara-membuat-website

Bagaimana caranya agar struktur URL website Anda dapat seperti contoh yang benar diatas?

Klik Settings > Permalinks, lalu pilih 'post name' dan simpan pengaturan Anda.

pilih permalinks post name

2. Jangan blok mesin pencari untuk membaca dan me-crawl website Anda.

Klik Settings > Reading.

Scrool mouse Anda kebagian paling bawah.

Pastikan bahwa Anda TIDAK mencentang search engine visibility, jika Anda mencentangnya, maka website Anda sama sekali tidak akan terindex oleh mesin pencarian Google, Yahoo, Bing dan lainnya.

3. Jangan biarkan komentar spam mudah masuk ke website Anda

Faktanya, ada jutaan orang di internet yang gemar meninggalkan komentar spam untuk mengiklankan produk atau jasa mereka.

Klik Settings > Discussion dan pastikan Anda mencentang kedua pilihan dibawah ini:

moderasi-komentar

4

Hapus konten default WordPress [Seperti: Hello World, dan Sample Page]

Konten-konten yang perlu Anda hapus:

  • Hapus "Hello World" di bagian "Posts"
  • Hapus "Sample Page" di bagian "Pages"

Arahkan kursor Anda ke judul artikel agar pilihan Edit | Quick Edit | Trash | View muncul.

hapus post

Langkah 4: Memilih Tema WordPress

Memilih Tema
Buat informasi saja, WordPress memiliki 6.000+ tema gratis yang telah dirancang professional dalam database mereka. Anda bisa menjelajahinya seperti seorang anak kecil di dalam toko permen.

Website Anda masih kosong, Anda perlu membuat beberapa halaman, seperti halaman depan (home), tentang, kontak, dsb.

Juga, Anda perlu memilih tema website.

Di langkah 4 ini, saya juga akan pandu Anda memilih tema WordPres terbaik untuk apapun kebutuhan Anda.

Bagaimana Caranya Memilih Tema Website?


1

Akses tema gratis WordPress

Klik Appearance Themes dan klik tombol "Add New" untuk mengakses tema gratis yang ada di WordPress.

Cari-tema-gratis-di-WordPress

Dan boom! Anda memiliki akses ke lebih dari 6.000+ tema gratis WordPress!

Sekarang Anda bisa menelusuri berbagai pilihan tema seperti seorang anak kecil di toko permen.

pilih-tema-WordPress

2

Pilih tema WordPress Anda

Sampai disini, saya perlu memberitahu Anda bahwa sebelum merampungkan panduan ini, saya sudah mencoba berbagai tema WordPress populer yang menurut saya mudah untuk digunakan bagi siapapun dan apapun tujuannya.

Tema-tema populer seperti:

  • Astra (1 juta+ telah terinstall)
  • OceanWP (700rb+)
  • Kadence (100rb+)
  • GeneratePress (400rb+)
  • Blocksy (50rb+)
  • Dan Neve (300rb+)

Setelah mencoba semuanya, saya sampai kepada kesimpulan bahwa, yang:

  • Gratis
  • Mudah digunakan untuk pemula
  • Mudah dikustomisasi
  • Cepat dan SEO friendly

Adalah Astra.

Note:

  • Anda bisa memilih tema lainnya jika Anda mau. Tapi, rekomendasi saya tidak akan jauh-jauh dari 6 tema yang telah saya sebutkan diatas.
  • Semua tema yang saya sebutkan diatas bentuknya adalah freemium. Artinya, Anda bisa menggunakannya secara free/gratis, tapi jika Anda ingin fitur yang lebih banyak, Anda harus membayar biaya untuk upgrade ke premiumnya.
  • Astra dalam pengujian saya adalah tema gratis yang powerfull. Anda bahkan tidak perlu upgrade ke premium untuk membuat website yang bagus.

Anda bisa menambahkan tema Astra langsung dari dashboard WordPress Anda.

Ketik Astra pada kolom pencarian disebelah kanan atas.

install tema Astra

Kemudian arahkan kursor Anda ke thumbnail Astra dan tombol install akan muncul.

Klik tombol "install" lalu "Activate".

Dan begitu Anda klik tombol "Activate", maka tema sudah aktif.

Great job!

Jika sudah Anda install, maka sekarang saatnya membuat koten halaman di website Anda.

Konten di halaman-halaman seperti:

  • Home 
  • Tentang Kami 
  • Layanan Kami 
  • Kontak Kami 
  • Blog 
  • Testimonial 

Atau apapun halaman yang Anda butuhkan.


Bagaimana saya dapat membuat halaman baru dan menambahkan artikel?

Faktanya, menulis konten di WordPress itu mudah.

Tapi, ada yang perlu Anda ketahui sebelumnya, yaitu WordPress punya 2 tempat yang bisa Anda gunakan untuk menambahkan konten.

Ada Posts dan ada Pages.

Anda mungkin bertanya-bertanya:

"Mengapa ada 2 tempat? Lalu apa bedanya antara Posts dan Pages? (Penting untuk diketahui sebelum Anda lanjut ke tahap selanjutnya, jadi saya sarankan untuk tidak meloncati bagian ini).

post-dan-pages-di-WordPress

Post dan Pages memang terlihat mirip, namun memiliki fungsi yang berbeda.

  • Post digunakan untuk menerbitkan artikel yang sifatnya rutin di website Anda. Sebagai contoh, jika Anda ingin menerbitkan artikel seminggu sekali atau seminggu dua kali, maka sebaiknya Anda menulisnya dalam bentuk Post.

    Selain itu, Post juga dapat dibagi berdasarkan kategori.

    Katakanlah Anda memiliki website tentang berita, dan Anda mempunyai artikel-artikel tentang berita teknologi, berita politik, berita olahraga memanah, berita pendidikan, dan lain-lain.

    Maka Anda dapat memasukkannya kedalam kategori agar lebih mudah dicari oleh pengunjung.

  • Sedangkan Pages sifatnya adalah tetap atau statis. Halaman-halaman yang dibuat dalam bentu Pages tidak dapat dimasukkan dalam kategori.

    Contoh halaman yang biasa dibuat menggunakan Pages adalah halaman home, tentang kami, kontak kami, testimonial, produk kami, visi/misi, dsb.

Cara menambahkan Pages

Jika Anda ingin membuat halaman 'Tentang Kami', 'Kontak Kami', 'Visi/Misi', dsb maka Anda harus menulisnya dalam bentuk Pages.

Caranya sebagai berikut:

1

Di sidebar sebelah kiri pada layar Anda, klik Pages -> Add New.

klik-pages-dan-add-new-untuk-menambahkan-pages-baru

2

Dan ini adalah tampilan WordPress pages editor.

WordPress editor

Sampai disini, Anda hanya perlu mengisi judul halaman saja kemudian langsung klik tombol "Publish".

(Spoiler: Karena saya akan ajak Anda untuk mendesain halaman website menggunakan plugin Elementor(?) nanti pada bab selanjutnya).

Jadi, biarkan saja apa adanya dulu kosong seperti ini.

Buat halaman kosong terlebih dahulu

Jika sudah klik publish, Anda bisa mengklik tombol logo WordPress seperti gambar dibawah ini untuk kembali ke halaman dashboard WordPress.

Klik untuk kembali ke halaman dashboard WordPress

3

Jika Anda ingin membuat beberapa halaman.

Katakanlah: Halaman depan (home), halaman tentang kami, kontak kami, blog (halaman yang berisi artikel-artikel yang dibuat dalam bentuk post), dsb.. maka buatlah halaman tersebut dan biarkan kosong apa adanya.

halaman-di-website-WordPress


Dan Bagaimana Cara Menambahkan Halaman/Pages Kedalam Menu?

Sebelum kita mendesain halaman-halaman yang sudah dibuat barusan, sebaiknya Anda tambahkan halaman-halaman tersebut ke dalam menu website.

Perhatikan menu pada gambar website dibawah ini:

Menambahkan menu website

Caranya juga mudah.

1

1. Klik Appearance > Menu

menu

2

Ikuti langkah demi langkah nya dibawah ini untuk membuat menu website Anda.

membuat menu navigasi
  1. Buat nama menu website Anda. Boleh apa saja, karena tidak akan mempengaruhi apapun
  2. Klik tombol "Save Menu" 
  3. Tambahkan halaman yang sudah Anda buat sebelum nya ke dalam struktur menu dengan men-centang/ceklis nya. Misalnya, Anda ingin menambahkan halaman Home, Tentang dan Kontak. Anda juga bisa menambahkan menu di dalam posts atau membuat custom links.
  4. Kemudian klik tombol 'Add to Menu'. Maka semua halaman yang Anda centang akan muncul di struktur menu.
  5. Atur menu sesuai keinginan dengan cara drag & drop. Ingat bahwa Anda juga bisa membuat sub menu seperti contoh saya diatas.
  6. Centang 'Header Menu 1"
  7. Terakhir, klik tombol 'Save Menu' kembali (untuk kedua kalinya)

Sampai pada tahap ini, Anda bisa cek apakah menu website yang baru Anda buat sudah tampil di website Anda.

Langkah 5: Melakukan Penyesuaian pada Tema Astra Anda

Kustomisasi tema
Astra merupakan tema yang mudah dikustomisasi dan salah satu dari tiga tema favorit saya selain GeneratePress dan Blocksy.

Sebelum lanjut ke langkah terakhir, yaitu mendesain halaman kosong (home, tentang, kontak, dsb) yang sudah Anda buat sebelumnya, Anda perlu melakukan sedikit penyesuaian pada tema Astra terlebih dahulu, agar bisa sesuai seperti yang Anda inginkan.

1. Membuat Halaman Statis di Homepage

Halaman statis adalah halaman yang tidak pernah berubah.

Jadi, "statis" akan menampilkan konten atau artikel yang sama setiap kali seseorang datang ke website Anda.

Contohnya adalah halaman depan (www.penasihathosting.com), kapanpun Anda mengunjunginya dan seberapa seringpun saya menulis artikel baru, halaman statis ini tidak akan pernah berubah.

homepage Penasihat Hosting

Bagaimana cara membuat halaman statis?

Buka appearance > Customize. 

Klik "Homepage Settings" pada bagian sebelah kiri Customize.

Lalu atur sebagai "A Static page", kemudian pilih Homepage = Home (Halaman depan kosong yang sudah Anda buat sebelumnya).

dan Posts page = Blog. 

Cara membuat halaman statis di WordPress

Post Page ini sifatnya opsional, namun jika Anda ingin menulis artikel yang sifatnya rutin maka Anda perlu membuat halaman Post page yang menampilkan artikel-artikel yang sudah Anda terbitkan di website.

Jika Anda belum membuatnya, Anda bisa kembali untuk membuat halaman kosong baru dan beri judul sebagai Blog.


2. Kustomisasi Global Website

Ini termasuk bagian yang paling terpenting dari semua rangkaian proses membuat website, yaitu menentukan dari awal global website Anda.

Mulai dari apa font yang Anda gunakan, warna hingga layout website Anda. 

Kita akan mulai dari menentukan typography.

2.1

Menentukan Typography

Buka Global > Typography

Secara default, font tema Astra yang Anda gunakan menggunakan system font. Secara performance, system font adalah font yang paling cepat.

Tapi, jika Anda ingin menggantinya yang lebih fancy, Anda bisa memilih font lainnya.

(1) Anda bisa memilih satu diantara enam font yang telah direkomendasikan oleh Astra pada bagian "Presets"
(2) Atau memilih font sendiri dari daftar font yang ada di bagian "Body Font Family"
(3) Tentukan size body font Anda. Saran saya jangan gunakan font lebih kecil dari 16.

Typography

Untuk pengaturan yang lain, saya rasa tidak perlu diubah-ubah dahulu.

2.2

Menentukan Warna Website

Buka Global > Colors

Salah satu ciri website yang bagus adalah konsisten terhadap warna. Saya menyarankan untuk tidak menggunakan kombinasi warna yang banyak, misalnya lebih dari 6 warna. 

Lebih sedikit lebih baik.

Misalnya, Facebook identik dengan warna biru. 
Tokopedia identik dengan hijau. 
Youtube identik dengan warna merah.

Secara default, Astra menggunakan kombinasi warna biru, hitam dan putih. Anda bisa memilih warna lainnya.

Jika Anda bingung memilih kombinasi warna, Anda bisa mengunjungi situs berikut untuk mencari inspirasi warna:

Global Palette

2.3

Menentukan Container

Buka Global > Container

(1) Container width adalah lebar website Anda. Semakin tinggi nilainya maka semakin lebar website Anda. Saran saya biarkan default saja (1200px)
(2) Ini adalah model layout secara default. Jika Anda memilih contain boxed, maka secara default semua layout, baik page dan blog akan memiliki layout yang contained boxed.
(3) Biasanya halaman Pages layoutnya full width, tapi saya serahkan kepada Anda bentuk layout nya sesuai dengan keinginan Anda.

Menentukan container

3. Kustomisasi Header Website

Jika Anda tidak yakin mana yang disebut header, perhatikan gambar dibawah ini:

Header website

Sampai disini, Anda mungkin ingin mengganti nama website Anda menjadi gambar logo website Anda atau mengganti nya dengan nama lain.

Anda mungkin juga mau mengganti warna background header dari putih menjadi hitam, atau ingin merubah posisinya berada di sebelah kanan, kiri, atau tengah, dsb.

Kita akan mencoba satu per satu fungsi Header Builder mulai dari sini.

Anda bisa berkreasi sebebas yang Anda mau.


3.1

Menambahkan Logo Website

Ini sifatnya masih optional.

Jika Anda sudah memiliki logo website, Anda bisa mengganti logo text dari logo berbentuk text menjadi logo bergambar.

Caranya buka Header Builder > dan klik Site Title & Logo seperti yang saya tunjukkan dalam gambar dibawah ini:

Mengganti site title dan logo

Kemudian ikuti langkah-langkah berikut:

Kustomisasi logo website

(1) Klik 'Select Logo' untuk upload logo Anda
(2) Atur lebar logo Anda. Misalnya 150, 200, dll..
(3) Anda mungkin ingin menyembunyikan judul text website Anda
(4) Jika Anda ingin menggunakan logo text, Anda bisa merubah text nya dengan nama lain, misal My Blog
(5) Jika Anda ingin mensejajarkan logo gambar dengan logo text Anda
(6) Jika Anda ingin menggunakan tagline

Jika sudah selesai klik tombol "Publish" berwarna biru yang terletak di bagian kiri atas layar Anda.

3.2

Merubah warna background navigation

Secara default, warna background header tema Astra adalah putih.

Mungkin Anda ingin merubahnya menjadi warna merah, hijau, biru atau apapun warna yang Anda inginkan.

1

Buka Header > Arahkan kursor Anda ke bagian logo seperti gambar dibawah dan klik Main Row

merubah warna background header

2

Klik tab "Design" (yang saya lingkari warna merah).

Kemudian klik icon background dan pilih warna background Anda.

Mengganti warna background

3.3

Merubah posisi logo dan menambahkan element di dalam header

Untuk merubah-rubah posisi suatu element, baik logo, menu, search dan lain-lain itu sangat mudah dilakukan di tema Astra.

Perhatikan video gif dibawah ini. Anda hanya perlu melakukan drag & drop saja.

Drag and drop header builder Astra


Anda bisa menambahkan apapun di dalam header Anda, seperti button, kolom pencarian (search), secondary menu, dan lain-lain.

Sampai disini, Anda bebas meng-explore bagian-bagian lainnya dari tema Astra Anda.

Namun, pastikan sebelum lanjut ke bab terakhir,  Anda mengklik tombol "Publish" yang ada di sebelah kiri atas agar semua perubahan yang Anda lakukan tersimpan.

Langkah 6: Membangun Halaman Website dengan Plugin Page Builder

Membangun halaman menggunakan Elementor
Langkah 6 merupakan inti dari panduan cara membuat website ini. Saya ucapkan selamat karena Anda telah sampai disini. Great job! Yang bisa saya katakan adalah langkah terakhi ini adalah yang paling menyenangkan diantara semuanya.

Masih ingat dengan halaman-halaman kosong yang Anda buat pada langkah sebelumnya?

Sekarang saatnya Anda membangun halaman-halaman kosong tersebut.


Membangun Halaman Dengan Plugin Page Builder

Ada dua cara untuk membangun halaman di WordPress.

Pertama, cara yang membutuhkan pengetahuan coding: CSS, HTML, PHP dan JavaScript (cara tersulit).

Kedua, menggunakan cara yang mudah (drag & drop) -> cara yang akan Anda gunakan dalam panduan ini. 

Masih ingat bagaimana Anda menggunakan fitur drag & drop ketika melakukan kustomisasi pada header website Anda?

Mudah bukan? Kira-kira seperti itulah cara bagaimana Anda akan membangun website membangun plugin Page Builder. 

Atau jika sebelumnya Anda telah mencoba platform website builder seperti WIX dan Squarespace, maka Anda juga tidak akan merasa asing ketika mencoba plugin page builder di WordPress.

Faktanya, saya pun dalam membangun panduan cara membuat website ini juga menggunakan plugin page builder (drag & drop).

Saya bahkan tidak punya latar belakang IT dan saya percaya Anda juga pasti bisa melakukannya.


Memilih Page Builder Terbaik yang Newbie-Friendly

Sama seperti ketika memilih tema Astra, sebelum memilih plugin Page Builder, saya juga sudah mencoba berbagai pilihan populer, seperti Elementor, Beaver, dan Brizy. Tidak lupa saya juga mencoba Gutenberg Editor seperti Kadence Block.

Setelah menghabiskan berjam-jam mencoba berbagai page builder, saya sampai pada kesimpulan dimana plugin Page Builder Elementor adalah yang paling tepat untuk pemula, karena dua alasan:

  • Mudah digunakan untuk pemula sekalipun (User-Friendly)
  • Versi gratisnya sudah cukup powerfull dan dilengkapi denagn fitur-fitur yang banyak
  • Telah diuji coba secara intensif dan load time pada bagian backend nya cepat di paket shared hosting termurah DomaiNesia
Elementor Page Builder

Saya percaya Anda akan menyukai bagaimana membangun halaman-halaman website Anda menggunakan Elementor.

Faktanya, Elementor Page Builder adalah plugin yang sangat populer.

Saat ini sudah di install lebih dari 5 juta kali dan mendapatkan lebih dari 5.000 rating 5. Anda menggunakan plugin yang tepat.

Untuk memulainya, silahkan ikuti dua langkah beirkut ini:

1

Install plugin Elementor Page Builder.

Buka Plugins > Add New > Cari "Elementor" dalam kotak pencarian.

Kemudian klik tombol "Install Now" dan "Activate" hingga muncul pesan "Plugin Activated".

Install-plugin-Elementor

2

Install plugin pendukung.

Anda membutuhkan plugin pendukung untuk Elementor. Gunanya adalah untuk menambah fungsi pada plguin Elementor yang Anda gunakan menjadi lebih banyak, sehingga memudahkan Anda dalam membuat website.

Dari hasil pengujian beberapa plugin pendukung gratis terbaik untuk Elementor, saya sampai pada kesimpulan bahwa plugin Starter Templates dari Brainstorm Force adalah yang paling bagus.

Plugin Starter Templates ini adalah plugin yang dibuat oleh tim yang sama dengan yang membuat tema Astra.

Jadi, kombinasi antara tema Astra + plugin page builder Elementor + plugin pendukung Starter Templates adalah pilihan yang tepat dan merupakan yang terbaik berdasarkan pengujian yang saya lakukan.

Buka bagian Plugins kembali > Add New > Cari "Starter Templates" dalam kotak pencarian.

Kemudian klik tombol "Install Now" dan "Activate" hingga muncul pesan "Plugin Activated".

plugin starter templates

Membangun Halaman Depan (Home)


1. Persiapan

Buka Pages.

Lalu Edit halaman depan Anda, dalam contoh ini saya memberikan judul halaman depan sebagai Home.

edit-halaman-depan

Kemudian, ikuti langkah-langkah pengaturan berikut untuk mempersiapkan halaman Anda sebelum meng-edit nya dengan plugin Elementor.

1

Klik icon Astra yang terletak di sebelah atas kanan dari layar Anda

klik icon Astra

2

Atur pengaturan halamannya sebagai berikut:

(2) Ubah Sidebar menjadi No Sidebar
(3) Ubah Content Layoutnya menjadi Full Width / Stretched
(4) Dan pilih Disable Title

Pengaturan halaman nya

3

(5) Klik tombol Update
(6) Kemudian, klik tombol warna biru “Edit with Elementor”

edit with Elementor

Anda akan digiring ke halaman Elementor Page Builder.

Disinilah tempat Anda membangun halaman-halaman pada website WordPress Anda.

Membangun halaman dengan Elementor

2. Mengenal User Interface Elementor Page Builder

Seperti yang Anda lihat pada gambar dibawah, terdapat 2 bagian: kiri (bagian berwarna hijau) dan kanan (bagian berwarna merah) yang agak-agak mirip seperti fitur Customizer yang sudah Anda gunakan sebelumnya.

mengenal user interface Elementor

Di bagian kiri terdapat widget-widget yang bisa Anda gunakan, seperti:

  • Widget heading untuk membuat Judul halaman, 
  • Widget image untuk menambahkan gambar,
  • Widget button untuk membuat tombol,
  • Widget icon untuk menambahkan icon, dan lain-lain.

Sedangkan di bagian kanan adalah halaman yang akan Anda bangun. Cara menambahkan widget ke dalam halaman adalah dengan cara drag & drop. Sama seperti ketika Anda menggunakan header dan footer builder dari tema Astra sebelumnya.

3. Membangun Halaman menggunakan Elementor Page Builder

Mulai dari sini, Anda mungkin akan menghabiskan lebih banyak waktu membangun halaman menggunakan Elementor Page Builder. 

Bagian ini menurut saya adalah yang paling menyenangkan, karena caranya cukup mudah, dan ada cukup banyak template dan block gratis yang disediakan oleh Elementor untuk membantu Anda dalam membangun halaman.

Ohiya, ada dua cara membangun halaman:

Pertama dan cara termudah adalah menggunakan template jadi, Anda cukup melakukan modifikasi saja.

Kedua, mendesain halaman dari nol. Ini  bukanlah cara yang bagus buat pemula. 

Jadi, di dalam panduan ini saya akan pandu Anda menggunakan cara pertama, yaitu menggunakan template yang sudah ada dan memodifikasinya.


3.1 Menggunakan template yang Sudah Ada

Ikuti langkah-langkah berikut:

1

Klik icon icon seperti yang ditunjukkan dalam screenshoot dibawah ini.

klik icon starter templates

Kemudian akan muncul.. Kita akan sebut ini sebagai Template Library, yaitu sebuah tempat dimana Anda bisa mencari template, baik itu template pages (sebuah template jadi) dan blocks (template per bagian).

template library

Template library ini disediakan oleh plugin Starter Templates yang telah Anda instal sebelumnya.

Mungkin muncul pertanyaan di benak Anda: 

Mengapa tidak menggunakan template yang telah disediakan langsung oleh Elementor saja?

Karena tidak banyak pilihan yang gratis. Saya sudah mengeceknya dan mereka seperti memaksa Anda untuk upgrade ke versi PRO untuk menggunakan semua template yang mereka buat.

Itulah alasan terbesar saya mengapa memilih untuk menggunakan plugin pendukung seperti Starter Templates, yaitu untuk memudahkan Anda ketika sedang membangun halaman website.

Template library dari Starter Templates memiliki dua buah template, yaitu yang bentuknya Pages dan yang bentuknya Blocks.

Apa bedanya template pages dan blocks?

Pages adalah template jadi. Lengkap. Biasanya terdiri dari kumpulan dari bagian: 

  • Hero
  • Feature
  • Price
  • Testimonials
  • Team

Sementara blocks adalah bagian-bagian dari template jadi diatas. 

Misalnya, Hero adalah block.
Feature adalah block.
Testimonials adalah block.

2

Kembali ke template library tadi. 

Cari template yang Anda sukai atau yang cocok dengan kebutuhan website Anda. 

Pertama-tama, Anda bisa filter pencarian dengan hanya menampilkan template yang free alias gratis saja.

filter template
Per 5 Januari 2022 ketika saya sedang meng-update panduan cara membuat website ini, saya hitung ada sekitar 99 template pages gratis yang tersedia.

Atau Anda juga bisa mencari dengan memasukkan keyword tertentu di kotak pencarian, seperti: business, organic, clean, cv, dan lain-lain.

Cari menggunakan keyword

Misalnya, saya ingin menggunakan template "Love Nature" ini.

Note: Anda bisa memilih template yang lainnya, tidak perlu sama dengan ini. Carilah template yang sekiranya cocok dengan kebutuhan website Anda.

Kemudian, saya klik gambarnya.

Memilih template yang cocok

Akan muncul beberapa pilihan dari template "Love Nature". Karena saat ini Anda sedang membangun halaman home, maka klik template yang "Home".

preview templates

Sebelum template dimasukkan ke dalam halaman home, Anda bisa melihat terlebih dahulu layout penuh dari template home yang Anda pilih tadi.

preview template sebelum dimasukkan ke halaman

4. Memodifikasi Template

Nah, sekarang Anda sudah memiliki template dan Anda mungkin sudah siap untuk melakukan modifikasi dari template yang Anda pilih.

Saya akan pandu Anda untuk memodifikasi beberapa elemen penting yang menurut saya paling Anda butuhkan:

1

Membuat layout section menjadi full width

Ketika Anda memasukkan template ke halaman, Anda mungkin menyadari bahwa section bagian atas (istilahnya dalam web design adalah "Hero") atau section-section lainnya memiliki lebar yang tidak full seperti yang tampil dalam screenshoot dibawah:

Menggunakan template Love Nature dari Starter Templates

Anda bisa membuat lebarnya menjadi full atau full width dengan mengaturnya menjadi full width.

Caranya mudah. Arahkan kursor Anda ke section yang ingin Anda jadikan full width. Perhatikan akan muncul garis kotak berwarna biru. Pada bagian atasnya, ada tiga buah tombol icon yang berdampingan satu sama lain.

tiga buah icon
  • Icon bertanda plus berfungsi untuk menambah section baru
  • icon bertanda enam buah titik untuk melakukan editing pada section
  • Dan icon bertanda "X" berfungsi untuk menghapus section

Nah, klik pada icon bertanda enam buah titik yang ada di tengah dan akan muncul pengaturan pada section tersebut disebelah kiri layar Anda.

Kemudian, aktfkan atau klik full width section pada toggle seperti yang saya tunjukkan dibawah ini:

membuat section menjadi full width

2

Merubah Header Menjadi Transparan

Ini sifatnya optional dan tergantung dari selera atau kebutuhan design Anda. Tapi, jika Anda ingin membuat header Anda menjadi transparan seperti dibawah ini, maka ini juga mudah dilakukan.

Membuat header menjadi transparan

Pengaturannya ada pada tema Astra, jadi Anda mungkin perlu membuka tab baru pada browser Anda dan pada dashboard WordPress Anda, buka Appearance > Customize.

Buka Header Builder > Lalu klik Transparent Header

Pengaturan transparan header

Lalu, aktifkan Enable on Complete Website seperti yang saya arahkan dibawah ini untuk membuat header menajdi transparan.

Klik enable on complete website

3

Memodifikasi Text dan Button

Untuk merubah suatu text atau button, Anda cukup mengklik pada element yang Anda ingin ganti.

merubah text dan button

Kemudian perhatikan panel di sebelah kiri Anda, panel tersebut langsung berubah menjadi editor untuk element yang Anda klik.

Anda bisa merubah text langsung dari element, atau dari panel di sebelah kiri.

Bagaimana cara merubah style, seperti warna, size font dan lain-lainya?

Klik pada tab "Style" untuk mengatur warna text, ukuran, shadow, dan lain-lainnya.

merubah style text

Bagaimana dengan tombol atau button?

Sama caranya seperti ketika Anda merubah text. Anda klik terlebih dahulu button yang ingin Anda modifikasi, kemudian panel editor button akan muncul di sebelah kiri layar Anda.

Memodifikasi button di Elementor

Perhatikan yang saya kotaki warna merah diatas. Akan muncul semua warna palette yang Anda atur sebelumnya di tema Astra Anda.

Saya menyarankan untuk menggunakan warna yang konsisten, karena itu pilihlah warna berdasarkan warna palette yang tersedia saja.

Jika Anda ingin merubah kumpulan warna palette tema Anda, kembali pada pengaturan colors di fitur customize tema Astra Anda.

4

Mengganti Gambar

Ada cara yang berbeda dalam mengganti gambar tergantung dari widget atau element yang digunakan.

Jika gambar yang ingin Anda ganti adalah gambar background, maka caranya adalah arahkan kursor Anda ke gambar background yang ingin diganti, dan klik icon edit section (icon bertanda enam buah titik putih).

Kemudian klik gambar untuk menggantinya dengan gambar yang lain.

Mengganti gambar background

Ngomong-ngomong, plugin Starter Templates memiliki fitur untuk mengambil gambar langsung dari situs Pixabay. Anda bisa mencari ribuan gambar gratis langsung dari Media Library.

Pastikan Anda klik tab "Free Images" untuk mencari gambar yang Anda inginkan.

Mencari gambar gratis dari Pixabay

Benar-benar plugin yang bagus, bukan?

Tips:

Anda bisa mengunjungi website berikut untuk mendapatkan stock photo/ilustrasi gratis:

Untuk format ilustrasi, WordPress tidak menerima format .svg karena alasan keamanan, tetapi Anda bisa mengakalinya dengan menginstall plugin SVG Support.

Plugin SVG Suport

Bagaimana jika Anda ingin mengganti gambar yang bukan gambar background, seperti dibawah ini?

Cukup klik gambar yang ingin Anda ganti dan klik "Choose Image" pada panel sebelah kiri Anda.

mengganti gambar regular

5

Menambahkan section baru

Saya percaya kemungkinannya besar Anda akan menambahkan section baru pada design halaman Anda.

Mungkin Anda ingin menambahkan informasi lain seperti fitur, testimonials, FAQ dan lain-lain.

Ada dua cara:

1. Bangun section dari awal (tidak menggunakan template)
2. Menggunakan template block yang telah disediakan Stater Templates.
3. Mengambil section dari template pages yang lain

Cara pertama bisa Anda lihat tutorialnya dalam video gif dibawah:

Menambahkan section baru (testimonials)

Cara kedua, memilih block dari Template Library.

Ada lebih dari 100+ block. Dan tidak seperti template pages, semuanya bisa Anda gunakan secara gratis. Wo-ho!

Menambahkan block baru

Cara ketiga, mengambil section dari template pages lainnya. Cara ini agak ribet, tapi tidak ada cari yang lebih mudah daripada Anda membuatnya dari nol.

Save as template

5. Selesaikan Desain Halaman Depan (Home) Anda

Elementor cukup mudah untuk dipahami.

Mungkin Anda akan menemui kesulitan pada awal mulai membangun halaman website Anda, tapi itu wajar, Anda perlu mencoba dan meng-eksplore bagian-bagian lainnya pada Elementor agar terbiasa menggunakannya.

Sampai disini Anda bebas berkreasi seperti mengganti warna background, menambah section dan widget, membuat tombol, dan lain-lain.

Lalu, bagaimana dengan halaman lainnya, seperti halaman about us, services, atau apapaun halaman selain homepage yang Anda buat?

Caranya sama dengan membuat halaman home, Anda hanya perlu mengulang prosesnya dari "Persiapan".


Launching Website Anda

Launching website Anda
Jika Anda benar-benar mengikuti panduan cara membuat website ini dari awal hingga akhir, saya percaya website Anda telah siap untuk di launching.

Apa Selanjutnya?

Sejujurnya, masih ada banyak hal yang perlu Anda pelajari. Panduan ini hanya awalnya saja.

Saya mungkin akan membuat panduan lainnya (sedang struggle mencari waktu), seperti panduan:

  • Membuat contact form dan mengintegrasikannya dengan webmail dan 3rd party email
  • Memilih plugin terbaik untuk SEO, Performance, Security, dan lain-lain
  • Tips SEO On Page
  • Dan lain-lain..

Terakhir, jika Anda memiliki pertanyaan, jangan sungkan-sungkan untuk mengirimkannya melalui kolom komentar yang ada dibawah atau boleh juga via email di randi(at)penasihathosting.com.

  • Halo
    Mas makasih tutotial nya. Tp saya mentok di koneksikan antara tombol yang saya buat dengan isi dr tombol nya. Seperti tombol “beli” untul link nya harusnya kmna aku blm ngerti.

    maaf
    Tlng balas jika berkenan
    Trims

    • Halo,
      Salah tempat mas. Panduan yang saya tulis ini bukan panduan untuk website toko online. Saya sudah tulis atau wanti-wanti di awal panduan tentang ini 🙂

  • Terima kasih banyak mas admin atas artikelnya, sangat bermanfaat sekali bagi saya. sehingga saya dapat membuat website sendiri dengan adanya artikel ini.

  • Halo mas , izin bertanya mas, kenapa saat saya menggunakan elementor, tidak muncul menu menu seperti di tutorial ya mas, dan saya tidak menemukan ocenWP setting pada menu pada step nya. terimakasih mas

    • Bisa email saya langsung di randi@penasihathosting.com mas buat dibantu. Mohon maaf, artikelnya belum saya update. Mungkin saya ada perubahan di versi terbaru OceanWP atau Elementor. Tapi, mas bisa kirim email saja dulu ke saya, nanti bisa saya pandu.

  • Selamat malam Mas Randika
    Saya masih baru banget bikin website sendiri, tadi saya sudah ikutin tutorial nya. Tapi disini saya bingung mau nambahin Page nya mas.
    Contoh : Page Puisi, saya mau manaruh kategori dimana nanti ada cinta, teman, dll. Jadi tuh waktu di klik Puisi muncul kategorinya begitu mas hehe, Disini saya masih bingung gimana caranya mas.
    Kalo di bales makasih banyak mas, sehat selalu, banyak rezeki.
    Terima kasih

    • Halo mas Niko,
      Kategorinya mau di taruh di page Puisi ya? Ini mudah kok, di edit saja di bagian page Puisinya, kemudian tambahkan secara manual link sub kategori yang mau dimasukkan.
      Terima kasih banyak doanya ya. Do’a yang sama juga buat masnya.

  • saya gatal ingin mengapresiasi konten singkat namun jelas ini.

    saya penasaran, apakah mungkin website yang dibuat dengan wordpress bisa menambahkan fitur membership dalam website tersebut? dimana ada pengunjung yang mendaftar menjadi member website untuk mengakses konten khusus member website tersebut dan menyimpan database informas mengenai member seperti nama, email, nomer kontak, akun ig dan sejenisnya.

    terimakasih banyak sebelumnya untuk jawabannya.

    tidak tahu bagaimana mas Willy bisa membalas semua komentar di penasihathosting.com ini, semoga waktu dan pengetahuannya terbayar dengan baik.

    • Bisa kok mas Ajie. Sekarang ini apa saja bisa di lakukan di WordPress, termasuk menambahkan fitur membership. Ada banyak pilihan plugin membership, tinggal di cari saja yang sesuai dengan kebutuhan nya seperti apa.,

      Terima kasih buat apresiasi dan doa nya, senang sekali bisa berbagi dengan semua.

  • Salam, Mas!
    langsung aja, untuk pembuatan situs seperti website yang dimiliki penyedia hosting dimana disitu ada bagian member yang terregristrasi sekaligus memiliki akun dengan saldo(dalam bentuk wallet). saldo ini bisa berkurang jika dipakai untuk pembayaran sewa hosting atau domain. kemudian member bisa mengisi lagi saldo dengan transfer.
    Pertanyaan saya.
    1. apakah mereka menggunakan plugin WP dalam pembuatan website tsb,
    2. plugin apa kiranya yang mereka gunakan.
    Jika mas mau membuat tulisan cara membuat website jenis itu saya kira sangat membantu, karena saya sudah googling belum ada ulasan tersebut.
    Terima Kasih

    • Salam mas Lewi.
      Dari yang banyak saya temui, untuk halaman member area atau client nya, mereka bahkan tidak menggunakan WordPress.
      Sebagian besar dari mereka menggunakan WHMCS. Kalau saya jelasin disini bisa panjang dan engga ada kaitan nya juga dengan isi konten ini, jadi sebaiknya mas bisa Googling apa itu WHMCS 🙂

  • hai kak. mau nanya nih. adakah tutorial membuat navbar dengan logo seperti di website kakak ini. jadi nanti tidak ada header. headernya hanya navbar dengan logo itu. saya coba-coba bikin tapi belum juga berhasil.

  • kak.. mau tanya..

    saya beli hosting dan domain di domainesia

    dv certificate saya sudah warna hijau.. tapi kenapa tampilan di browser masih not secure yaa..

    mohon penjelasan nya.. thanks

    • Mungkin domain nya belum redirect dari http ke https.
      Ini bisa minta bantuan support DomaiNesia buat bantu di redirect nya mas.

  • Salam kenal mas,

    Mas saya diberi amanah untuk membuat web sekolah sederhana (belum akan digunakan e-learning) dengan domain .sch.id saya sudah persiapkan semua persyaratannya, dan ketika mau memilih hosting saya jadi bingung harus memilih hosting yg mana, karena dari review di penasihathosting.com semuanya memiliki kekurangan selain kelebihannya juga.

    Yang saya ingin tanyakan pada mas Willya,
    1. Pilihan saya sih antara 2 developer : domainesia atau niagahoster, mana yang sebaiknya saya pilih ?
    2. Sebaiknya saya pilih paket hosting umum atau yang spesial untuk wordpress (karena nantinya saya akan pakai wp, tetapi tidak tertutup kemungkinan juga memakai cms lainnya) ?
    3. Apakah saya harus memakai Sertifikat SSL Gratis atau memakai yang berbayar?

    Terima kasih mas atas bantuannya, semoga Mas Willya dan penasihathosting.com selalu diberkahi.

    • Salam kenal mas Imam,

      1. Kedua nya bagus. DomaiNesia harga nya lebih murah dan support nya lebih baik. Adapun Niagahoster harga nya lebih mahal, tetapi performance nya lebih baik.
      2. Saran saya yang umum saja.
      3. Pakai yang gratis tidak masalah kok mas. Kalau pun nanti membutuhkan yang berbayar, nanti SSL nya bisa di ganti di kemudian hari.

      Sama2, terima kasih juga buat doa nya ya 🙂

  • hallo mas

    jd ini saya pengguna baru bngd, udh cek websitenya domaninesia, kan ada 2 pilhan paket hosting super dan hosting wordpress ,saran nya lebih baik pilih yg mana ya ?

    terima kasih

  • Terima kasih atas panduannya mas. Saya sudah selesai sampai tahap menginstall WordPress Menggunakan Fitur One Click Installation (Install dengan 1x klik). Akan tetapi ketika the software was installed successfully dan saya mencoba untuk klik URL nya, tidak berfungsi dan ada tulisan “This site can’t provide a secure connection” domain saya uses an unsupported protocol. Bagaimana solusi untuk ini mas? Mohon bantuannya

  • Terimakasih atas Panduanya, saya telah membeli Hosting dan Domain di Domainesia dan telah memasukkan kode kupon: PENASIHATHOSTING, Panduanya sangat bermanfaat sekali mulai dari pemilihan hosting sampai setting di WP, sampai di sini saya jeda dulu, sebelum masuk ke tema di WP, karena saya membeli hosting untuk tujuan onlineshop, kiranya dapatkah merekomendasikan tema WP untuk tujuan tersebut, sebelum saya membuat Landing Page untuk Adsnya.

    • Terima kasih mas Teddy sudah mengikuti panduan ini dan memebeli hosting nya menggunakan kode referral kami.
      Untuk tema toko online, menurut saya OceanWP juga bagus kok. Nanti mas nya bisa instal plugin WooCommerce untuk toko online nya.

  • {"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
    >