Joomla 2.

5 oleh Rahim Bin Utah

UITM

Buku Latihan Joomla

2.5
By Rahim Bin Utah

UiTM
6/1/2012

Exploring Backend ( Pentadbiran Joomla )

Login ke Joomla Backend.
Langkah-langkah
1. Buka browser yang baru
2. Taipkan perkataan http://<websitename>/administrator
3. Masukan login ID dan katalaluan.
4. Paparan berikutnya di panggil Control panel homepage.

System Information
5. Untuk mengetahui maklumat berkaitan dengan informasi sistem
seperti versi joomla, Klik pada menu Site->System
Information.

1|Page

6. Pada paparan skrin berikutnya merupakan maklumat berkaitan

dengan sistem seperti Joomla Version, Database Version dan
sebagainya.
Global Configuration
7. Daripada Control panel, klik pada menu Site->Global
Configuration. Global configuration terbahagi kepada Site
Settings, Server Setting dan Permission.
8. Secara tetap paparan parameter Site setting akan di
pamirkan pada skrin komputer anda. Contoh anda boleh
mematikan web site ( Site Offline ) dengan cara klik pada
butang radio Yes.
9. Klik Save & Close.
10. Kembali ke frontend dan refresh browser.
11. Kembali ke Backend dan klik No pada butang radio di pilihan
Site Offline.
12. Klik pada Tab System untuk melihat parameter system.
13. Pada bahagian Session Settings, setkan Session Lifetime
kepada 30. ( bermaksud 30 minit ).

2|Page

Latihan 1
MEDIA MANAGER
Media manager merupakan tempat anda mengurus semua aset web
seperti gambar, dokumen pdf, word, excel dan sebagainya.
Untuk mengakses Media Manager
Langkah-langkah
1. Klik pada menu Content->Media Manager atau klik pada ikon
Media Manager daripada Control Panel.
2. Ada dua jenis paparan yang boleh anda pilih samada
Thumbnail View atau Detail View.
3. Klik pada mana-mana folder yang terdapat di situ untuk
membukanya. Misalnya klik pada folder sampledata.
4. Klik pada ikon berwarna hijau untuk kembali kepada root
folder. Atau ikon folder yang terdapat di bawah tajuk Media
Folders.

Mewujudkan Folder
5. Di bahagian Files, masukan nama folder pada medan yang di
sediakan. Misalnya galeri.

6. Klik butang Create Folder.

3|Page

7. Klik pada folder galeri untuk membuka folder tersebut.

Memuatnaik gambar ke dalam folder galeri
8. Klik pada butang Browse di bahagian Upload files

9. Klik pada folder images dan seterusnya klik pada image beef
dan klik butang Open.
10. Seterusnya klik pada butang Start Upload.
11. Jika tiada masalah status Upload Complete akan di paparkan
pada skrin.
12. Klik pada gambar tersebut untuk preview.
Membuang gambar daripada media manager
13. Untuk membuang gambar klik pada ikon x yang terdapat pada
setiap gambar.

14. Anda juga boleh klik pada kotak tanda untuk membuang image
lebih daripada satu dan kemudian klik pada butang Delete.
Media Manager Option
15. Klik pada butang Options, klik pada folder Component. Skrin
ini adalah tempat untuk anda menetapkan beberapa parameter,
seperti Legal Extensions File, Maximum Size fail yang boleh
di muatnaik, path to files folder dan sebagainya.

4|Page

16. Flash Uploader merupakan satu kemudahan yang membolehkan

anda memuatnaik asset secara kelompok. Pada pilihan Enamble
flash uploader, klik pada butang radion Yes.

17. Klik butang Save & Close.

Memuat naik fail secara kelompok.
18. Klik pada butang Browse files
19. CTRL-klik pada gambar sam01.jpg, gambar sam03.jpg daripada
folder images, klik open.

20. Klik pada butang Start Upload untuk memuatnaik imej ke

Server.

5|Page

Latihan 2
Mewujudkan Kategori ( Masa : 15 Minit )
Langkah-langkah:Mewujudkan Category
1. Rujuk kepada fail site map.txt
2. Klik pada menu Content->Category Manager-> Add New Category
3. Taipkan perkataan Mengenai Kami pada medan Title

