CIKGUITI.COM RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA!

-Beginners-

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

1. EXTRACT kandungan DVD [Software4Developer -2.08GB] & [Extension4Joomla3.20GB] ke dalam satu folder [Kursus Bina Website]. 2. Memasang Localhost Web server mengunakan perisian XAMPP. PAUTAN DOWNLOAD http://www.apachefriends.org/download.php?xampp-win32-1.7.7-VC9installer.exe @ BUKA folder [Kursus Bina Website] seterusnya.. BUKA folder [Software 4Developer] seterusnya... PILIH folder [XAMPP]. KLIK 2x icon xampp-win32-1.6.6a-installer. KLIK butang <Run> PILIH bahasa [English] KLIK <ok>. Dialog Box Welcome.. dipaparkan KLIK <Next>. Dialog Box Destination Folder.. dipaparkan PILIH c:\xampp KLIK <Next>. Dialog Box XAMPP option.. dipaparkan. TANDA KOTAK PILIHAN Install Apache as Service. TANDA KOTAK PILIHAN Install MySQL as Service. KLIK <Install>. Dialog Box Installing.. dipaparkan. TUNGGU sehingga proses pemasangan selesai. Dialog Box Completely the XAMPP.. dipaparkan. KLIK <Finish>. XAMPP Control Panel akan dipaparkan pada sebelah kanan Desktop anda. Pastikan kedua-dua Service Apache dan MySQL anda dalam status <Running>. 3. Ujiguna Local webserver anda. Untuk menguji fungsi Web Server anda, TAIP http://localhost pada web browser anda [Mozilla Firefox] ataupun [Google Chrome]. Web Browser anda akan mengarahkan kepada site http://localhost/xampp/splash.php KLIK pautan English. KLIK pautan status untuk mengenalpasti Service yang disediakan berfungsi. KLIK pautan security untuk mengaktifkan opsyen keselamatan.[Kita akan pelajari dengan lebih detail nanti]. KlIK phpMyAdmin dibahagian Tools anda akan melihat Database bagi Web Server anda.

[2]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

4. Memasang CMS Joomla 1.5.23 kedalam Localhost Web Server. PAUTAN DOWNLOAD http://joomlacode.org/gf/download/frsrelease/14506/63460/Joomla_1.5.23Stable-Full_Package.zip @ KLIK My Computer 2x. KLIK Local Disk (C:) sterusnya buka folder xampp. KLIK folder htdocs. KLIK tetikus kanan dan BINA satu folder baru dengan nama ringkas anda. Cth: khairul [Huruf kecil tanpa symbol dan spacing]. KLIK folder nama anda 2x. COPY nama yang tertera di toolbar Address anda Cth. C:\xampp\htdocs\khairul. KLIK folder [Kursus Bina Website] KLIK folder [Softawre4Developer] KLIK folder [Installer J15] EXTRACT installer Joomla_1.5.23-Stable-Full_Package ke dalam folder C:\xampp\htdocs\khairul. Setelah selesai BUKA folder C:\xampp\htdocs\. KLIK Kanan tetikus anda Open With -- > Notepad fail index.php. TUKAR header('Location: '.$uri.'/xampp/'); kepada header('Location: '.$uri.'/nama folder anda/'); Cth: header('Location: '.$uri.'/khairul/'); Seterusnya SAVE fail tersebut. KLIK Web Browser anda 2x dan TAIP pada Toolbar URL http://localhost/. 5. Proses Installasi Joomla dalam Web Hosting anda. Joomla Installation dialog box dipaparkan pada skrin anda. PILIH bahasa yang sesuai kemudian KLIK <Next> pada Choose Language bar. KLIK <Next> pada Pre-installation Check bar. KLIK <Next> pada License bar. TAIP butiran dibawah dalam Database Configuration dialog box. Host Name : localhost Username : root Password : _____ < --- Kosongkan!. Database Name : abcd123 < --- Nama Folder Anda !. KLIK <Next> pada Database Configuration bar. KLIK <Next> pada FTP Configuration bar. * Tidak perlu masukkan apa-apa!. Di bahagian Main Configuration TAIP maklumat dibawah. [3]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

