Anda nak tahu cara buat website?

Sesiapa sahaja boleh buat website tanpa mengetahui apa-apa tentang coding, reka bentuk website dan pambangunan laman web (web developer).

Sama ada anda ingin buat website untuk perniagaan anda atau untuk kegunaan sendiri, anda bina website dengan menggunakan peralatan dan sumber yang betul.

Saya akan kongsikan langkah demi langkah untuk membantu anda buat website daripada awal tanpa anda perlu keluarkan duit kepada freelancer untuk membina website.

Perkara yang anda perlu ada ialah 2-3 jam untuk membina website yang lengkap dan profesional.

Perkara yang perlu ada mengikut susunan untuk buat website

  • Domain (nama website anda. (Cth: www.SiteAnda.com)

  • Hosting (tempat menyimpan data website anda.(Cth: Gambar / Video / Teks)

  • WordPress (percuma, antara platform website yang popular)

Untuk buat website yang lengkap, anda wajib mempunyai nama domain (alamat laman web) dan akaun web hosting. Tanpa kedua-dua ini, anda tidak boleh buat website yang lengkap.

Mungkin ada yang tidak faham istilah nama domain dan hosting. Contoh yang mudah ialah domain dan hosting ibarat satu rumah. Domain ialah alamat rumah dan hosting ialah rumah yang menyimpan isi rumah. Contohnya perabot, pakaian dan lain-lain.

Hosting

  • Rumah untuk website anda
  • Menyimpan data seperti gambar, video dan lain-lain

Domain

  • Alamat Website Anda (www.WebsiteAnda.com)

  • Jika website adalah rumah, domain adalah alamat

Jika anda telah mempunyai domain dan hosting, barulah anda boleh buat wordpress website. WordPress adalah satu platform untuk membina website yang paling popular yang digunakan dimana 30% mengunakan WordPress daripada semua website di Internet.

Untuk setting WordPress adalah sangat mudah dan simple, saya akan tunjukkan caranya dengan terperinci, step by step.

Jika anda follow cara buat website yang akan saya tunjukkan, anda akan mempunyai website sebenar dengan domain anda sendiri dan orang lain boleh akses website anda.

Anda dah sedia? Jom saya tunjukkan cara buat website 2021 langkah demi langkah.

Kandungan (Step by step cara buat website)

Catatan: Panduan ini mengandungi link affiliate. Jika anda membeli web hosting atau domain menggunakan link di post ini, saya akan menerima komisen dan anda tidak akan dikenakan bayaran tambahan. Terima kasih kerana menyokong.

Jika anda stuck semasa proses membina website, anda boleh hubungi saya melalui page Hubungi Saya.

Langkah 1: Pilih Nama Domain

Perkara pertama yang perlu anda ada ialah nama domain.

Domain ialah nama website anda dan alamat. Alamat tersebut digunakan oleh pelawat apabila mereka ingin mencari website anda menggunakan web browser (Internet Explorer / Chrome).

Nama domain seperti www.saifulfirdaus.com dan boleh juga nama anda (sekiranya masih ada).

Kos untuk domain ialah antara RM70 – RM90. Sekiranya anda beli di Site Ground harganya ialah RM70.(Bergantung pada USD/MYR).

Jika anda belum mempunyai nama domain untuk website anda, di sini saya berikan sedikit tips sebelum membeli domain:

  • Jika website anda adalah untuk perniagaan anda, nama domain sepatutnya bersesuaian dengan nama perniagaan anda. Sebagai contoh: www.SyarikatAnda.com
  • Jika anda bercadang untuk buat website untuk personal, jadi nama domain www.NamaAnda.com mungkin lebih sesuai.
  • Untuk permulaan saya cadangkan anda menggunakan extension .com. Elakkan menggunakan .net @ .biz kerana pada pendapat saya .com lebih trust berbanding extension yang lain.

Jangan bimbang jika domain yang anda pilih telah digunakan. Terdapat lebih 300 juta nama domain yang telah didaftarkan, tetapi terdapat berbillion lagi domain yang masih ada yang mungkin sesuai dengan anda.

Jika anda belum lagi mempunyai nama domain, dan masih tak tahu bagaimana nak register.

Saya akan tunjukkan bagaimana untuk dapatkan domain sendiri pada langkah kedua.

Langkah 2: Daftar Web Hosting dan Nama Domain

Jika anda ingin dapatkan nama domain, anda juga perlu mempunyai web hosting.

Seperti yang kita bincang di atas. Hosting ialah rumah dan Domain ialah alamat rumah.

Web hosting islah perkhidmatan menyimpan file website (gambar, video, audia dan text) di server yang selamat yang sentiasa berjalan 24/7. Tanpa web hosting, website anda tidak boleh diakses oleh orang lain.

Harga web hosting yang mampu milik untuk website baru adalah dalam lingkungan RM15-RM20 sebulan.

Tidak kira syarikat web hosting mana yang anda pilih, pastikan ia mempunyai perkara ini:

  • Free domain dengan SSL (untuk keselamatan)
  • One Click Install untuk wordpress (percuma)
  • Email website percuma
  • Bandwidth tanpa had
  • Khidmat pelanggan 24/7 live chat

Jika anda jumpa syarikat hosting yang dapat offer perkara seperti di atas. Anda telah jumpa syarikat yang betul.

Anda boleh lihat review-review di website ataupun di Youtube. Ini adalah salah satu review web hosting yang terbaik.

Saya cadangkan anda gunakan SiteGround.com untuk hosting dan domain. Saya juga menggunakan web hosting dan domain siteground.

Apa yang saya suka dengan perkhidmatan Siteground ialah platform yang digunakan sangat mesra pelanggan dan antara harga yang murah.

Bukan saya sahaja yang suka perkhidmatan Siteground, banyak review popular mencadangkan menggunakan web hosting Siteground kerana reputasi syarikat yang baik.

Harga Hosting Siteground bermula dari harga USD 3.95/bulan menggunakan link kami.

1) Untuk dapatkan web hosting, pergi ke SiteGround.

Jika anda jumpa syarikat hosting yang dapat offer perkara seperti di atas. Anda telah jumpa syarikat yang betul.

Anda boleh lihat review-review di website ataupun di Youtube. Ini adalah salah satu review web hosting yang terbaik.

Saya cadangkan anda gunakan SiteGround.com untuk hosting dan domain. Saya juga menggunakan web hosting dan domain siteground.

Apa yang saya suka dengan perkhidmatan Siteground ialah platform yang digunakan sangat mesra pelanggan dan antara harga yang murah.

Bukan saya sahaja yang suka perkhidmatan Siteground, banyak review popular mencadangkan menggunakan web hosting Siteground kerana reputasi syarikat yang baik.

Harga Hosting Siteground bermula dari harga USD 3.95/bulan menggunakan link kami.

1) Untuk dapatkan web hosting, pergi ke SiteGround.

 

