Pandua P anMu udahdan d Ce epatPe embin naan Websi We iteJoo oml la1.

5 1

By A tech.c Aridzt com

Aridztech h.com P Page0


Kandungan 1. Latarbelakang Joomla 1.1 Sejarah 1.2 Versi 1.3 Kelebihan 2. Cara install Joomla 2.1 Domain dan webhosting 2.2 Cpanel, Softaculous atau Fantastico 2.3 Periksa tiga pages: mukadepan, administrator dan template 2.4 Memeriksa file dengan Filezilla 3. Pemilihan template 3.1 Carian template percuma 2 column atau 3 column 3.2 Download template 3.3 Install template 3.4 Ubahsuai gambar dan caption template 4. Global Configuration 4.1 Masukkan nama website, description dan keywords 4.2 Carian keywords dengan Adwords keyword tool 5. Menu dan Submenu 5.1 Mengubahsuai default menu 5.2 Membina menu baru 5.3 Membina sub-menu 5.4 Aktifkan di module manager 6. Section, Category dan Article 6.1 Membina Section 6.2 Membina Category 6.3 Membina Article 6.4 Setting Tiny MCE 6.5 Memasukkan gambar 6.6 Memasukkan Link 6.7 Memasukkan HTML code 6.8 Article meta data

Aridztech.com

Page1

7. Module manager 7.1 Carian module 7.2 Install module

8. Mengemaskinikan website 8.1 Bina password user lain 8.2 Tips- tips berguna

Aridztech.com

Page2

1. Latarbelakang Joomla 1.1 Sejarah Joomla adalah merupakan satu aplikasi CMS (Content Management System) untuk membina website. Ianya menggunakan teknik object programming tanpa memerlukan pengguna menulis script programming kerana modul- modul untuk tujuan tertentu sudah tersedia ada. Nama "Joomla" diambil daripada perkataan Swahili iaitu jumla yang bermaksud "mari bersama-sama" atau "secara keseluruhannya". Ia dipilih bagi menunjukkan komitmen pasukan pembangunan dan komuniti projek berkenaan.

Aridztech.com

Page3

1.2 Versi Ianya amat memberikan kemudahan kepada mereka yang tidak mempunyai latar belakang IT mahupun yang ada latar belakang IT tetapi sudah lama tidak mengemaskinikan pengetahuan di dalam bidang ini. Joomla telah dibangunkan semenjak tahun 2005 berdasarkan kepada aplikasi Mambo. Ianya bermula dengan Joomla 1.0 tetapi hanya menjadi popular apabila Joomla 1.5 diperkenalkan pada penghujung tahun 2007. Banyak modul modul yang dibina untuk menyokong Joomla 1.5 telah menjadikan penggunaan Joomla semakin meluas di dalam bidang pembinaan website. Joomla 1.6 telah dikeluarkan pada tahun 2010 tetapi masih banyak lagi aplikasi modul yang tidak menyokong Joomla 1.6. Oleh itu, Joomla 1.5 masih lagi menjadi pilihan. 1.3 Kelebihan Kenapa Joomla 1.5 semakin digemari? Sebenarnya Joomla 1.5 telah menukar cara pembinaan website yang secara tradisinya menggunakan software- software seperti NVU, Kompozer, Microsoft Frontpage, Microsoft Expression dan juga Adobe Dreamweaver. Dengan Joomla, software- software ini tidak diperlukan lagi. Kemaskini website boleh dilakukan secara mudah sekali dengan melakukannya secara online. Sudah pasti Satu lagi keistimewaan Joomla, sebarang kemaskini boleh dilakukan secara terus oleh sesiapa sahaja tanpa memerlukan bantuan webmaster. Ianya adalah seperti menggunakan aplikasi Microsoft Word apabila kita ingin mengemaskinikan bahagian artikel. Jelas sekali, sesiapa sahaja di dalam organisasi boleh mengemaskinikan maklumat secara tepat dan cepat. Jika dahulu, orang ketiga diperlukan iaitu webmaster dan ada kemungkinan maklumat yang diletakkan adalah tidak lengkap ataupun tidak tepat. Sudah tentu, setiap orang yang mempunyai username dan password sahaja dibenarkan untuk mengemaskinikan website yang dibangunkan di dalam Joomla itu. Dengan Joomla, masalah pembinaan website daripada segi rekabentuk dan penampilan telah dapat diselesaikan. Pengggunaan template yang boleh diubahsuai telah mengatasi penggunaan template tradisional dengan menggunakan HTML. Jelas sekali, Joomla bakal menjadi tumpuan dan arahtuju pembinaan website di masa hadapan.

Aridztech.com

Page4