Site Name : www.namaAnda.com Domain Name anda Your E-mail: namaAnda@gamil.com Email anda Admin Password: 1234 Confirm Admin Password: 1234 Install Default Sample Data: JANGAN TEKAN BUTANG Install Sample Data!!. KLIK <Next> pada Main Configuration bar. KLIK <OK> pada dialog box No Sample data or... Finish [Congratulations! Joomla! is now installed.] akan dipaparkan. Mesej dibawah akan tertera. PLEASE REMEMBER TO COMPLETELY REMOVE THE INSTALLATION DIRECTORY. You will not be able to proceed beyond this point until the installation directory has been removed. This is a security feature of Joomla!. Administration Login Details Username: admin 6. Menghapuskan Folder Installation dalam Local Web Server anda. KLIK My Computer 2x. BUKA folder C:\xampp\htdocs\Nama Anda. BUANG folder installation. KLIK web Browser anda dan TAIP http://localhost. TAHNIAH!! Anda akan lihat Website anda telah dibina dengan Mudah dan pantas. 7. Menguruskan Laman web anda dengan MUDAH dan FLEKSIBLE. TAIP http://localhost/Nama Folder anda/Administrator pada toolbars address Web Browser anda. TAIP maklumat Joomla! Administration Login seperti dibawah. Username : admin Password : 1234 Sekarang anda sedang berada di bahagian Pengurusan Laman Web CMS JOOMLA. Toolbar Administration terdiri dari pada menu seperti dibawah. Site Control Panel User Manager Media Manager Global Configuration Logout

[4]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

Menus Menu Manager Menu Trash Main Menu Contents Articles Manager Articles Trash Section Manager Category Manager Frontpages Manager Components Banner Contact News Feeds Polls Search Weblinks Extensions Install/Uninstall Module Manager Plugin Manager Template Manager Language Manager Tools Helps 8. Mengurus tahap keselamatan Pentadbir dan Pengguna Laman web Anda. KLIK Site User Manager PILIH Administrator. Name : Masukan nama penuh anda. Username : Masukan nama pengguna E-mail : Masukan email anda New Password : Tukar kepada password baru anda Verify Password : Taip semula password baru anda Group :-Super Administrator Kekalkan. Anda boleh mengubahsuai Parameter disebelah kanan jika perlu. KLIK <Save>. 9. Mengurus Folder Simpanan Media anda. KLIK Media Manager stories. TAIP satu folder baru bagi ruangan simpanan media anda. Cth: portalmedia KLIK <Create Folder> [5]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

KLIK folder baru anda KLIK <Browse> muatnaik satu fail image ke dalam folder tersebut. KLIK <Start Upload>. 10. Mengurus Global Configuration. KLIK Site Global Configuration Site Setting. KLIK butang Yes untuk menukar mod paparan hadapan kepada Website sedang diselenggara pada option Site Offline. KLIK butang Nos untuk menukar mod paparan hadapan kepada asal. TAIP mesej Website sedang diselenggara.. dalam Offline Message. TAIP nama laman web anda pada ruanagan Site Name. PILIH editor penulisan bagi artikel anda dibahagian Default WYSIWYG Editor. Penetapan Bahagaian Metadata Settings TAIP pengenalan ringkas berkaitan laman web anda Global Site Meta Description. Cth: Portal Rasmi Perniagaan Aziemart Enterprise.. TAIP kata kunci yang memudahkan pencarian engin carian internet berkaitan laman web anda Global Site Meta Keywords. Cth: Aziemart, aziemart, Perniagaan, Usahawan, Aziemart Enterprise, KLIK Site Global Configuration System Setting. Bahagian ini untuk menguruskan pengurusan system dalam Joomla. User Settings Media Settings Debug Settings Cache Settings Session Settings KLIK Site Global Configuration Locale Settings FTP Settings Database Settings Mail Settings 11. Mengurus Menu. KLIK Menu Menu Manager KLIK butang <New> untuk menambah menu baru Unique Name: masukan nama unik Cth: topmenu Title: Nama menu baru anda Cth: Top Menu Description: Keterang menu Cth: Menu bahagian atas Module Title: Nama bahagian menu Cth:Top Menu KLIK <Save> [6]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011

