Saya menulis panduan cara membuat situs web ini untuk membantu pemula yang ingin bisa membuat website sendiri, tapi.. Show
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?
Saya sediakan nomor 2 nya, dan Anda hadirkan nomor 1 nya.Sudah lengkap? Ayo mulai! Langkah 1: Memilih Platform TerbaikAda 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: 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âŠ
Bagaimana dengan platform lainnya, seperti website builder: WIX, Squarespace dan Weebly? Mereka adalah pilihan platform yang juga bagus. Hanya saja memiliki beberapa keterbatasan, seperti:
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 sendiri menggunakan WordPress dalam panduan ini. Langkah 2: Memilih Domain dan HostingWebsite itu dimulai dari sebuah nama domain â bukan design. Anda membutuhkan sebuah nama sebelum memulai membangun website Anda. Memilih Nama DomainWebsite 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, langkah ke-2 dalam cara membuat website setelah memilih platform (WordPress) adalah menentukan nama domain. Jika Anda masih bingung menentukan nama domain, berikut saya berikan beberapa tips yang semoga dapat mempermudah Anda mencari nama domain yang tepat:
Dan gunakan ekstensi domain yang populer agar website Anda terlihat lebih professional, seperti:
Tips lainnya:
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 HostingWeb 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? 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:
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 Harun Studio telah melakukan penelitian selama lebih dari 30 bulan terhadap 22 provider hosting paling populer di Indonesia. (baca hasil penelitian) Tujuannya? Salah satunya, agar orang yang baru belajar cara 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:
Dapatkan Hosting dan Domain di DomaiNesiaDiskon 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). 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. Cara membeli hosting dan domain murah di DomaiNesia:1. Kunjungi www.DomaiNesia.com (link referral/affiliate)(1) Masukkan nama domain yang Anda inginkan pada form nama domain âA better web awaits..â 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. 3. Masukkan kode promo untuk mendapatkan diskon lebih besarKode 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â. 4. Isi Data DiriIsi nama depan dan belakang, institusi, email, dan password. 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. Jika sudah benar, akan muncul pemberitahuan bahwa pendaftaran telah berhasil. Klik tombol âSelesaikan & Bayarâ. Langkah 3: Menginstall WordPress di cPanelInstall 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 membuat 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:
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 InstallationHampir 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 AndaAtau 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. one-number-roundKemudian, klik bagian yang saya kotaki warna merah atau klik bagian products. two-number-roundLalu, klik pada tab âAccessâ. three-number-roundDan klik login to cPanel. four-number-roundAnda sudah masuk ke cPanel. Beginilah tampilan cPanel hosting DomaiNesia Anda. 2. Pastikan Domain Anda Sudah Menggunakan SSLSebelum 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: Jika tidak menggunakan SSL = tidak aman. Di browser Chrome, website Anda akan di labeli sebagai âNot Secureâ. 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? Pada dasarnya, di DomaiNesia SSL sudah aktif secara otomatis. Jika belum, primary domain Anda akan diberi keterangan âNo Valid Certificateâ. Cara memperbaiki nya: one-number-roundklik tombol icon obeng seperti yang saya tunjukkan di bawah ini: two-number-roundKemudian, ceklis pada bagian nomor (1), dan klik tombol âRun AutoSSLâ pada bagian nomor (2). three-number-roundCek kembali di home cPanel, konfirmasi apakah primary domain Anda sudah âDV Certificateâ atau belum. Jika sudah, silahkan lanjut ke langkah ketiga. 3. Redirect HTTP ke HTTPS (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 one-number-roundKlik Nginx pada cPanel two-number-roundKemudian klik tab âForce HTTPSâ dan klik tombol âEnableâ seperti yang saya contohkan pada gambar dibawah. 2. Jika menggunakan provider lain (selain DomaiNesia) one-number-roundKlik pada bagian Domains. two-number-roundLalu klik klik tombol yang saya arahkan pada gambar dibawah. 4. Kembali Ke Tutorial Cara Menginstall WordPressone-number-roundCari dan klik logo WordPress atau bila tidak ada, pilih Softaculous Apps Installer two-number-roundKlik tombol biru âInstall Nowâ three-number-roundKemudian, Isi informasi yang dibutuhkan. Ikuti petunjuk pada gambar dibawah ini: 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. Jika sudah terinstall: Melakukan Penyesuaian Pada Website BaruOke, 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. Sebelum mengisi nya dengan konten dan lanjut ke bab ke-4 dari tutorial cara membuat website ini, Anda perlu mengurus beberapa hal penting terlebih dahulu untuk membuat website terlihat siap. one-number-roundLog in ke Dashboard WordPress Anda Apabila Anda tidak yakin bagaimana caranya, ketik: http://domainanda.com/wp-admin/ (ganti âdomainanda.comâ dengan nama domain Anda). Masukkan username atau alamat email dan password (yang Anda buat pada saat menginstal WordPress).Ketika Anda sudah log in, beginilah tampilan dashboard WordPress Anda: two-number-roundGanti 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â. Bagaimana caranya mengganti judul dan tagline?Pada dasboard WordPress Anda, klik Settings -> General. Bingung menentukan judul dan tagline? Jika Anda tidak yakin mau menulis apa, berikut saya berikan 4 tips jitu yang dapat membantu Anda:
three-number-roundPastikan 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. 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: three-number-roundHapus konten default WordPress [Seperti: Hello World, dan Sample Page] Konten-konten yang perlu Anda hapus:
Arahkan kursor Anda ke judul artikel agar pilihan Edit | Quick Edit | Trash | View muncul. Langkah 4: Memilih Tema WordPressBuat 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?one-number-roundAkses tema gratis WordPressKlik Appearance > Themes dan klik tombol âAdd Newâ untuk mengakses tema gratis yang ada 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. two-number-roundPilih tema WordPressSampai disini, saya perlu memberitahu Anda bahwa sebelum merampungkan panduan cara membuat website WordPress untuk pemula ini, saya sudah mencoba berbagai tema WordPress populer yang menurut saya mudah untuk digunakan bagi siapapun dan apapun tujuannya. Tema-tema populer seperti:
Setelah mencoba semuanya, saya sampai kepada kesimpulan bahwa, yang:
Adalah Astra. Note:
Anda bisa menambahkan tema Astra langsung dari dashboard WordPress Anda. Ketik Astra pada kolom pencarian disebelah kanan atas. 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:
Atau apapun halaman yang Anda butuhkan. Bagaimana 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 memang terlihat mirip, namun memiliki fungsi yang berbeda.
Cara menambahkan PagesJika Anda ingin membuat halaman âTentang Kamiâ, âKontak Kamiâ, âVisi/Misiâ, dsb maka Anda harus menulisnya dalam bentuk Pages. Caranya sebagai berikut: one-number-roundDi sidebar sebelah kiri pada layar Anda, klik Pages -> Add New. two-number-roundDi sidebar sebelah kiri pada layar Anda, klik Pages -> Add New. Dan ini adalah tampilan WordPress pages 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. Jika sudah klik publish, Anda bisa mengklik tombol logo WordPress seperti gambar dibawah ini untuk kembali ke halaman dashboard WordPress. three-number-roundJika 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. Dan Bagaimana Cara Menambahkan 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: Caranya juga mudah. one-number-round1. Klik Appearance > Menu two-number-roundIkuti langkah demi langkah nya dibawah ini untuk membuat menu website Anda.
Sampai pada tahap ini, Anda bisa cek apakah menu website yang baru Anda buat sudah tampil di website Anda. Langkah 5: Melakukan Penyesuaian pada TemaAstra 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 HomepageHalaman 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 (penasihathosting.com), kapanpun Anda mengunjunginya dan seberapa seringpun saya menulis artikel baru, halaman statis ini tidak akan pernah berubah. 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. 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 WebsiteIni termasuk bagian yang paling terpenting dari semua rangkaian proses cara 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. one-number-roundMenentukan 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. Untuk pengaturan yang lain, saya rasa tidak perlu diubah-ubah dahulu. two-number-roundMenentukan 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:
three-number-roundMenentukan 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) 3. Kustomisasi HeaderJika Anda tidak yakin mana yang disebut header, perhatikan gambar dibawah ini: 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. one-number-roundMenambahkan 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: Kemudian ikuti langkah-langkah berikut: (1) Klik âSelect Logoâ untuk upload logo Anda Jika sudah selesai klik tombol âPublishâ berwarna biru yang terletak di bagian kiri atas layar Anda. two-number-roundMerubah 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. one-number-roundBuka Header > Arahkan kursor Anda ke bagian logo seperti gambar dibawah dan klik Main Row one-number-roundKlik tab âDesignâ (yang saya lingkari warna merah). Kemudian klik icon background dan pilih warna background Anda. three-number-roundMerubah 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. 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 BuilderLangkah 6 merupakan inti dari panduan cara membuat website dengan WordPress 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 BuilderAda 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 dari nol 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 yang Newbie-FriendlySama 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:
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:one-number-roundInstall plugin ElementorBuka Plugins > Add New > Cari âElementorâ dalam kotak pencarian. Kemudian klik tombol âInstall Nowâ dan âActivateâ hingga muncul pesan âPlugin Activatedâ. one-number-roundInstall plugin pendukungAnda 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â. Membangun Halaman Depan (Home)1. PersiapanBuka Pages. Lalu Edit halaman depan Anda, dalam contoh ini saya memberikan judul halaman depan sebagai Home. Kemudian, ikuti langkah-langkah pengaturan berikut untuk mempersiapkan halaman Anda sebelum meng-edit nya dengan plugin Elementor. one-number-roundKlik icon Astra yang terletak di sebelah atas kanan dari layar Anda two-number-roundAtur pengaturan halamannya sebagai berikut: (2) Ubah Sidebar menjadi No Sidebar three-number-round(5) Klik tombol Update Anda akan digiring ke halaman Elementor Page Builder. Disinilah tempat Anda membangun halaman-halaman pada website WordPress Anda. 2. Mengenal User Interface ElementorSeperti 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. Di bagian kiri terdapat widget-widget yang bisa Anda gunakan, seperti:
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 ElementorMulai 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 AdaIkuti langkah-langkah berikut: one-number-roundKlik icon icon seperti yang ditunjukkan dalam screenshoot dibawah ini. 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 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:
Sementara blocks adalah bagian-bagian dari template jadi diatas. Misalnya, Hero adalah block. Feature adalah block. Testimonials adalah block. two-number-roundKembali 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.
Atau Anda juga bisa mencari dengan memasukkan keyword tertentu di kotak pencarian, seperti: business, organic, clean, cv, dan lain-lain. Misalnya, dalam contoh panduan cara membuat website ini, saya menggunakan template âLove Natureâ. Note: Anda bisa memilih template yang lainnya, tidak perlu sama dengan ini. Carilah template yang sekiranya cocok dengan kebutuhan website Anda. Kemudian, klik gambarnya. Akan muncul beberapa pilihan dari template âLove Natureâ. Karena saat ini Anda sedang membangun halaman home, maka klik template yang âHomeâ. Sebelum template dimasukkan ke dalam halaman home, Anda bisa melihat terlebih dahulu layout penuh dari template home yang Anda pilih tadi. 4. Memodifikasi TemplateNah, 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: one-number-roundMembuat 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: 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.
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: two-number-roundMerubah 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. 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 Lalu, aktifkan Enable on Complete Website seperti yang saya arahkan dibawah ini untuk membuat header menajdi transparan. three-number-roundMemodifikasi Text dan Button Untuk merubah suatu text atau button, Anda cukup mengklik pada element yang Anda ingin ganti. 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. 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. 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. four-number-roundMengganti 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. 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. Benar-benar plugin yang bagus, bukan? 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. five-number-roundMenambahkan 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: 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! Cara ketiga, mengambil section dari template pages lainnya. Cara ini agak ribet, tapi tidak ada cari yang lebih mudah daripada Anda membuatnya dari nol. 5. Selesaikan Desain Halaman Home AndaElementor 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 AndaJika Anda benar-benar mengikuti panduan cara membuat website 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:
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 Langkah langkah membuat manual book?Cara Menyusun Manual Book yang Baik. Membuat Kerangka dan Daftar Isi. Tahap atau langkah yang pertama dalam membuat manual book adalah membuat kerangka dan daftar isi. ... . Menulis Langkah-Langkah Panduan. ... . Memasukkan Ilustrasi dan Desain Pendukung. ... . 4. Layouting. ... . Editing. ... . 6. Desain Cover.. Apa saja isi dari manual book?âIsi manual book biasanya terdapat informasi terpenting dan detail seperti Informasi Garansi, Instruksi Keselamatan, Instruksi Instalasi, Identifikasi Masalah, Instruksi Pengaturan, Spesifikasi Umum Produk serta Instruksi Perawatan dan Pemecahan Masalah.
Manual book untuk apa?Manual book adalah buku panduan yang dibuat untuk menyampaikan beberapa informasi kepada calon konsumen. Buku panduan sering digunakan pada produk baru, untuk memberikan informasi mengenai produk tersebut.
Apa yang dimaksud dengan user manual?Manual pengguna adalah suatu dokumen komunikasi teknis yang bertujuan memberikan bantuan untuk penggunaan suatu sistem, terutama dikaitkan dengan peranti elektronik serta perangkat keras dan lunak komputer.
|