2. Cara install Joomla 2.1 Domain dan webhosting Sebelum kita membina website, kita pelulah memiliki domain dan webhosting. Domain adalah alamat sesebuah website. Ianya juga dipanggil URL. Hosting pula adalah merupakan tempat menyimpan file. Sama seperti laptop ataupun computer, kita memerlukan hardisk untuk menyimpan file. Hosting adalah tempat menyimpan file di Internet. Komputer yang bertindak sebagai hosting dipanggil server. Kos untuk memiliki kedua- dua ini tidaklah mahal, yang kita perlu adalah bermula dengan pakej yang paling rendah kerana pakej ini boleh diupgrade jika diperlukan nanti. Untuk domain terbaik, ianya didalam dua atau tiga suku kata perkataan sahaja. Apabila disebut secara lisan, orang yang mendengarnya boleh mengeja tanpa sebarang kesalahan. Nama domain yang mempunyai keywords adalah lebih baik daripada kedudukan di search engine. Ianya adalah satu cara SEO (Search Engine Optimization). Hosting pula perlulah memiliki database. Kebanyakan hosting menawarkan database ataupun Cpanel. Jika kita pengguna GDI (Global Domains International), kita boleh mendapatkan hosting yang mempunyai database di www.joomla-hoster.com

2.2 Cpanel, Softaculous atau Fantastico

Cara mudah untuk menginstall ialah dengan menggunakan auto-installer di dalam Cpanel. Cpanel ataupun control panel adalah platform untuk kita menguruskan hosting. Auto-installer yang terdapat di dalam Cpanel adalah softaculous ataupun Fantastico. Softaculous menawarkan lebih banyak rangkaian software kalau dibandingkan dengan Fantatisco. Namun, kedua-duanya boleh digunakan untuk Joomla 1.5 installation.

Aridztech.com

Page5

Install Jo oomla 1.5 dengan d Sof ftaculous. 1. Login ke dalam Cpanel. C

an Softaculous. 2. Pergi ke bahagia

Aridztech h.com

Page6

3. Pilih bahagian Joomla.

4.Pilihan tab bahagian Install.

Aridztech.com Page7

5. Isikan maklumat yang diperlukan untuk installation. Choose Protocol: Choose Domain: In Directory: Database name: Site Name: Site Description: Table prefix: Sample data: Admin username: Admin password: Real name: Admin email: Email installation details to :

6. Installation telah disempurnakan.

Aridztech.com

Page8

Install Jo oomla 1.5 dengan d Fan ntastico. 1. Login ke dalam Cpanel. C Pe ergi ke baha agian Fanta atisco.

b Jo oomla 1.5. Klik bahagian New Ins stallation. 3. Pilih bahagian

Aridztech h.com Page9

4. Pilihan tab bahagian Install.

5. Isikan maklumat yang diperlukan untuk installation. Install on domain: Install in directory: Administrator username: Password: Admin-email: Admin full name: Site name: Install sample data: 6. Installation telah disempurnakan.

Aridztech.com

Page10

2.3 Periksa tiga pages: mukadepan, administrator dan template Ketika kita membangunkan website di dalam Joomla. Ada tiga webpages yang perlu dijadikan panduan: Front page : www.domainanda.com Bentuk sebenar website.

Administrator page : www.domainanda.com/administrator - Pembinaan website.

Aridztech.com

Page11

Template page: www.domainanda.com/?tp=1 -

Lokasi pembahagian website.

Buka tiga tabs untuk setiap page ini untuk memudahkan kita membuat kerja pembinaan website. 2.4 Memeriksa file dengan Filezilla Filezilla adalah software percuma yang membolehkan kita menghubungi hosting dengan pantas. Ianya memerlukan 4 inputs sebelum kita boleh mendapat akses tersebut. Ianya adalah: Host Username Password Port Semua info berikut akan diberikan oleh pihak hosting. Sebagai contoh: Host: www.aridztech.com

Aridztech.com

Page12

Username: aridztec Password: abcd1234 Port: 21 Nota: Port untuk hosting adalah sentiasa 21. Setelah kita mendapat akses tersebut, kita boleh melihat file- file yang telah diinstall di dalam hosting. Ianya terletak di dalam directory Public HTML.

3. Pemilihan template 3.1 Carian template percuma 2 columns atau 3 columns