2) Selepas itu, pilih plan web hosting. Untuk permulaan saya cadangkan anda pilih plan StartUp (Anda boleh upgrade plan di masa akan datang).

 

3) Selepas itu, masukkan nama domain yang anda telah pilih dan klik proceed.

Jika anda telah mempunyai nama domain. Anda boleh juga menggunakan hosting SiteGround dengan mengemaskini nama server. Saya akan buat tutorial untuk tukar nama server pada masa akan datang.

4) Isi maklumat akaun seperti di bawah dan klik pay now.

Ok, sekarang anda telah mempunyai nama domain dan web hosting. Tahniah!

Langkah 3: Bina Website Menggunakan WordPress

Jika anda telah mempunyai nama domain dan wen hosting, proses seterusnya ialah memilih dan install website building (juga dikenali sebagai CMS).

Terdapat banyak CMS contohnya Wordpess, Drupal, dan Joomla.

Untuk tutorial kali ni kita akan gunakan WordPress. Hampir 30% website menggunakan CMS ini.

Selain itu, WordPress mudah digunakan dan terdapat banyak design percuma dan berbayar yang boleh menjadikan website anda kelihatan professional dan unik.

Jika anda tidak menggunakan wordpress, jangan bimbang, hampir semua web hosting menyediakan “WordPress Install” di cPanel. Jika anda masalah untuk install WordPress anda boleh tanya terus kepada saya.

1) Cara install WordPress di SiteGround.com

a. Klik Proceed To Customer Area

b. Klik Set Up Site

c. Klik Selected pada Start New Website

d. Klik Select pada WordPress

e. Masukkan email dan password (Pastikan anda ingat password anda)

f. Klik Continue.

g. Pada page seterusnya klik finish.

h. Klik Manage Site dan anda akan ke cPanel (Versi SiteGround lebih mesra pengguna)

 

i. Klik wordpress >> Install & Manage

j. Klik pada Action

k. Dan last sekali dalam proses install wordpress dengan klik Exit.

l. Yeay..sekarang anda dah ada website wordpress. Tahniah. Ini adalah Dashboard utama wordpress.

m. Jika anda klik pada Demo1(url anda) >> Visit Site. Inilah wajah website anda. Tak cantikkan. Jangan bimbang selepas ini kita akan cantikkan website kita.

Anda Terlepas Kapal?

BERITAHU SAYA DI MANA ANDA LOST