4. Klik pada ikon Save & New

5. Taipkan perkataan Perkhidmatan pada medan Title dan klik

ikon Save & New
6. Taipkan perkataan Berita & Aktiviti pada medan Title dan
klik ikon Save & New.
7. Taipkan perkataan Berita pada medan Title, kemudian pada
medan Parent pilih Category Berita & Aktiviti.

8. Klik pada ikon Save & New

9. Ulangi langkah 7-8 dengan memasukan perkataan Aktiviti pada
medan Title.
6|Page

10. Ulangi langkah 6 dengan memasukan dua lagi Category iaitu

koleksi dan Artikel.
11. Klik butang Save & Close
12. Ada sepatutnya mendapat senarai Category seperti tertera di
bawah

Meminda atau modify Category

13. Jika anda mahu meminda atau menyunting Category, Klik pada
mana-mana tajuk Category. Contoh klik pada Category Berita
& Aktiviti.
14. Pinda perkataan Berita & Aktiviti kepada Berita dan
Aktiviti
15. Klik ikon Save & Close

7|Page

Latihan 3
Mewujudkan Artikel dan asas format teks
Langkah-langkah
Mewujudkan artikel
1. Buka fail bahan/Mengenai kami.txt.
2. Klik pada menu Content-> Article Manager->Add New Article
3. Taipkan perkataan Pengarah pada medan Title
4. Pilih Category : Mengenai Kami
5. Pilih

(highligh)

Salleh

sehingga

teks
akhir

bermula

dengan

perenggan

dan

perkataan
klik

kanan

Rahman
butang

tetikus dan pilih menu Copy ( Ctrl-C)

6. Paste ( Ctrl-v ) Pada Editor di medan Article Text.
7. Klik ikon Save & New
8. Ulangi langkah 1 7 untuk Artikel ke 2.
a. Taipkan perkataan Pengenalan pada medan Title
b. Category : Mengenai Kami
c. Copy teks bermula dengan perkataan Kami sehingga akhir
perenggan dan paste pada Article Text.
d. Klik ikon Save & New
9. Ulangi langkah 1 -7 untuk artikel ke 3.
a. Taipkan perkataan Mengenai Kami pada medan Title
b. Category : Mengenai Kami
c. Copy teks bermula dengan perkataan Kumpulan jurugambar
sehingga akhir perenggan dan paste pada Article Text.
d. Klik ikon Save & Close
10. Senarai Artikel yang di masukan tadi akan di senaraikan
pada Article Manager.
Menyunting Artikel.
11. Klik pada Tajuk Artikel Pengarah yang terdapat di bawah
medan Title.

8|Page

12. Anda akan kembali kepada Skrin Article Manager : Edit

Article.
13. Anda boleh mengubah mana-mana maklumat dan parameter yang
terdapat pada skrin ini.
14. Jika anda ada membuat sebarang perubahan, klik pada ikon
Save & Close atau Close jika tiada sebarang perubahan di
buat.
Extended Editor TinyMCE
15. Klik pada menu Extensions->Plug-in Manager
16. Klik pada Plug-in Editor TinyMCE untuk menyuntingnya

17. Pada bahagian Basic Options, tukar Functionality kepada

Extended.

18. Klik pada butang Save & Close

19. Seterusnya klik pada menu Content->Article Manager->Add New
Article.
20. Perhatikan pada bahagian Article Text, ada ikon tambahan
yang terdapat di situ.
21. Taipkan perkataan Perkhidmatan di Medan Title
22. Category : Perkhidmatan
23. Buka fail bahan/perkhidmatan.txt
24. Copy keseluruhan teks bermula dengan tek Kami..
25. Paste ( Ctrl-v ) Pada Editor di medan Article Text.
26. Klik ikon Save & Close.

9|Page

