MODUL ASAS PEMBINAAN LAMAN WEB

MENGGUNAKAN

DISEDIAKAN OLEH:
MUHAMMAD HAFIFI BIN RADZUWAN
PEGAWAI TEKNOLOGI PENDIDIKAN
PUSAT KEGIATAN GURU BUKIT GAMBIR
BAHAGIAN TEKNOLOGI PENDIDIKAN NEGERI JOHOR

0
ISI KANDUNGAN
___________________________________________________________________________

1.0 Pengenalan

2.0 Apakah maksud CMS?

3.0 Menggunakan WordPress sebagai CMS

4.0 WordPress.com dan WordPress.org

5.0 Membina laman web menggunakan WordPress.com

5.1 Menetapkan jenis laman web yang hendak dibina

5.2 Menetapkan fungsi yang hendak dimuatkan dalam laman web

5.3 Mendaftar akaun WordPress.com

5.4 Mengenali fungsi dashboard

5.5 Mengubah suai paparan pada laman web

5.6 Membuat kiriman

5.7 Menetapkan halaman

5.8 Menetapkan kemudahan Perkongsian (Sharing)

5.9 Menetapkan pautan

6.0 Menjadikan laman web kita sebagai laman web komuniti.

7.0 Langganan Blog (Follow)

8.0 Menggunakan kemudahan daripada pihak ketiga (3rd party function).

1
1.0 Pengenalan

Wordpress merupakan salah satu daripada tapak sumber terbuka (open source
platform) untuk membina laman web atau blog. Worpress dibangunkan dalam
bahasa pengaturcaraan PHP dan dijanakan bersama MySQL ‘database’.

Selain itu, WordPress juga merupakan salah satu sistem web yang membolehkan kita
membina blog dan laman web secara professional. Apabila kita telah menyimpan
(install) WordPress ke dalam Web Hosting dan mengaktifkan WordPress, maka kita
boleh mula menulis isi kandungan, membuat laman pautan (link), laman profil dan
sebagainya.

WordPress telah dihasilkan oleh Matt Mullenweg dan Ryan Boren sementara nama
‘WordPress’ telah dicipta oleh Christine Selleck. Fungsi utama WordPress ialah
menjadikan ia sebagai CMS (Content Management System) yang membenarkan
penulis blog mengubahsuai keseluruhan laman blog dan web mereka.

2.0 Apakah maksud CMS?

Secara umumnya, CMS bermaksud Content Management System iaitu sebuah

aplikasi atau alat yang berfungsi untuk membantu kita membuat pengisian (content).
Dalam hal ini, CMS yang dimaksudkan ialah pengisian dalam internet (web content).

CMS membantu kita memaparkan sesuatu isi dan informasi dalam laman web tanpa
perlu tahu cara untuk memprogramkan laman web itu sendiri. Tugas kita hanya
menulis isi manakala CMS akan membantu kita untuk menyiarkan isi tersebut
melalui laman web dengan sempurna.

3.0 Menggunakan WordPress sebagai CMS

Terdapat beberapa kelebihan yang perlu kita ketahui apabila menggunakan

WordPress yang akan bertindak sebagai CMS dalam membantu kita untuk
menghasilkan sesebuah laman web. Antara kelebihan tersebut adalah:

 WordPress boleh digunakan oleh semua orang awam dan para pembangun
laman web secara percuma.
 WordPress boleh disimpan (install) ke dalam server kita sendiri.
 WordPress menyediakan server percuma sekiranya kita tidak mempunyai
server sendiri.

2
  WorPress memiliki banyak tema yang boleh digunakan untuk mengubah
penampilan laman web kita.
 WordPress memiliki banyak plug-in yang boleh digunakan sebagai pelengkap
pada laman web kita seperti statistik, kalendar, hit counter, snap dan
sebagainya.
 WordPress boleh digunakan dalam versi Bahasa Melayu bagi sesiapa yang
kurang fasih berbahasa Inggeris.
 WordPress memiliki built-in Rich Text Editor sehingga kita boleh menulis blog
semudah menulis dokumen menggunakan MS Word.
 WordPress dilengkapi dengan kemudahan Spell-Check untuk membantu kita