Server Setting.

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

12. Tambah satu menu baru [Halaman utama/Home] dalam Top Menu. PILIH Menu Manager Top Menu KLIK ikon Edit Menu item(s) KLIK butang hijau <New>. PILIH Select Menu Item Type Internal Link Page Blog Layout. Menu Item Details. Title: Alias: Link: Display in: Parent Item:

Articles

Front Page

Front

TAIP Halaman Utama / Home Abaikan bahagian ini SEO Autogenerated Abaikan bahagian ini AutoLink generated Top Menu Top

Parameters (Basic) # Leading: 1 # Intro: 4 # Columns: 1 Asal 2 TUKAR kepada 1 # Links: 4 KLIK <Save>. KLIK Extensions Module Manager KLIK Top Menu 2x Details Module Type: mod_mainmenu Title: Top Menu Show Title: Asal Yes TUKAR No Enabled: Asal No TUKAR Yes Position: Asal left TUKAR User3 Menu Assignment Menus: Module Parameters Menu Name: Menu Style: Always show sub-menu Items KLIK <Save>. KLIK <Preview>.

All

topmenu List Asal No TUKAR Yes.

[7]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

13. Tambah Menu [Hubungi Kami] dalam Top Menu. KLIK Components Category: [ New ] Title: Alias: Published: KLIK <Save>. Contacts Categories

TAIP Peg Pehubungan Pelanggan (CSO) asal Auto Yes

Category Manager: [ Contact Details ] KLIK <New> Contact: [ New ] Details Name: Alias: Published: Category: Linked to User:

Contacts

TAIP Nama Pegawai CSO Cth: CSO Khairul Asal autogenerate. Yes PILIH kategori yang telah anda Bina Cht: Peg. Peh. Pelan. CSO Asal No user-

Information Contact's Position: E-mail: Street Address: Town/Suburb: State/County: Postal Code/ZIP: Country: Telephone: Mobile Phone Number: Fax: Web URL:

TAIP Pegawai CSO TAIP Email Pegawai CSO TAIP Alamat Lengkap TAIP Nama Daerah TAIP Nama Negeri TAIP Poskod TAIP Nama Negara TAIP No. telepon TAIP No. H/P TAIP No. Fax TAIP Nama Website

Parameters Contact Parameters PILIH bahagian <Show> yang ingin dipaparkan atau <Hide> Untuk tidak dipaparkan . KLIK <Save>. Seterusnya.. PILIH Menu Manager Top Menu KLIK ikon Edit Menu item(s) KLIK butang hijau <New>. [8]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011

RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA! BY WWW.CIKGUITI.COM

PILIH Select Menu Item Type Contacts Category Layout. Menu Item Type Standard Contact Layout Menu Item Details Title: TAIP Hubungi Kami Alias: asal Autogenerated Link: Asal Autogenerated Display in: Top Menu Parent Item: Top Published: Yes Parameters (Basic) Select Contact: KLIK <Save>. KLIK <Preview>. KLIK <Hubungi Kami>.

Contact

Standard Contact

[Nama Anda/Personel Pengguna]

14. Bersambung.. Ikuti di Kursus Pembangunan & Pengurusan Laman bersama Cikguiti.com 013-7778732 www.cikguiti.com |admin@cikguiti.com

[9]
RUJUKAN PANTAS UNTUK PEREKA LAMAN WEB JOOMLA Hakcipta Terpelihara 2011 Aziemart Enterprise http://www.ciikguiti.com Oktober 2011