LAB 1
Memasukan Artikel untuk Category Berita & Aktiviti.
Gunakan kaedah yang telah anda pelajari tadi untuk mewujudkan
arikel yang akan di masukan di bawah kategori Berita & Aktiviti.
Langkah-langkah
1. Buka fail bahan/berita & Aktiviti.txt
2. Klik pada menu Content->Article Manager->Add New Article
3. Title : Nikon D800
a. Category : Berita
b. Pilih dan Copy keseluruhan teks di bawah tajuk Berita
1.
c. Paste pada Editor
d. Klik ikon Save & New
4. Ulangi Langkah 2
a. Title : Lawatan ke Universal Studio.
b. Category : Aktiviti
c. Pilih dan Copy keseluruhan teks di bawah tajuk
Aktiviti 1.
d. Paste pada Editor
e. Klik ikon Save & Close

10 | P a g e

Latihan 3
External Link
Langkah-langkah :
1. Kembali kepada skrin Article Manager
2. Klik pada Artikel bertajuk Nikon D800
3. Pilih atau highlight perkataan Nikon Corporation

4. Kemudian klik pada ikon Insert/Edit Link.

5. Tetingkap Insert/Edit Link di buka, pada medan URL taipkan
URL berikut : http://www.nikon.com. Target : kepada Open in
New Window (_blank)

11 | P a g e

6. Klik butang Insert

7. Klik butang Save.

Latihan 4
Memasukan images pada article atau kandungan
Langkah-langkah
1. Ada beberapa kaedah untuk memasukan gambar, cara pertama
memasukan gambar daripada butang Images.
2. Pada medan Features pilih Yes
3. Tempat kursor pada perenggan pertama di hadapan perkataan
Tokyo, dan klik butang Image.
4. Klik pada butang Browse dan pilih gambar d800.png
5. Klik butang Start Upload.
6. Klik pada thumbnail gambar kamera d800.png Align Image ke
Kiri ( pilih left daripada kotak senarai Align ), dan
masukan maklumat berkaitan Image Description, seperti Nikon
D800/800E.
7. Masukan Image Title : Nikon D800
8. Klik Butang Insert.
9. Klik butang Save.
10. Kembali ke Frontend dan refresh Browser.
Menyunting parameter gambar daripada Article.
11. Kembali ke Backend. Masih di dalam mod Edit Article.

12 | P a g e

12. Klik pada imej kamera D800, dan kemudian klik pada ikon
Insert/Edit Image

13. Pada tetingkap Insert/Edit Image, klik pada Tab Appearance,

pilih Alignment: Right daripada kotak senarai.

14. Klik butang Update.

15. Klik butang Save.
16. Kembali ke Frontend dan refresh Browser.
Intro Images dan Full Article Images.
17. Kembali ke Backend.
18. Intro Images, hanya di paparkan pada frontpage sahaja. Ia
tidak akan di paparkan pada artikel penuh. Biasanya berguna
pada bahagian paparan frontpage sahaja atau paparan Blog.
19. Klik pada imej kamera D800 dan tekan kekunci Delete.
20. Klik pada Images and Links yang terdapat di sebelah kirin
skrin Article Manager.
13 | P a g e

21. Klik pada butang Select dan pilih gambar d800.png dan klik
butang Insert
22. Klik butang save.
Memasukan Full article Images.
23. Di bahagian Images and links, klik butang Select di hujung
medan Full article images.

24. Muatnaik gambar d800full_01 ke media manager.

25. Klik pada imej d800full_01 dan klik butang Insert
26. Klik butang Save & Close.
27. Kembali ke Frontpage dan Refresh Browser.

14 | P a g e

Latihan 5
Mengawal paparan artikel di frontpage.
Penggunaan Read More
1. Sunting semula artikel Nikon D800
2. Tempat kursor sebelum perkataan Kamera memiliki kiraan.

3. Kemudian klik pada butang Read More, satu baris berwarna

merah akan kelihatan selepas perenggan pertama.
4. Klik butang Save & Close.
5. Kembali ke Frontpage dan Refresh Browser
6. Klik butang Read more:Nikon D800.

Trash Artikel
Menghapuskan artikel daripada artikel Manager.
Langkah-langkah
1. Wujudkan satu artikel bertaju Trash Me!.
2. Masukan dummy teks di article Text
3. Klik Save & Close
Menghapus Artikel
4. Klip pada checkbox Trash Me Artikel.
5. Kemudian klik pada Ikon Trash.