menulis dalam Bahasa Inggeris yang betul.
 WordPress memiliki fungsi anti-spam yang berfungsi untuk menghalang pihak
lain menulis pesanan-pesanan berunsur promosi, pornografi dan pengaruh
yang lain pada ruangan Comment.
 WordPress menyediakan RSS Feed iaitu suatu fungsi yang memberikan
kemudahan kepada pengguna internet untuk mengakses maklumat secara
cepat dan seterusnya membuat pautan kepada laman web mereka.
 WordPress membenarkan kita mencipta blog komuniti iaitu suatu blog yang
boleh ditulis oleh ramai orang yang akan bertindak sebagai Administrator,
Editor, Author dan Contributor.

4.0 WordPress.com dan WordPress.org

VS

Terdapat dua jenis WordPress iaitu WordPress.com dan WordPress.org.

Wordpress.org merupakan suatu penyedia CMS yang kebiasaanya digunakan oleh
pembangun laman web (web developer) secara professional. Melalui WordPress.org,
kita boleh memuat turun aplikasi beserta keseluruhan fail CMS. Seterusnya, CMS ini
boleh diedit semula menggunakan pengetahuan tentang skrip PHP, CSS dan skrip
lain yang disertakan. Setelah itu, kita perlu memindahkan keseluruhan CMS ini ke
dalam server yang dimiliki oleh kita sebelum disiarkan ke dalam internet. Contohnya
seperti http://blog.us.playstation.com/.

Sebagai alternatif, cara yang cepat untuk membuat blog dan laman web tanpa
memerlukan pengetahuan tentang skrip pengaturcaraan komputer ini dan tanpa
perlu mempunyai server sendiri adalah dengan menggunakan WordPress.com.

3
 Melalui WorPress.com, kita boleh membina akaun laman web sendiri secara
percuma contohnya seperti http://pkgkalumpang2.wordpress.com/. Walau
bagaimanapun, kita mempunyai pilihan untuk memiliki domain sendiri yang boleh
dibeli melalui kemudahan yang disediakan contohnya seperti http://benihilmu.com/.

5.0 Membina laman web menggunakan WordPress.com

5.1 Menetapkan jenis laman web yang hendak dibina

Contoh:
 Blog
 Organisasi
 Forum
 Komersil
 Perniagaan
 Direktori
 Informasi
 Hiburan

5.2 Menetapkan fungsi yang hendak dimuatkan dalam laman web

Contoh:
- Perkongsian maklumat dan informasi
- Blog
- Muat turun (download) dokumen
- Soal selidik
- Ruang komen
- Forum
- Undian
- Mencetak informasi
- Chatting
- Membina koleksi foto dan video
- Pautan laman sosial; Facebook, Twitter
- Pautan kepada laman web lain

4
5.3 Mendaftar akaun WordPress.com

 Masuk ke laman http://wordpress.com/

 Klik pada Get Started Here atau sign up now.

 Tunggu beberapa saat sehingga halaman sign up muncul.

 Isikan maklumat yang diperlukan seperti nama alamat laman web

atau blog yang dipilih (Blog Address), nama pengguna (Username),
kata laluan (Password), alamat e-mail (E-mail Address) dan bahasa
yang dipilih (Blog Post Language).

5
 Setelah semua maklumat diisi, klik butang Create Blog.

6
 Sekiranya kita tidak mahu memiliki laman blog atau web sendiri, kita
mempunyai pilihan untuk mendaftar sebagai pengguna sahaja dengan
klik pada Sign up for just a username di bawah ruang Username.

 Selepas klik pada butang Create Blog, semak e-mail yang akan
dihantar oleh WordPress.com.
 Klik pada pautan yang disediakan untuk mengaktifkan akaun yang
telah didaftar.

 Selepas itu, kita akan dibawa ke halaman Daftar Masuk (Log In Page).
 Taipkan nama pengguna (Username) dan kata laluan (password) yang
telah kita tetapkan sebelum ini.
 Kemudian, klik Log In.

7
5.4 Mengenali fungsi dashboard