Anda stuck? Jangan risau, hantar mesej anda dan saya akan menjawab ASAP. Cara Buat Website ini dibuat secara terperinci supaya anda lebih jelas dan faham langkah step by step untuk buat website.

TANYA SEKARANG

Langkah 4: Memasukkan Pages Yang Penting Dan Isi

Sebelum cantikkan website, perkara penting untuk kita masukkan di dalam website ialah Page, Post, Menu dan Plugin.

a. Page

Saya akan terangkan page terlebih dahulu. Page digunakan untuk memberikan maklumat kepada orang lain termasuklah gambar atau video untuk mambantu mamaparkan kandungan penting dalam sesuatu website.

Page Home Youtube

Jika anda ingin dapatkan nama domain, anda juga perlu mempunyai web hosting.

Page juga boleh digunakan untuk menjual produk seperti membina landing page atau mini site.

Jangan confuse antara page dan blog post, ia banda yang berlainan. Saya akan terangkan juga berkenaan cara buat post sebentar lagi.

Page yang wajib dimasukkan dalam sesuatu website ialah page Home, Tentang Kami dan Hubungi Kami.

Cara Buat Page

i. Klik pada Pages

&nbsp

ii. Klik pada Add New Page

&nbsp

iii. Taipkan “Home” pada Add Title. (Kita akan buat Home Page) dan klik publish sekali lagi.

&nbsp

iv. Ok anda dah berjaya membina page Home. Sebagai latihan anda perlu buat Page Tentang Kami, Hubungi Kami, Perkhidmatan, Webdesign, Graphic Design, Photographer dan Blog.

 

b. Post

Post atau blog ialah kandungan sesuatu website. Contoh blog ialah berita, artikal dan tutorial. Tutorial ini juga adalah contoh blog.

Contoh Post atau Blog

Di sini ialah cara buat blog atau post.

Cara Buat Post

Saya akan tunjukkan cara bina post selepas kita install theme.

 

C. Menu

Menu website atau navigation bar ialah link yang menghubungkan page dalam sesuatu website yang membantu pembaca untuk ke page atau blog yang lain

Contoh Menu Website

Cara Buat Menu

i. Klik Appearance >> Menus

&nbsp

ii. Klik Select All >> Klik Add To Menu

&nbsp

iii. Susun menu mengikut urutan dengan drag and drop >> Klik Dekstop Horizontal Menu >> klik Save Menu

&nbsp

iv. Menu website anda akan jadi seperti di bawah.

Langkah 5: Install Theme Divi

Ok, sekarang tibalah masanya untuk cantikkan website kita. Untuk cantikkan website kita perlukan theme.

Ada theme berbayar dan ada theme percuma. Theme percuma biasanya mempunyai keupayaan yang terhad dan agak sukar untuk mengendalikannya.

Untuk tutorial kali ini saya gunakan Theme DIVI. Kenapa saya pilih Divi? kerana kita boleh buat website yang professional dengan mudah kerana Divi menyediakan beratus template website professional.

Kita boleh ambil terus templete tersebut dan kita cuba ubah sahaja kandungannya.

Ok jom mula design website kita.
Divi WordPress Theme

1) Pergi ke Website DIVI dan klik Pricing

2) Klik Sign Up Today. Divi akan beri anda percubaan 30 hari. Jika anda tidak berminat untuk meneruskan, anda boleh batalkannya dan wang akan dikembalikan.

Saya syorkan anda pilih Yearly Access/Tahun. Jika anda nak upgrade kepada Lifetime Access, Anda cuma baki daripada anda telah bayar $249 – $89 = $160.

Jika anda serius untuk memulakan perniagaan online, berbaloi jika anda laburkan untuk theme ini kerana theme ini juga memudahkan anda untuk membina landing page.

3) Isi Detail dan klik Complete Registration >>Masukkan Detail Kad Kredit/Debit >> dan Log In To Download

4) Klik Download

5) Selepas itu pergi ke wordpress semula dan klik Appearance >> Add New

6) Klik Upload Theme >> Choose File >> Pilih File Divi Theme >> Klik Install Now >> dan Klik Activate

7) Klik DIVI >> Theme Options >> Masukkan Username dan API Key (API Key perlu diambil di Account DIVI)

8) Untuk masukkan Logo klik General >> di bahagian Logo, Klik Upload >> Upload File >> Select File dan pilih logo anda. Akhir sekali klik Save Changes. Logo anda akan dipaparkan di Website anda.

9) Untuk masukkan Logo klik General >> di bahagian Logo, Klik Upload >> Upload File >> Select File dan pilih logo anda. Akhir sekali klik Save Changes. Logo anda akan dipaparkan di Website anda.

Ok, Untuk pengetahuan anda, website mempunyai 3 bahagian iaitu Header, Body dan Footer.