15 | P a g e

6. Untuk melihat artikel di dalam Trash, Pada Kotak Senarai

Check Box, Pilih Trashed dan senarai akan artike yang di
Trashed akan di paparkan.

7. Klik pada Check box di hadapan tajuk artikel dan klik ikon
Empty Trash.
8. Jika anda mahu publish semula artikel daripada Trash, klik
pada ikon Bakul sampah untuk mendapatkannya kembali.

16 | P a g e

LAB
Dalam latihan ini anda di perlukan untuk mewujudkan artikel
mengikut kategori yang telah di tetapkan.
Tajuk Artikel

Category /

Bahan

subCategory
Blog
Photographer
Privacy
Camera of the
Year

Artikel

Blog photographer.txt

Uncategorised
Berita &
Aktiviti/berita

Privacy policy.txt
Berita2.txt

Latihan 6
Mewujudkan Menu.
Menu Manager dan Main Menu.
Menu Manager merupakan tempat di mana anda mengurus menu dan
item menu.
Single Article & Menu Utama
Langkah-langkah :1. Klik pada Menu Menus->Main Menu->Add New Menu Item.
2. Di Bahagian Details, pada medan Menu Item Type Klik pada
Butang Select.

3. Pada tetingkap Select a Menu Item Type, di bawah tajuk

Articles, klik pada Single Article,

17 | P a g e

4. Masukan tajuk menu Mengenai Kami pada Medan Menu Title.

5. Biarkan yang lain secara default
6. Pilih Article bertajuk Mengenai kami daripada Medan Select
Article.
7. Klik Butang Save & Close.
8. Kembali ke Frontpage dan klik butang Refresh.
Single Article dan Sub Menu
9. Klik pada ikon New untuk mewujudkan menu item yang baru
10. Pada menu Item Type klik butang Select.
11. Pada tetingkap Select a Menu Item Type, di bawah tajuk
Articles, klik pada Single Article,
12. Pada medan menu title taipkan perkataan Pengenalan.
13. Di medan Parent Item, pilih Mengenai Kami daripada kotak
senarai. ( untuk jadikan menu Pengenalan sebagai submenu
kepada Menu Mengenai Kami ).

14. Pada medan Select Article, klik butang Select/Change, dan

seterusnya klik pada Article Pengenalan.
15. Klik ikon Save & Close.
16. Kembali ke Frontpage dan klik butang Refresh.
18 | P a g e

Category Blog Menu

1. Klik pada Menu Menus->Main Menu->Add New Menu Item.
2. Pada menu Item Type klik butang Select.
3. Pada tetingkap Select a Menu Item Type, di bawah tajuk
Articles, klik pada Category Blog.

4. Pada Medan Title taipkan Berita & Aktiviti

5. Pilih Category Berita Aktiviti

6. Klik Save & Close

7. Kembali ke Frontpage dan refresh browser.
Tetapan pada Menu Category Blog
8. Kembali ke Backend, edit semula menu Berita & Aktiviti

dengan cara klik pada tajuk menu tersebut.

9. Kembali ke Frontpage dan refresh browser.

19 | P a g e

11. Klik pada bahagian Blog Layout Option.

12. Tetapkan maklumat mengikut panduan di atas.

13. Kembali ke Frontpage dan refresh browser.

20 | P a g e

Latihan 7
Advanced Artkel Format
Pagebreak
Langkah-langkah
1. Di menu bar klik pada Content->Article->New Article
2. Pada medan Title taipkan Nikon DSLR D5100.
3. Category : Artikel
4. Buka fail long-article.txt
5. Copy and Paste pada Article Text.
6. Letak kursur di atas perkataan Creative Effects
7. Kemudian klik pada butang Page Break

8. Masukan maklumat berikut pada paparan skrin di bawah

9. Seterusnya klik pada butang Insert Page Break

10. Ulangi langkah 7 untuk tajuk berikunya.
11. Live View Shooting
a. Page Title/Table of Content ALias : Live View
Shooting.
12. System.
21 | P a g e