Selepas mendaftar masuk menggunakan nama pengguna dan kata laluan

yang betul, kita akan dibawa ke halaman Dashboard. Dashboard, merupakan
halaman belakang (back end) yang membolehkan kita untuk membuat
kiriman (post), menguruskan komen, menukar tetapan dan banyak lagi.

Segala kiriman dan tetapan yang telah diuruskan akan terpapar pada
halaman depan (front end) laman blog atau web yang boleh dilihat oleh
orang lain.

Untuk melihat halaman depan (front end) laman web, klik pada nama laman
web yang terletak pada bahagian atas Dashboard.

Back End

Front End

8
5.5 Mengubah suai paparan pada laman web

Melalui Dashboard, kita boleh mengubah suai paparan dan reka bentuk
laman web berdasarkan citarasa dan kreativiti kita.

 Pergi pada bahagian Appearance.

 Pada bahagian Appearance, terdapat beberapa fungsi yang disediakan
bagi membantu kita untuk melakukan pengubahsuaian.
 Bagi mengubah tema paparan (themes), klik pada Themes.

 Pada bahagian ini, kita boleh memilih tema yang sesuai dengan
paparan yang kita kehendaki.
 Setiap tema yang disediakan oleh WordPress.com mempunyai fungsi
dan bentuk paparan yang berbeza.
 Bagi tujuan latihan dalam kursus ini, kita akan menggunakan tema
Mystique.
 Kita juga boleh menetapkan pelbagai fungsi tambahan ke dalam
laman web menggunakan kemudahan Widgets.

9
 Untuk mengaktifkan fungsi widget yang dikehendaki, kita hanya perlu
klik pada widget tersebut dan tarik (drag) ke bahagian Default sidebar,
Secondary sidebar, First Footer Widget Area, Second Footer Widget
Area, Third Footer Widget Area atau Fourth Footer Widget Area.
 Untuk mengubah paparan belakang pada laman web, klik pada
Background yang akan memaparkan bahagian seperti di bawah.

 Untuk memuat naik gambar atau imej yang hendak dijadikan sebagai
paparan belakang, klik pada butang Choose File. Setelah memilih fail
imej yang dikehendaki, klik pada butang Upload.
 Bagi menukar warna paparan pula, klik pada Select a Color.
 Kita juga boleh menukar bahagian atas paparan (header) dengan imej
yang lain.

10
  Untuk menukar paparan atas (header) tersebut, klik pada Header.
 Selepas itu, kita akan dibawa ke bahagian Custom Header.

 Klik pada butang Choose File untuk memilih imej yang sesuai daripada
komputer kita.
 Kemudian, klik butang Upload.
 Selepas itu, klik butang Save Changes.
 Segala perubahan yang telah dibuat boleh dilihat melalui front end.

5.6 Membuat kiriman

Apabila segala tetapan pada paparan telah dilakukan, sudah pasti kita hendak
membuat kiriman yang boleh dibaca oleh semua pengunjung laman web kita.
Untuk berbuat demikian, langkah-langkah berikut perlu dilakukan:

 Pergi pada bahagian Posts.

11
  Klik Add New. Selepas itu, kita akan dibawa ke paparan di bawah.

Konfigurasi
kiriman.

 Taipkan tajuk kiriman.

 Taipkan kiriman dalam ruang yang disediakan.
 Terdapat beberapa fungsi yang disediakan dalam bahagian ini yang
membolehkan kita menetapkan media yang ingin dimasukkan dan
tetapan pada bentuk kiriman yang ingin dipaparkan.
 Selepas menaip atau meletakkan kiriman pada ruang yang disediakan,
pilih format dan kategori kiriman.

12
  Bagi kiriman yang biasa, pilih format Standard.
 Sekiranya kiriman kita berbentuk gambar atau koleksi foto, pilih
format Image atau Gallery.
 Sebelum menyiarkan kiriman, pilih kategori kiriman yang sesuai.
 Kita juga boleh menambah jenis kategori (Add New Category) yang
dikehendaki oleh kita.
 Setelah semua tetapan telah dilakukan, tibalah masa untuk