Tadi kita dah siapkan Header, sekarang kita lakukan body pula.

10) Pergi ke Pages >> Pada pages Home klik Edit >> dan Edit With Divi Builder.

11) Klik Start Building.

 

11) Klik bulatan biru >> Fullwidth >> Fullwidth Header.

 

12) Delete Blank Space (Buang section putih).

 

13) Untuk menukar warna atau gambar background, Klik Module Setting. (Jika Module Setting tidak kelihatan, drag kiri, kanan, atas dan bawah mouse anda di kawasan hijau)

14) Klik Content >> Background

 

15) Untuk menjadikan gambar background Fullscreen klik Design >> Layout >> Make Fullscreen >> Yes.

 

16) Kalau anda lihat gambar tersebut terlalu cerah sehingga tulisan pada website sukar untuk di baca. Untuk mengatasinya kita perlu tambag Overlay. Cara nak lakukannya di Tab Design >> Overlay >> Pilih warna hitam atau warna pilihan anda dan kurangkan sedikit warnanya.

 

17) Tukar ayat kepada nama perniagaan atau tajuk yang sesuai. Itulah kelebihan Theme Divi, kita boleh terus pinda di Front End. Kita tidak perlu pinda pada Back End.

Untuk tukar Alignment perkataan kepada Center, Tukar dengan klik Module Setting >> Design >> Layout >> Tukar kepada Center

 

18) Ubah size, warna dan lain-lain di Tab Design pada Title Text dan Body Text.

 

19) Untuk ubah perkataan pada button pula, ubah di bahagian tab Content.

Untuk mengubah size, warna dan lain-lain ubah di bahagian Design >> Button One.

 

20) Sekarang kita telah siapkan seksyen pertama. Seterusnya kita buat seksyen kedua pula.

 

21) Untuk seksyen kedua, saya akan gunakan Template DIVI sedia ada. Divi menyediakan beratus-ratus template untuk memudahkan pengguna DIVI untuk buat website. Anda tak perlu pening nak design cun-cun sebab template DIVI memang cun-cun.

Ok untuk mengambil template Divi klik Load From Library >> Premade Layouts.

 

22) Pilih Premade Layout yang anda suka. Untuk tutorial ini saya akan pilih Design Agency. Klik Design Agency >> Home >> Uncheck Replace Existing Content >> Use This Layout.

 

23) Delete seksyen yang tidak diperlukan. Saya akan delete seksyen 1 sahaja.

 

24) Untuk tukar warna ikon klik Module Setting pada icon.

 

25) Klik pada icon biru.

 

26) Tukar kepada warna yang sesuai dan buat perkara yang sama untuk ikon berikutnya.

 

25) Klik pada icon biru.

 

26) Tukar warna yang sesuai mengikut tema website anda.

Langkah 6: Mengubahsuai Menu dan Footer

Ok, kita dah hampir siap, seterusnya kita akan mengubahsuai menu dan footer. Bagi yang tidak tahu Menu adalah bahagian yang paling atas dan footer adalah bahagian yang paling bawah.

MENU
FOOTER

&nbsp

1) Untuk edit menu klik Theme Customizer.

2) Klik Header & Navigation. Di sini anda boleh mengubah suai menu mengikut citarasa anda.

3) Untuk Footer pula, klik Divi >> Theme Builder

4) Klik Add New Template >> Specific Pages >> Home. Jika anda ingin footer ini di semua page anda perlu klik pada All Pages.

 

5) Klik Edit

6) Klik Start Building >> dan pilih row seperti dibawah.

7) Untuk tukar warna background, klik Section Settings.

8. Klik Background >> Tukar warna yang sesuai.

9) Klik tanda Tambah sebelah kanan sekali dan taip Menu. Klik pada Menu.

10) Ubah suai menu tersebut dengan tukar background menu kepada transparent.

11) Tukar warna text kepada warna yang sesuai di bahagian Design.

&nbsp

12. Klik pada Tambah >> Social Media Follow

13. Tambah Media Social yang sesuai.

14. Ok saya nak bagi latihan pada anda. Nak tengok sama ada anda faham atau faham.

Cuba buat footer seperti di bawah. Caranya sama sahaja seperti kita buat website sebelum ini.

14. Tahniah! Anda berjaya bina website pertama anda.

Anda boleh check balik apa yang di sini:

Kandungan (Step by step cara buat website)

Catatan: Panduan ini mengandungi link affiliate. Jika anda membeli web hosting atau domain menggunakan link di post ini, saya akan menerima komisen dan anda tidak akan dikenakan bayaran tambahan. Terima kasih kerana menyokong.

Jika anda stuck semasa proses membina website, anda boleh hubungi saya melalui page Hubungi Saya.