a. Page Title/Table Of Content : Specification

13. Buang perkataan Attach spec01 dan gantikan dengan gambar
spec01 yang boleh di ambil daripada folder image/spec01.png
Mewujudkan menu jenis Category List.
14. Klik pada Menus->Main Menu->Add New Menu Item
15. Klik pada butang Select di Menu Item Type dan pilih Category
List.
16. Namakan Menu title sebagai Artikel.
17. Pilih Category Artikel pada bahagian Required Settings

18. Klik ikon Save & Close

19. Kembali ke Frontpage dan refresh browser.
20. Klik pada menu Artikel.
Paparan pagebreak.
21. Kembali ke Backend, klik pada menu
22. Klik pada menu Extensions->Plug-in Manager
23. Klik pada Plug-in bernama Content-Pagebreak.
24. Pada bahagian Basic Option, di medan Presentation Style,
pilih slider daripada kotak senarai.

22 | P a g e

25. Klik ikon Save.

26. Kembali ke Frontpage dan refresh browser.

23 | P a g e

Latihan 8
Menetapkan paparan .
Artikel option
Langkah-langkah
1. Klik pada menu Content->Article Manager
2. Pada skrin Article Manager : Article klik pada Ikon
Options,

3. Klik pada Tab Articles

4. Tetapkan parameter seperti berikut :
5. Show Category : Hide
6. Link Category : No
7. Show Parent : No
8. Link Parent : No
9. Show Author : Hide
10. Link Author : No
11. Show Navigation : Hide
12. Klik Pada Tab Editing Layout
13. Perhatikan tetapan yang berada di situ
14. Klik satu persatu setiap tab yang ada di skrin ini.
15. Klik Save & Close dan kembali ke Frontpage dan Refresh
Browser.

24 | P a g e

Latihan 9
Penggunaan Module
Module merupakan satu element penting di dalam joomla, memainkan
peranan di dalam dekorasi laman web joomla.
Module Manager dan pemasangan module sedia ada
Langkah-langkah.
1. Di menu bar klik pada Menu Extensions->Module manager
2. Senarai module yang

telah di pasang akan di paparkan pada

skrin komputer anda.

3. Secara tetap apabila anda memasang joomla tanpa sample
data, module Breadcrumbs, Main Menu dan Login Form akan di
pasang secara automatik.
Mewujudkan Custom HTML Module
4. Klik pada ikon New, dan pada paparan skrin berikutnya, klik
pada pilihan Custom HTML.

5. Pada medan Title, taipkan Hubungi Kami

6. Pada medan position, klik pada butang Select position dan
pilih position-5.

25 | P a g e

7. Pada bahagian Custom output text taipkan makluma berikut :

Hubungi kami di :
Lot G 170, Bgn Mutiara Damai
Shah Alam, Selangor
8. Upload image twiter dan facebook, kemudian letakan di
bahagian bawah alamat seperti gambaran di bawah.

9.

Di bahagian menu Assingment, pada medan Module Assignment,

pilih Only on the pages selected daripada kotak senarai.
Seterusnya, uncheck pada semua menu kecuali Home.

10. Klik ikon Save & Close.

11. Kembali ke frontpage dan refresh browser.
Memasang Lates News Module
12. Daripada module manager, Klik pada ikon New.
26 | P a g e

13. Pada popup Select a Module Type, klik pada Latest News.
14. Pada medan Title taipkan perkataan Berita Terkini.
15. Klik butang Select Position di medan Position, pilih
position-4.
16. Tetapkan Menu Assignment mengikut keperluan anda. ( Contoh
Home dan Berita & Aktiviti )
17. Klik pada Basic Options, pilih category Berita & Aktiviti,
Berita dan Aktiviti ( gunakan ctrl-click untuk memilih
category dan sub category ).
18. Klik ikon Save & Close.
19. Kembali ke frontend dan refresh browser.
Memasang Module
20. Klik pada Extensions->Extension Manager.
21. Klik butang Browse dan cari fail
module/mod_freeslider_sp1_j25 dan klik butang Open.
22. Seterusnya klik butang Upload & Install
23. Klik pada menu Extension->Module Manager
24. Cari Module