Selalunya, kita tidak mengeluarkan kos yang tinggi sebelum perniagaan yang kita buat itu belum berhasil. Jauhkan diri daripada mengeluarkan perbelanjaan yang tidak sepatutnya sedangkan kita boleh mendapatkannya secara percuma. Ini termasuklah template untuk Joomla website. Banyak menawarkan template yang menarik tetapi kita perlu membelinya dengan harga USD50- USD100 bergantung kepada jenis template. Namun, kita juga boleh mendapatkannya secara pecuma yang dikategorikan sebagai non-commercial. Antara jenis template yang selalu digunakan adalah 2 column atau 3 column. Ianya adalah bergantung berapa banyak informasi yang anda ingin letak di dalam website anda. Jika banyak, elok digunakan 3 column kerana kita boleh menbuat banyak menu untuknya. Antara cara yang boleh digunakan ialah Google dengan keywords: Contoh: 2 columns free joomla 1.5 template, ataupun Contoh: 3 columns free joomla 1.5 template. Website- website yang memberikan template percuma:
http://www.siteground.com/joomlatemplates.htm http://www.joomlaxe.com/ http://www.joomla24.com

Aridztech.com

Page13

3.2 Download template File yang di download adalah di dalam bentuk zip file. Kita tidak perlu unzip file ini. File yang di download biasanya di simpan di dalam download folder. Jadi, kita boleh mendapatkannya daripada sana.

3.3 Install template Setelah download template tersebut, kita boleh install di bahagian Install. Extensions > Install/Uninstall

Kemudian, kita boleh memilih template tersebut di bahagian template manager. Extensions > Template manager

Aridztech.com

Page14

3.4 Ubahsuai caption template dan gambar header. Untuk mengubah caption template, kita perlu pergi ke edit HTML di dalam template manager.

Di dalam Edit HTML , kita boleh menukar caption yang ada.

Aridztech.com

Page15

Gambar header boleh diubahsuai atau ditukar sama sekali dengan gambar yang baru. Yang penting, ukuran gambar itu mestilah sama. Cara yang paling senang adalah mengdownload gambar tersebut menggunakan filezilla dan diubahsuai menggunakan Photoshop. Kemudian, gambar tersebut boleh diupload kembali ke dalam template. Jangan ubah nama file gambar tersebut kepada nama yang lain. Dapatkan gambar Header dengan menggunakan Filezilla

. Edit menggunakan Photoshop.

Pastikan periksa tiga pages: mukadepan, administrator dan template

Aridztech.com Page16

4 Global Configuration 4.1 Masukkan nama website, description dan keywords Global configuration adalah tempat kita boleh customize mesej jika website kita masih di dalam pembinaan. Ia juga adalah tempat untuk Metadata seperti website title, description dan keywords.

Site Name: Global Site Meta Desription: Global Site Meta Keywords.

Aridztech.com

Page17

4.1 Carian keywords dengan Adwords keyword tool

Letakkan find keywords untuk tema website kita. Boleh letakkan beberapa perkataan dan download keywords tersebut. Keywords boleh dicopy dan diletakkan di dalam keywords di Global Configuration. Boleh letak beberapa perkataan di dalam bentuk beberapa baris. Sebagai contoh usahawan Internet.
Keyword bisnis iklan peluang pendapatan perniagaan usahawan bisnes kerja di rumah keje part time

Aridztech.com

Page18

5. Menu da an Submen nu 5 Mengub 5.1 bahsuai def fault menu u Menu da an submenu adalah ba ahagian pe enting di dal lam website e untuk tuju uan penyusu unan maklu umat dan na avigasi. Ian nya boleh di ibina untuk memberika an info-info o yang berada di dala am website e adalah leb bih tersusun n. Apakah menu? dalah kump pulan pilihan kepada to opik topik k tertentu di i dalam web bsite. Menu ad Apakah submenu? Submen nu adalah pilihan p kepa ada topik topik t terten ntu di dalam m website.

Mengub bahsuai defa ault menu

Apabila kita mengg gunakan sa atu template e, satu defa ault menu diberikan.

D dalam administrator page, kita akan dapat Di t lihat

Sekarang, katakana S k kit ta ingin menukar Main n menu kep pada Utama a dan Home e kepada peng genalan. Pergi ke Mo P odule Manag ger> Main menu T Tukar Title daripada d Ma ain Menu kepada k Utam ma
Aridztech h.com Page19

K Keputusann ya:

M Main menu telah t bertuk kar kepada a Utama Sekarang kita akan me S enukar Hom me kepada Pengenalan M Menus > Ma ain menu >

S Sudah bertu ukar kepada a

mbina men nu baru 5.2 Mem

Kita boleh membina K m me enu baru se elain daripa ada utama di d atas. Seb bagai conto oh, saya ingin membina m me enu Pauta an penting C Caranya, Menus M > Me enu manage er > Create new

Jadi, menu suda ah pun terbentuk:

Aridztech h.com Page20