menyiarkan kiriman kita.
 Kita mempunyai beberapa pilihan sama ada melihat kiriman dahulu
(preview), simpan sebagai draf (save draft) atau terus menyiarkan
kiriman tersebut (publish).

5.7 Menetapkan halaman

Kita boleh menetapkan bilangan dan jenis halaman (pages) yang hendak
dipaparkan. Setiap halaman hendaklah mempunyai fungsi yang berbeza agar
memudahkan pengunjung untuk mendapatkan maklumat.

 Pergi pada bahagian Pages.

 Klik Add New.
 Selepas itu, kita akan dibawa ke halaman Add New Page.

13
 Pada bahagian ini, kita boleh menetapkan tajuk halaman (page) dan
maklumat yang ingin dipaparkan.
 Kita juga boleh menetapkan sama ada halaman ini boleh dilayari oleh
semua pengunjung atau terhad kepada pengunjung tertentu yang
mempunyai kata laluan.
 Untuk membuat kata laluan pada halaman ini,pergi pada bahagian
Publish.
 Kemudian, pergi pada bahagian Visibility klik pada Edit.

 Selepas itu, klik pada butang Password protected.

 Masukkan kata laluan (password) yang dipilih dan klik OK.

14
 Kemudian, klik butang Publish.
 Tetapan seperti ini juga boleh dilakukan pada kiriman (post).
 Sekiranya kita ingin menjadikan halaman utama (Home) menjadi
halaman yang statik, manakala semua kiriman (post) kita disiarkan
dalam halaman Blog, beberapa tetapan perlu dilakukan.
 Pertama, kita perlu membuat halaman yang baru dengan nama
Utama atau Home.
 Seterusnya, pergi kepada bahagian Settings dan klik pada Reading.

 Kemudian, kita akan dibawa ke halaman Reading Settings.

 Klik pada butang A static page. Bagi Halaman Utama (Front page) pilih
Utama manakala bagi halaman kiriman, pilih Blog.
 Setelah semua tetapan telah dibuat, klik butang Save Changes.

15
5.8 Menetapkan kemudahan Perkongsian (Sharing)

Kemudahan perkongsian (sharing) ini membolehkan kita untuk menetapkan

laman sosial yang boleh dihubungkan bersama laman web atau blog kita.
Selain itu, kita juga boleh menetapkan butang atau ikon yang berfungsi untuk
memberi peluang kepada pengunjung berkongsi maklumat daripada laman
web atau blog kita.

Pengunjung boleh mencetak maklumat daripada kiriman yang disiarkan,

menyimpan kiriman dalam bentuk PDF serta berkongsi kiriman tersebut
melalui e-mail, Facebook dan Twitter.

Terdapat beberapa langkah yang perlu dilakukan bagi mengaktifkan fungsi

ini.

 Pergi pada bahagian Settings.

 Klik Sharing.

16
  Kemudian, kita akan dibawa ke halaman Sharing Settings.

 Untuk menghubungkan laman web kita bersama Facebook, klik pada

Connect to Facebook. Cara yang sama juga digunakan untuk
menghubungkan laman web kita kepada laman sosial yang lain.
 Untuk membenarkan pengunjung berkongsi maklumat yang kita
sediakan, klik pada servis yang disediakan pada bahagian Available
Services dan tarik (drag) ke bahagian Enabled Services.

5.9 Menetapkan pautan

Kita boleh menetapkan pautan kepada laman web yang lain melalui fungsi
Link. Malah kita juga boleh menetapkan pautan bagi kiriman yang terdapat
dalam laman web yang sama.

17
 Sebelum menetapkan pautan (link), kita perlu menetapkan kategori
pautan (Link Categories).
 Klik pada Link Categories.

 Taip nama kategori yang dikehendaki dan klik butang Add New Link
Category.
 Kemudian, pada bahagian Links, klik Add New.
 Taipkan nama pautan dan alamat / URL laman web yang hendak
dipautkan.
 Pilih kategori yang sesuai.
 Setelah tetapan telah dibuat, klik pada butang Add Link.

18
6.0 Menjadikan laman web kita sebagai laman web komuniti.