Freesilder SP1 daripada senarai module.

25. Klik pada pauntan FreeSlider SP1 untuk melihat maklumat

lebih lanjut mengenai module ini.
26. Klik Ikon Cancel.

LAB
Pasang module search dan letakan pada kedudukan position-0.

27 | P a g e

Latihan 10
Penggunaan Component
Contact Form.
Langkah-langkah
Mewujudkan Categories Contact
1. Di menu bar klik pada menu Component->Contact->Categories.
2. Pada skrin berikutnya klik ikon New.
3. Pada medan Title taipkan perkataan Umum
4. Klik ikon Save & Close.
Mewujukan Contact
5. Klik pada menu Component-> Contacts->Contacts
6. Pada skrin Contact Manager:Contact
7. Pada medan Name taipkan nama anda.
8. Di medan Category : Umum
9. Pada medan Other Information masukan perkataan berikut
Jika ada sebarang pertanyaan berkaitan dengan perkhidmatan
kami, Kami sentiasa membantu anda dengan perkhidmatan mesra
pelanggan. sila hubungi kami melalui talian : 603-123-5500.
10. Seterusnya klik pada bar Contact Detail dan masukan
maklumat pada medan yang di sediakan.
11. Position : Web Master
12. Email : alamat emel
13. Dan maklumat lain yang relavan.
14. Klik ikon Save & Close
Mewujudkan Pautan ke Contact
15. Klik pada menu Menus->Main Menu->Add New Menu Item.

28 | P a g e

16. Pada medan Menu Item Type klik butang Select, seterusnya
pilih Single Contact daripada bahagian Contact.

17. Pada medan Menu Title taipkan perkataan Hubungi Kami.

18. Seterusnya pada Select Contact klik butang Change Contact
dan pilih contact daripada senarai yang di berikan.
19. Klik ikon Save.
20. Kembali ke frontpage dan refresh browser.
21. Klik pada menu Hubungi Kami.
Meminda paparan
22. Kembali ke Backend.
23. Masih di skrin Menu Manager : Edit Menu Item
24. Klik pada bar Contact Display Option.
25. Pada pilihan Display format, pilih plain daripada senarai.

26. Klik ikon Save & Close.

27. Kembali ke Frontpage dan refresh browser.
Memasang component sitemap xmap.
28. Klik pada menu Extensions->Entension Manager
29 | P a g e

29. Klik pada butang Browse dan cari fail

component/com_xmap.zip, dan klik butang Open
30. Klik butang Upload & Install.
31. Seterusnya klik pada Components->Xmap.
32. Pada skirn berikutnya, klik ikon New untuk mewujudkan
sitemap yang baru.
33. Pada paparan berikutnya taipkan perkataan

sitemap pada

medan Title.
34. Seterusnya pada bahagian menu, tik mana-mana menu yang
ingin anda masukan ke dalam site map.

35. Klik ikon Save & Close

Membina pautan ke Component Xmap
36. Klik pada menus->Main Menu->Add new menu item.
37. Klik butang Select daripada medan Menu Item Type

30 | P a g e

38. Pada tetingkap berikutnya klik pada HTML Site map di bawah
tajuk Xmap.

39. Masukan tajuk menu ( Menu Title ) sebagai Sitemap.

40. Di bahagian Required Setting klik pada butang Change

41. Dan di senarai sitemap, klik pada tajuk sitemap.

42. Klik ikon Save & Close
43. Kembali ke frontpage dan refresh browser, klik pada menu
Sitemap.

31 | P a g e

Latihan 11
Penggunaan Capta.
Mengaktifkan plug-in capta.
Langkah-langkah
1. Klik pada menu Extensions-> Plug-in Manager
2. Klik pada Plug-in Captcha-ReCaptca
3. Pada medan Status Pilih Enabled.
4. Anda perlu dapatkan Public Key dan Private Key terlebih
dahulu. ianya boleh di dapati di laman web google.
5. Buka browser baru dan masukan URL berikut :
http://www.google.com/recaptcha.