5.3 Mem mbina sub-menu Walupun kita telah lengkap pkan langka ah ini, menu u belum lag gi ditunjukka an sebel lum kita me embina sub b-menu. Sek karang, kita a akan mula akan submenu. Klik kepada k Pau utan Penting g.

Pilih external e link, dan kata akan kita ing gin membuat link kepa ada Mayb bank2u. Taip full addre ess Mayban nk2u. Pilih New windo ow open with Browser Navigation.

Aridztech h.com

Page21

5.4 Akti ifkan di mo odule mana ager Kemu udian, pergi ke module e manager. . Klik enable e module.

Selep pas module e telah dien nabled. Me enu dan Submenu tela ah pun terbentuk.

Aridztech h.com

Page22

6. Section, , Category dan Article Section, Category dan d Article adalah ber rtujuan untu uk member rikan kemud dahan di da alam mengkelasifikasika an. Untuk memudahka m an penggunaan Section, Category y dan Articl le, eh menggun nakan contoh berikut: kita bole
Menu ya ang mengguna akan Article sahaja s mengg gunakan Sect tion/ Category y Menu u/Section Utama Submenu/ Category Pengenalan n Produk Testimoni Pembelian Type e Article Article Article Article Title Peng genalan Prod duk Testimoni Pembelian

Menu di bawah tidak memerlukan Section/ Cate egory Menu M Capaian penting Sub bmenu Maybank CIMB Type e External link External link Title Mayb bank CIMB B

6.1 Mem mbina Sect tion

Cara me embina sec ction ialah pergi p ke Co ontent > Se ection Mana ager

w Klik New

K Save, Section Klik S untu uk Utama te elah pun di bina.

Aridztech h.com Page23

6.2 Mem mbina Cate egory Cara me embina cate egory deng gan pergi ke e Content > Category manager , Klik New.

B Bina Catego ory untuk pe engenalan

K Save. Category Klik C un ntuk pengen nalan telahp pun dibina.

Aridztech h.com

Page24

B Bina untuk category c ya ang lain, pro oduk, testim moni dan pe embelian.

mbina Artic cle 6.3 Mem Article adala A ah isi kepad da website tersebut. t U Untuk memb binanya, clic ck new di dalam Article e manager.

M Masukkan te ext

Aridztech h.com

Page25

6.4 Sett ting Tiny MCE M Exten nsions > Plu ug-ins > AE Editor-TinyM MCE

Pilih Functionalit F ty : Extende ed Kemb bali kepada a Article dan n lihat lebih h banyak function yang g terdapat.

masukkan gambar g 6.5 Mem Klik bahagian b im mage di baw wah menu ini:

Aridztech h.com

Page26

Uploa ad gambar terlebih dahulu. Brows se dan star rt upload.

ersebut dan Insert ima age. Setelah upload , barulah klik image te

6.6 Mem masukkan Link L Highlightkan per rkataan unt tuk dibuat li ink dan klik k link, windo ow berikut akan a terbuka.

Aridztech h.com

Page27

6.7 Mem masukkan HTML H cod de Ianya a digunakan n untuk mem masukkan HTML code e.

6.8 Artic cle meta data d Ini ad dalah pentin ng untuk SE EO.

Masu ukkan descr ription dan keywords mengenai m A Article terse ebut.

Aridztech h.com

Page28

7. Module manager Module adalah seperti program atau aplikasi yang telah direka dan kita boleh menggunakannya dan disesuaikan di dalam website kita. Namun, kita perlu meneliti samada module itu menyokong versi Joomla yang kita pakai.

7.1 Carian module Module boleh dicari di website ini: http://extensions.joomla.org/ Adalah dinasihatkan kita membaca penerangan dan maklumbalas mengenai module tersebut supaya module yang diinginkan tercapai.

Aridztech.com

Page29

Contoh module- mo odule yang ada Custom HTML

Google Translate T

7.2 Insta all module e S Setelah dow wnload mod dule, boleh ke Uplod fil le dan Inst tall.

Aridztech h.com

Page30

Pergi ke module manager, klik kepada module yang baru diinstall. Boleh tukar title dan letakkan module parameter sebagai contoh Twitter HTML code.

8. Mengemaskinikan website 8.1 Bina password user lain

8.2 Tips- tips berguna Pelbagai lagi modules yang boleh di dapati di dalam website extensions.joomla.org. Antara tips- tips supaya lebih cemerlang dengan Joomla. -perbanyakkan proses pembelajaran dan percubaan dengan template dan module baru. -aktifkan diri di dalam aktiviti,forum- forum Joomla dan rakan- rakan komuniti Joomla. -sentiasa up-to-date dengan perkembangan terkini dan hebahkan kepada orang lain.

Aridztech.com

Page31