WordPress.com menyediakan fungsi yang membolehkan kita menjadikan laman web

atau blog yang dibangunkan menjadi laman web komuniti. Laman web komuniti
bermaksud semua pengunjung boleh mengirim serta menyumbangkan kiriman yang
akan disiarkan dalam laman web yang kita bangunkan.

Terdapat empat kategori pengguna bagi tujuan ini.

i. Administrator
Administrator mempunyai pemilikan yang penuh terhadap laman web yang
dibangunkan dan boleh membuat sebarang tetapan yang dikehendaki. Hanya
seorang sahaja Administrator dicadangkan untuk mempunyai pemilikan
penuh tersebut.

ii. Editor
Pengunjung atau pengguna yang berperanan sebagai Editor boleh menyiar,
mengedit dan membuang mana-mana kiriman atau halaman. Seorang Editor
juga boleh memuat naik fail dan imej ke dalam kiriman.

iii. Author
Pengunjung atau pengguna yang berperanan sebagai Author hanya boleh
menyiar, mengedit dan membuang kiriman mereka sahaja. Mereka juga
boleh memuat naik fail dan imej ke kiriman mereka.

iv. Contributor
Pengunjung atau pengguna yang berperanan sebagai Contributor pula boleh
mengedit kiriman mereka tetapi tidak boleh menyiarkan kiriman tersebut.
Apabila mereka membuat kiriman, kiriman tersebut perlu mendapat
pengesahan daripada Administrator sebelum boleh disiarkan. Setelah kiriman
tersebut disiarkan, kiriman tersebut tidak boleh lagi diedit oleh Contoributor.

Untuk menetapkan pengunjung atau pengguna kepada kategori-kategori ini,

beberapa langkah perlu dilakukan.

 Pergi ke bahagian Users dan klik Invites.

19
  Kemudian, kita akan dibawa ke halaman di bawah.

 Perlu diingatkan bahawa hanya pengguna atau pengunjung yang berdaftar

dengan akaun WordPress sahaja dibenarkan untuk menjadi pengguna.
 Para pengunjung atau pengguna mempunyai pilihan untuk mendaftar akaun
WordPress.com dengan mempunyai laman blog atau hanya berdaftar untuk
memperoleh akaun WordPress tanpa memiliki laman blog sendiri.
 Isikan maklumat pengguna atau pengunjung yang diperlukan.
 Setelah semua maklumat dilengkapkan, klik pada butang Send Invite.
 Para pengguna atau pengunjung yang telah dijemput (Invite) akan menerima
e-mail daripada WordPress.com untuk mengesahkan persetujuan mereka.

7.0 Langganan Blog (Follow)

Suatu ciri yang menarik dalam WordPress.com ialah para pengunjung boleh
melanggan secara percuma semua kiriman yang disiarkan. WordPress.com akan
menghantar semua kiriman yang disiarkan terus ke dalam e-mail mereka.
Kemudahan ini merupakan suatu cara yang sangat efektif kepada para pengunjung
untuk mendapatkan informasi yang disiarkan melalui kiriman.

Langganan boleh dibuat melalui Front End dengan mengisi ruang langganan (Follow)
atau klik pada butang Follow yang disediakan oleh WordPress.com.

20
 atau

8.0 Menggunakan kemudahan daripada pihak ketiga (3rd party function).

Walaupun kita boleh menguruskan pelbagai tetapan pada bahagian Dashboard,

namun kita masih boleh menggunakan kemudahan daripada laman web pihak
ketiga untuk mandapatkan pelbagai fungsi yang menarik untuk dimasukkan dalam
laman web atau blog.

Antaranya seperti:

 Google Products http://www.google.com.my/intl/en/options/

 Calendar
 Docs
 Feedburner
 Youtube http://www.youtube.com/
 Soundcloud http://soundcloud.com
 Facebook http://www.facebook.com/
 Twitter http://twitter.com/
 Alhabib Islamic Widget http://www.al-habib.info/
 Vodpod http://vodpod.com/
 24Counter.com http://24counter.com/
 PollDaddy http://polldaddy.com/

21