6. Seterusnya klik pada Get reCAPTCHA

7. Anda perlu sign-in terlebih dahulu untuk mendapatkan public

dan private access key. Buka fail bahan/key.txt untuk
mendapatkan public key dan private key.

32 | P a g e

8. Pada bar Basic Option Masukan public key dan private key
pada medan yang di sediakan.

9. Save & Close

10. Klik pada menu Site->Global Configuration
11. Pada bahagian Site Settings, pada medan Default Captcha
pilih Captcha-Recaptcha.

12. Klik Save & Close.

13. Kembali ke frontpage dan refresh browser.
Memasang System - Helix Framework untuk template framework
14. Klik pada extensions->Extension Manager
15. Klik butang Browse, pada skrin fail upload, cari fail
plugin/plg_system_helix_j25.zip, pilih dan klik butang Open
16. Klik butang Upload & Install.
17. Klik pada extensions->Extension Manager.

33 | P a g e

18. Cari fail plugin System - Helix Framework daripada senarai

plugin. Klik pada plugin tersebut dan pada skrin berikutnya
tukar Status kepada Enabled.

19. Klik Fail & Close.

34 | P a g e

Latihan 12
Templates.
Template merupakan paparan sebenar wajah joomla, Joomla datang
bersama-sama
mengikut

dengan

keperluan.

template
Template

percuma
juga

dan

boleh

di

boleh

di

ubaisuai

muaturun

daripada

laman web tertentu dan di pasang pada Joomla melalui proses

pemasangan biasa.
Pengurusan Template.
Langkah-langkah
1. Klik pada menu Extensions->Template Manager
2. Paparan skrin Template Manager : Style akan di buka dengan
senarai Template dan Style yang sudah di pasangkan pada
Joomla.
3. Anda

boleh

klik

pada

mana

style

atau

template

untuk

menetapkan beberapa parameter seperti menu Assingments dan

sebagainya.

35 | P a g e

4. Klik pada tab Templates untuk melihat Template secara lebih

detail, seperti kedudukan module, suntingan fail CSS dan
sebagainya.

Preview Option
5. Untuk

mengaktif

preview

jika

tiada

Klik

pada

ikon

dan

pada

Option

6. Pada

skrin

berikutnya

klik

pada

Tab

Templates

pilihan Preview Module Positions tukar kepada Enabled.

7. Klik Save & Close.

36 | P a g e

Customize dan Preview Template

8. Seterusnya klik pada pautan Preview.

9. Perhatikan

kedudukan

module-module

yang

terdapat

pada

template tersebut.
10. Seterusnya klik pada pautan Beez_20 Detail and Files.
11. Anda

di

boleh

customize

template

dengan cara menyunting fail-fail

ini

mengikut

keperluan

yang terdapat di situ.

Tetapi anda haruslah anda pengetahuan mengenai PHP, CSS dan

sebagainya.
12. Klik ikon Close.
Menetapkan Template
13. Untuk menetapkan default template. Klik pada Tab Style.
14. Klik pada check-box atau kotak tanda di hadapan nama style
template. Anda hanya boleh tik satu style sahaja.

37 | P a g e

15. Seterusnya klik pada ikon Make Default.

Memasang Template.
16. Klik pada menu Extensions->Extension Manager.
17. Klik pada butang Browse..

18. Pilih bahan/templates/shaper_simplicity_ii_templateonly_j25,

dan klik butang Open.
19. Seterusnya

klik

pada

butang

Upload

&

Install,

tunggu

sehingga isyarat pemasangan sudah selesai keluar pada skrin

komputer anda.
Menghapus Template.
20. Klik pada menu Extensions->Extension Manager.
21. Pada skrin berikutnya klik pada Tab Manage

38 | P a g e

22. Seterusnya klik pada -Select Type - : dan pilih Template.

23. Klik

pada

check-box

atau

kotak

tanda

di

hadapan

nama

template yang hendak di buang. Seterusnya klik pada ikon

Uninstall.

24. Tunggu

sehingga

pesanan

Uninstalling

successful di paparkan pada skrin komputer.

39 | P a g e

template

was