Modul Joomla

JOSC-Udinus | Modul Pelatihan CMS Joomla 1

2009

JOSC-UdinusJawa Tengah OpenSource Community

[PEMKAB KENDAL]

BAB 1Pengenalan Joomla

Joomla adalah salah satu Content Management System (CMS) yang dibuat menggunakan

bahasa pemrograman PHP. CMS adalah perangkat lunak yang digunakan untuk membangun

web dinamis secara mudah, tanpa harus menguasai bahasa pemrograman dan Database

Management System (DBMS) tertentu. Seperti namanya, CMS dapat membangun sebuah

web hanya dengan mengatur konten (isi) tanpa meluangkan waktu untuk belajar PHP,

meskipun jika telah menguasai bahasa pemrograman tersebut akan sangat membantu.

Konten merupakan inti dari semua website, konten juga adalah alasan utama pengunjung

mengakses sebuah website. Tampilan website sebaik apapun dengan animasi semewah

bagaimanapun akan ditinggalkan pengunjungnya jika tidak diimbangi dengan konten yang

bermutu. CMS memberikan keleluasaan administrator untuk lebih berkonsentrasi pada

konten website dan sejenak melupakan keperluan teknis pemrograman.

Gambar 1: Tampilan Halaman Admin Joomla 1.5

Ada banyak sekali jenis CMS yang tersedia dan siap untuk digunakan untuk membangun

website, antara lain Mambo, PHPNuke, PostNuke, dan tentu saja Joomla. Salah satu yang

paling banyak digunakan adalah Joomla, karena mempunyai banyak kelebihan antara lain:

Penggunaannya mudah

Banyak plugin yang tersedia


Pelatihan Joomla Pemkab Kendal 2009

Dukungan forum dan komunitas

Tersedia dalam berbagai bahasa (termasuk Indonesia)

Fasilitas tempat sampah seperti recycle bin

Template tampilan yang mudah diganti

Pada saat tutorial ini dibuat, Joomla telah mencapai versi 1.5. Dibandingkan sebelumnya,

terdapat perubahan-perubahan yang cukup signifikan pada versi ini, diantaranya adalah

tampilan halaman administrator yang lebih segar. Selain itu juga ada pilihan antara

mengaktifkan RichEditor dan menonaktifkannya untuk keleluasaan pengguna.

Penyempurnaan yang lain adalah pada tampilan preview template yang dapat menampilkan

bagian-bagian yang ada pada template, juga telah dilengkapi editor untuk beberapa berkas

CSS sekaligus. Selain itu, Joomla 1.5 juga telah mendukung teknologi web terbaru seperti

Atom 1.0, RSS 2.0, dan juga dukungan terhadap XML-RPC.


BAB 2Upload dan Instalasi

Upload ke web hosting dengan FileZilla

90% orang belajar menggunakan Joomla menggunakan webserver yang diinstal secara lokal

di komputer (atau laptop) standalone, meski demikian pada saat implementasi 90% CMS

Joomla dijalankan pada webhosting luar baik yang gratisan maupun yang berbayar. Sebab

itulah sebelum kita mulai belajar menginstall Joomla, ada baiknya kita juga belajar

mengupload file-file Joomla ke dalam webhosting.

Hampir semua webhosting baik yang gratisan maupun berbayar telah menyediakan CPanel

yang dilengkapi dengan FileManager untuk mengupload file ke server web hosting tersebut.

Namun dengan menggunakan FileManager tersebut sangat lambat dan kurang efektif,

karena harus mengupload file satu persatu, sedangkan file CMS Joomla berjumlah ribuan.

Untuk itu kita perlu menggunakan perangkat lunak khusus untuk menguploadkan banyak file

sekaligus. Salah satu yang dapat digunakan dengan mudah, handal, dan gratis adalah

FileZilla, perangkat lunak sumber terbuka yang merupakan produk dari FileZilla-Project.

Gambar 2: Tampilan Antarmuka FileZilla

Cara penggunaan FileZilla cukup mudah hampir seperti windows explorer, hanya saja karena

berkas yang dikirimkan adalah melalui jaringan, sehingga memerlukan jeda waktu setelah



mengirimkan tergantung dengan kecepatan jaringan (atau bandwith internet) itu sendiri.

Lebih jelasnya cara mengirimkan file melaui FTP menggunakan FileZilla adalah sebagai

berikut:

1. Tentukan koneksi yang tepat dengan mengisikan alamat host (bisa berupa IP atau

alamat DNS seperti www.joomla.com), username FTP, password, dan juga port yang

digunakan untuk FTP (opsional). Ketiga informasi tersebut bisa didapat dari web

hosting yang kita gunakan. Kemudian tekan tombol Quickconnect.

Gambar 3: Form Koneksi FTP pada FileZilla

2. Setelah FileZilla berhasil mendapatkan struktur direktori yang kemudian ditampilkan

pada file explorer di sebelah kanan, berarti kita sudah siap untuk mengupload file

yang kita inginkan. Sebelumnya pilih terlebih dahulu folder yang berisi file-file yang

akan kita upload, kemudian pada local site file explorer pilih semua file yang akan

diupload, klik kanan dan pilih menu upload.

Gambar 4: File & Folder Explorer pada FileZilla

3. Di bagian bawah Queued Files menunjukkan proses upload pada tiap file, jumlah file

dan juga nama tiap file yang sedang mengantri untuk diupload. Di sampingnya Failed

Transafer File menunjukkan file yang gagal diupload, untuk mengulangi upload pada

file tersebut melalui klik kanan dan pilih Reset dan requeued selected files. Dan yang


Remote site file explorerLocal site file explorer

http://www.joomla.com/


terakhir adalah Successfull Transfer yang menunjukkan informasi file yang telah

berhasil di upload.

Gambar 5: Status File Upload pada FileZilla

FileZilla hanya mampu mengupload file ke dalam server pada webhosting, dan tidak dapat

digunakan untuk mengupload baik yang berbentuk binary file, maupun yang berbentuk file

query (*.sql). Untuk mengupload database local yang telah kita buat ke dalam database

server kita bisa menggunakan PHPMyAdmin, perangkat administrasi database MySQL

berbasis web, seperti yang akan sedikit disinggung pada bagian selanjutnya.

Instalasi Joomla

Setelah berhasil mengupload file Joomla ke dalam server web hosting, atau juga bisa berarti

meng-copy-kan file ke dalam folder Server_Root yang ada pada server lokal, kita siap

melakukan aksi selanjutnya, yaitu menginstall Joomla.

Sebelum menginstall Joomla, tentu saja yang dilakukan adalah mendapatkan paket instalasi

Joomla, dapat di download di website resminya www.joomla.org atau juga bisa meng-copy

punya teman . Paket instalasi ini berbentuk *.zip, untuk bisa menjalankannya anda harus

mengekstraknya terlebih dahulu ke dalam direktori web server, bila anda menggunakan

XAMPP seperti saya maka itu berarti anda bisa

mengekstrak joomla ke dalam folder htdocs.

Untuk mempermudah akses dan agar tidak

tumpang tindih dengan web yang sudah ada,

kita bisa membuat direktori baru terlebih dahulu

di dalam contoh ini saya membuat direktori

"joomla_site". Namun bila Joomla adalah satu-

satunya website yang anda kerjakan pada web

server tersebut, anda tidak perlu membuat

folder baru.


http://www.joomla.org/


Joomla menggunakan database MySQL untuk menyimpan konten dan konfigurasi website,

sebab itulah sebelum melanjutkan instalasi website joomla kita perlu membuat database

khusus agar dapat digunakan oleh Joomla. Kalau anda menggunakan localhost, anda bisa

menggunakan PHPMyAdmin untuk membuat database "joom_database" (nama bisa

variatif), sedangkan pada web hosting anda bisa menggunakan MySQL Manager untuk

membuat Database.

Gambar 6: Membuat database pada phpMyAdmin

Setelah semua persiapan selesai baru kita bisa memulai instalasi Joomla. Kita asumsikan

sedang menginstal joomla pada localhost dan file joomla ada pada direktori joomla_site,

maka yang kita lakukan adalah memanggilnya melalui browser dengan mengetikkan

http://localhost/joomla_site, maka akan muncul tampilan seperti di bawah ini.

Gambar 7: Tampilan pertama instalasi Joomla


http://localhost/joomla_site


Pilih salah satu bahasa (biasanya dan direkomendasikan menggunakan bahasa inggris),

kemudian klik saja tombol Next untuk melanjutkan instalasi hingga muncul tampilan seperti

di bawah ini.

Gambar 8: Precheck technical requirement oleh Joomla

Yang dijalankan pada bagian kedua ini adalah check kebutuhan teknis secara otomatis oleh

joomla, jika kebutuhan tidak terpenuhi Joomla tidak mengizinkan untuk melanjutkan

instalasi. Untuk setting rekomendasi, meskipun ada yang tidak memenuhi joomla tetap

mengijinkan untuk menjalankan, karena hanya bersifat rekomendasi.

Gambar 9: Tampilan Lisensi GPL

Joomla menggunakan lisensi publik di bawah General Public License (GPL) seperti

kebanyakan produk open source software lainnya. Itulah yang ditunjukkan pada tahap ketiga

ini. Bila anda merasa perlu untuk membacanya silahkan berhenti sejenak untuk

membacanya, namun bila anda tidak punya waktu kita hanya cukup waktu Joomla boleh



diedarkan secara bebas tanpa harus membayar royalti, bahkan juga boleh dimodifikasi dan

diedarkan kembali tanpa harus membayar royalti. Kemudian lanjutkan pada tahap

selanjutnya.

Gambar 10: Koneksi dengan database MySQL

Pada konfigurasi database, pertama pengguna diperbolehkan untuk memilih jenis database

yang dipakai pilih saja MySQL. Sedangkan untuk hostname 90% pilihan yang tepat digunakan

adalah localhost, bahkan ketika anda menggunakan database pada hosting server. Pada isian

username dan password, kita bisa mengisikan nama pengguna dan password database yang

digunakan (ingat username dan password database bukan login windows ataupun login web

hosting). Selanjutnya yang terakhir adalah nama database yang digunakan untuk Joomla.

Gambar 11: Pengaturan FTP

Kalau anda menggunakan localhost, anda bisa langsung melewati tahap ini, namun bila anda

menggunakan server pada web hosting, konfigurasi FTP akan sangat membantu perawatan

website. FTP username, password, dan host bisa anda dapatkan pada CPanel web hosting

yang anda gunakan.



Gambar 12: Pengaturan situs dan login administrator

Tahap selanjutnya adalah mengatur nama situs dan password administrator yang digunakan

untuk login halaman admin. Di bawahnya kita bisa menginstal sampel data yang sangat

membantu pemula untuk mengetahui gambaran seperti apakah kira-kira susunan website

standard, namun bagi kita yang sudah terbiasa membangun website sampel data ini

mungkin sedikit mengganggu karena harus menghapus datanya untuk diganti dengan yang

baru, milik kita sendiri.

Klik lagi next, dan anda selesai menginstall joomla. Tahap selanjutnya adalah menghapus file

instalasi untuk mencegah website anda diinstall ulang oleh orang yang kurang bertanggung

jawab. Seperti yang ditunjukkan di bawah ini.

Gambar 13: Tampilan instalasi berhasil


BAB 3Section, Category, dan Article

Gambar 13: Struktur konten default Joomla

Jika kita menginstall sampel data, secara otomatis kita mengisi website Joomla pertama

dengan konten yang mempunyai struktur sebagaimana gambar di atas. Terlihat pada

gambar di atas, Joomla mengorganisasikan konten menjadi beberapa bagian untuk

mempermudah pengaturan yaitu sections, categories, dan articles. Satu section bisa

mempunyai beberapa category, dan satu category terdiri dari beberapa article, ini adalah

dasar pengaturan konten yang harus diketahui.

Sebagai tips pembuatan website, untuk mengorganisasikan website secara lebih baik dan

terencana dengan rapi, kita dapat menggunakan teknik top down, yaitu mengatur section

dan category terlebih dahulu baru kemudian membuat artikel untuk masing-masing

category. Daripada membuat artikel terlebih dahulu, mengaturnya ke dalam uncategorized

(tidak terkategori) kemudian baru mengaturnya kembali ke dalam category dan section

tertentu yang dibuat lebih akhir.



Pengaturan Section

Ada dua cara untuk membuat (dan mengatur) section dalam halaman administrasi joomla,

yaitu menggunakan icon Section Manager, atau juga dapat melalui menu Content

Section Manager. Keduanya akan membuka halaman pengaturan section.

Gambar 14: Tampilan Section Manager

Untuk menambahkan section baru, kita dapat mengklik tombol New, sedangkan untuk

memperbaharui (mengedit) section yang sudah ada bisa dengan mengklik tombol Edit.

Seteleh menekan tombol tersebut, halaman admin akan berubah ke tampilan formulir

section seperti di bawah ini.

Gambar 15: Tampilan Formulir section

Title: judul dari section.

Alias: id khusus yang dapat dipahami oleh joomla.

Published: untuk menetapkan apakah akan ditampilkan atau tidak.

Order: menentukan urutan tampilan dari section.

Access level: untuk menentukan siapa saja yang bisa mengakses section ini.



Image: menentukan gambar yang ditampilkan pada website saat section ini dipanggil,

gambar yang dipilih sebelumnya harus sudah diupload melalui media (akan dibahas nanti).

Image Position: posisi dari gambar yang telah dipilih sebelumnya.

Description: untuk memberikan keterangan tentang section yang dibuat

Pengaturan Category

Hampir sama seperti pengaturan section, Category Manager dapat diakses melalui icon yang

ada ada control panel atau juga dapat melalui menu Content Category Manager. Kedua

cara tersebut, akan membuka halaman category manager, kemudian melalui halaman

tersebut kita bisa membuka halaman formulir category seperti di bawah ini.

Gambar 15: Tampilan Formulir category

Tampilan yang sama seperti pada formulir section, dengan tambahan inputan section untuk

mengelompokkan beberapa kategori ke dalam salah satu section.

Pengaturan Article

Section dan category adalah pengelompokan konten untuk mempermudah pengaturan,

sedangkan isi dari website sebenarnya adalah pada article. Untuk membuat article baru ada

tiga cara yang dapat digunakan yaitu seperti biasanya mengklik Icon Article Manager dan

juga menu Content Article Manager, kemudian pada halaman article manager dapat

mengklik icon New Article. Atau bila anda menganggap terlalu lama, anda bisa langsung



mengklik icon Add New Article pada Control Panel. Ketiga cara tersebut akan memunculkan

formulir article seperti di bawah ini.

Gambar 15: Tampilan Formulir category

Seperti pada category ada inputan Title, Alias, Section, dan Published. Selain itu juga ada

tambahan Front Page yang digunakan untuk menentukan apakah artikel tersebut akan

ditampilkan pada halaman depan atau tidak, dan juga tambahan Category yang akan muncul

secara otomatis bila dipilih salah satu section.

Saat ditampilkan pada halaman depan, kita seringkali melihat artikel yang tidak ditampilkan

seluruhnya hanya sebagian saja dan diikuti tulisan "read more". Pada Joomla kita bisa

membuat seperti itu dengan mengklik tombol "read more" yang ada di bawah kotak inputan

isi artikel. Setelah mengklik tombol tersebut akan muncul garis merah yang memisahkan

ringkasan tulisan yang muncul di halaman depan dan tulisan lengkap artikel tersebut.

Selain inputan tersebut, ada lagi inputan parameter untuk artikel tersebut. Ada tiga inputan

parameter yang berada di samping kanan yaitu Parameters – Article, Parameters-Advanced,

dan Metadata Information. Sebagai dasarnya yang perlu diketahui adalah Parameters-

Article.

Author: penulis artikel yang secara otomatis didapatkan dari login sebelumnya.

Author Alias: jika nama login anda bukan nama asli, anda bisa menggunakan nama alias

untuk menuliskan nama asli anda.

Access Level: menentukan siapa saja yang dapat membaca artikel tersebut.

Created Date: menentukan tanggal pembuatan artikel (default tanggal penulisan artikel).



Start Publishing: kita bisa menentukan kapan artikel yang dibuat akan diterbitkan melalui

inputan ini (default tanggal penulisan artikel), misalkan kita ingin membuat artikel yang

secara otomatis diterbitkan pada tahun baru, kita bisa menentukannya di sini.

Finish Publishing: kebalikan dari Start Publishing, digunakan untuk menset kapan artikel

tidak diterbitkan kembali (default never/tidak pernah).

Latihan

Buat struktur website seperti di bawah ini, kemudian isikan dua artikel yang relevan untuk

tiap kategorinya.


BAB 4Konfigurasi Website dan Menu

Konten adalah hal yang paling penting dalam website, namun bukan satu-satunya hal

penting yang harus diatur dengan baik oleh administrator. Pengaturan yang tidak kalah

pentingnya adalah pengaturan konfigurasi website itu sendiri dan juga pengaturan menu,

untuk memastikan pengunjung tidak akan kebingungan apalagi sampai tersesat melihat

website kita.

Global Configuration

Merupakan pengaturan utama website kita. Dalam pengaturan umum ini ada tiga sub menu

yaitu Site, System, dan Server. Ketiganya akan kita bahasa secara berurutan dengan singkat

pada beberapa bagian yang penting diketahui saja.

Gambar 16: Tampilan konfigurasi situs

Site Offline: menentukan apakah situs ini akan ditampilkan sebagai offline (tidak aktif).

Offline Message: jika situs sedang dalam keadaan tidak aktif maka pesan yang dimunculkan

dapat ditulis di sini.



Site Name: untuk menuliskan nama situs (untuk mengganti konfigurasi pada saat install).

Default WYSIWYG Editor: saat menuliskan konten secara default anda menggunakan Rich

Editor dari TinyMCE, bila anda lebih suka tampilan editor kosongan, anda bisa menggantinya

menjadi "no editor"

Global Site Meta Description: deskripsi dari situs anda yang tidak dapat dilihat oleh

pengunjung namun akan dibaca mesin pencari.

Global Site Meta Keywords: kata kunci yang digunakan mesin pencari untuk mengenali

website anda.

Search Engine Friendly URLs: mengatur apakah URL website anda mudah terbaca oleh

mesin pencari atau tidak.

Gambar 17: Tampilan konfigurasi sistem

Allow User Regisration: mengijinkan pengunjung untuk mendaftar menjadi anggota.

New User Registration Type: menentukan tipe keanggotaan default untuk pengunjung yang

mendaftar sebagai anggota.

New User Account Activation: menentukan untuk mengirim email aktivasi pada pengunjung

yang mendaftar sebagai anggota.

Front-end User Parameters: jika diaktifkan, pengguna dapat memilih bahasa, editor, dan

beberapa parameter lain saat login pada front-end.



User Manager

User Manager digunakan untuk mengatur anggota yang dapat masuk ke dalam halaman

administrasi. Jika anda mengaktifkan Allow User Registration pada konfigurasi umum,

pengunjung dapat mendaftar menjadi pengguna di sini, namun jika anda menonaktifkannya

(untuk alasan keamanan atau privatisasi), pengguna hanya dapat dibuat melalui icon New

pada user manager ini. Adapun formulir user pada halaman administrasi adalah seperti

gambar di bawah ini.

Gambar 18: Tampilan formulir pengguna

Name: nama asli pengguna

Username: nama pengguna untuk identifikasi joomla.

E-mail: surat elektronik pengguna.

New Password: password baru untuk login.

Verify Password: untuk memastikan password yang dimasukkan sebelumnya tepat.

Group: menentukan jenis pengguna yang dibuat.

Block User: terkadang ada pengguna yang telah mendaftar dan melakukan beberapa

kesalahan fatal, kita bisa memblok pengguna pengguna tersebut menggunakan menu ini.

User Editor: menentukan tipe editor yang cocok untuk pengguna tertentu, untuk beberapa

orang mungkin no editor membuat mereka lebih leluasa.

Time Zone: menentukan zona waktu yang digunakan oleh masing-masing pengguna.



Media Manager

Bila ingin menggunakan suatu gambar (atau berkas multimedia lain) pada website, kita perlu

mengupload gambar tersebut terlebih dahulu. Cara uploadnya dapat menggunakan

pengaturan media yang pada Joomla versi 1.5 sudah terintegrasi dengan editor konten.

Tampilan media manager adalah seperti di bawah ini.

Gambar 19: Tampilan media manager

Kita bisa membuat folder baru dengan menggunakan inputan Create Folder yang berada di

atas kotak browser file, dan juga mengupload gambar baru dengan mengklik inputan browse

di bawah browser file.

Menu Manager

Pengaturan menu merupakan salah satu hal yang sangat penting pada pembuatan website,

Joomla menyediakan menu manager khusus untuk mengatur menu dan submenu tampilan

depan. Kita bisa mengakses menu manager melalui Menus Menu Manager yang terdapat

di atas, atau juga bisa melalui icon Menu Manager. Kedua cara tersebut akan menampilkan

Menu Manager dengan tampilan seperti di bawah ini.



Gambar 20: Tampilan menu manager

Yang ditampilkan pada Menu Manager adalah kelompok menu yang didalamnya tersimpan

beberapa menu lagi, bukan semua menu yang ada. Begitu juga bila mengklik icon New, yang

dibuat adalah kelompok menu baru yang bisa diisikan beberapa menu, bukan menambahkan

menu baru. Sedangkan untuk menambahkan menu pada kelompok menu tersebut, kita bisa

mengklik icon yang ada pada kolom Menu Item(s), kemudian akan memunculkan halaman

Menu Item Manager seperti tampilan di bawah ini.

Gambar 21: Tampilan menu item manager

Untuk menentukan tampil tidaknya item menu tersebut pada halaman front end, kita bisa

mengklik icon yang ada pada kolom published. Sedangkan untuk menentukan menu default,

kita bisa mencek salah satu item menu untuk memilih item menu tersebut, kemudian

mengklik icon Default yang ada diatas. Menu default adalah item menu yang akan otomatis



diakses ketika website pertama kali dibuka, dan hanya boleh ada satu menu default untuk

keseluruhan menu dan item menu website.

Untuk menambahkan item menu, kita bisa mengklik icon New untuk memunculkan form

menu, namun sebelumnya joomla akan menampilkan Menu Item manager untuk memilih

tujuan menu yang kita buat secara visual. Setelah kita memilih salah satu menu item, baru

form menu akan tampil seperti yang terlihat pada gambar di bawah ini.

Gambar 22: Tampilan form menu item

Title: judul menu yang ditampilkan.

Alias: judul menu yang dikenal joomla.

Link: target tautan yang akan dibukan menu (tidak bisa dirubah).

Display in: memilih kategori menu.

Parent menu: memilih menu induk, bila tidak punya menu induk pilih "Top".

Published: memilih menerbitkan menu atau tidak

Selain inputan tersebut, jika kita ingin mengubah target dari menu tersebut, dapat mengklik

tombol Change Type yang berada di atas kemudian kembali memilih target link secara visual

melalui Menu Item Manager.


BAB 5Extension dan Template

Selain penggunaanya yang mudah, ada satu lagi kelebihan Joomla yang menjadi alasan orang

banyak menggunakannya yaitu kelengkapan extension dan template yang mudah di ganti.

Kita bisa menemukan banyak sekali extension dan template di internet, baik di situs resmi

joomla maupun situs luar, extension ini membuat website kita mempunyai fasilitas khusus

seperti buku tamu, galeri foto, embed video, live chat, embed google maps, dan lain

sebagainya. Namun perlu diketahui, meskipun Joomla 100% gratis, tidak semua extension

yang tersedia dapat digunakan gratis, ada yang bertipe komersial dan non komersial.

Extension

Ada tiga jenis extension dalam Joomla yaitu Module, Component, dan Plugin. Plugin

merupakan extension paling lengkap, menyediakan tampilan dan juga pengaturan pada sisi

admin, bahkan beberapa plugin mempunyai pengaturan yang sama kompleksnya dengan

pengaturan joomla. Kedua dan ketiga adalah Component dan Module yang merupakan

tambahan pada tampilan baik halaman admin dan frontpage. Module merupakan extension

paling sederhana, module menampilkan tampilan khusus seperti banner, artikel dan lain

sebagainya. Sedangkan Component hampir seperti module namun mempunyai pengaturan

yang lebih kompleks.

Entah kenapa, tidak seperti sebelumnya, menu extension dan template tidak ditampilkan

pada icon control panel seperti menu yang lain, sebagai gantinya, kita bisa mengaksesnya

melalui menu extension yang berada di atas, ada lima sub menu yang ada pada menu ini,

yaitu install/uninstall, module manager, plugin manager, template manager, dan language

manager.

Install/Uninstall

Digunakan untuk memasang extension baru atau menghapus extension yang sudah ada,

menu inilah merupakan sentral pemasangan dan pencabuutan semua extension dalam



joomla. Di dalamnya terdapat enam menu lagi yaitu install yang berfungsi untuk meng-

upload dan memasang extension baru, serta kelima menu lainnya yaitu components,

modules, plugins, templates, dan languages, digunakan untuk mencabut (uninstall)

extension yang sudah terpasang.

Gambar 23: Install/Uninstall extension

Module Manager

Digunakan untuk mengakses semua module yang terpasang, baik itu modul untuk Site

frontpage, maupun untuk Administrator. Tampilan ini digunakan untuk menentukan aktif

atau tidaknya suatu module, juga melalui tampilan ini kita dapat menentukan urutan

tampilan masing-masing modul. Tampilan dari module manager seperti di bawah ini.

Gambar 24: Tampilan module manager

Untuk mengaktifkan modul, kita bisa mengklik icon yang ada pada kolom Enabled, kemudian

untuk menentukan urutan tampilan, kita bisa mengubah angka yang ada pada kolom Order.



Sedangkan untuk pengaturan yang lain, kita bisa mengklik pada nama masing-masing

modulnya, dan akan memunculkan formulir sebagai berikut.

Gambar 25: Tampilan formulir modul

Title: nama modul yang ditampilkan pada module manager.

Show Title: menampilkan nama modul pada widget front page.

Enabled: mengaktifkan atau non-aktif modul.

Position: mengatur posisi modul berdasarkan area pada template.

Access Level: mengatur siapa saja yang dapat mengakses modul.

Menu Assignment: mengatur pada menu apa saja modul tersebut tampil.

Sedangkan untuk pengaturan parameter tidak akan kita bahas, karena tiap modul

mempunyai pengaturan yang berbeda.

Plugin Manager

Hampir sama seperti module manager, plugin manager dapat digunakan untuk menetukan

aktif tidaknya sebuah plugin, kemudian juga menentukan urutan tampilan. Beberapa plugin

yang memerlukan pengaturan khusus jika sudah terpasang maka otomatis plugin tersebut

menambahkan submenu pada menu component. Lebih lengkapnya plugin akan dibahas

pada bab selanjutnya.



Template Manager

Dengan Joomla kita bisa mengubah-ubah tampilan dengan pengaturan template yang sudah

disediakan, sebelum dapat mengubah template tentu saja yang dilakukan adalah menginstall

template tersebut melalui menu Extension Install/Uninstall. Kemudian untuk mengatur

template yang sudah terpasang kita bisa menggunakan Template Manager yang dapat

diakses melalui menu Extension Template Manager.

Gambar 26: Tampilan template manager

Ada dua sub tampilan dalam Template Manager ini, yaitu Site yang menampilkan semua

template yang terinstall untuk tampilan front end, dan Administrator yang menampilkan

semua template yang terinstall untuk tampilan back end.

Gambar 27: Tampilan template edit



Jika kita ingin memilih sebuah template menjadi template default, kita bisa memilih salah

satu template, kemudian mengklik icon Default. Template yang terdapat icon bintang berarti

template tersebut menjadi icon default saat ini. Sedangkan untuk mengatur parameter, atau

mengubah template, kita bisa mengklik pada link nama template, selanjutnya joomla akan

membuka tampilan Edit Template seperti di atas.

Terlihat pada Gambar 27, kita bisa menggunakan tampilan yang berbeda untuk beberapa

menu tertentu, misalkan untuk tampilan buku tamu, kita ingin menggunakan template

berwarna biru, namun untuk defaultnya kita menggunakan warna putih. Kita bisa

mengaturnya pada Menu Assignment dengan mengganti pilihan pada "Select from List" dan

memilih menu yang ingin kita terapkan template tersebut.

Selain inputan yang telah dijelaskan di atas ada juga pilihan parameter yang berubah-ubah

inputanyya, sesuai dengan template yang akan kita gunakan. Sedangkan pada icon di atas

juga terdapat tombol yang digunakan untuk mengedit template.

Preview: menampilkan contoh pra-tampil template dengan keterangan kelompok tampilan

Edit HTML: mengubah kode HTML yang digunakan pada template tersebut

Edit CSS: mengubah kode CSS yang digunakan pada template.

Gambar 27: Tampilan preview template


BAB 6Pembuatan Buku Tamu dan Galeri Foto

Bab ini merupakan salah satu implementasi dari bab selanjutnya, yaitu penggunaan

extension untuk mempercanggih website kita. Saat ini yang kita terapkan di sini adalah yang

paling banyak digunakan pada website umumnya yaitu buku tamu dan galeri foto.

Buku Tamu

Buku tamu adalah salah satu media yang paling mudah digunakan untuk interakasi

pengunjung dan pengelola website, dengan menggunakan buku tamu, pengguna dapat

memberikan komentar mengenai website tersebut secara langsung. Ada yang perlu

diperhatikan dalam pembuatan buku tamu, mengingat begitu mudahnya pengunjung

menuliskan sesuatu ke dalam buku tamu, perlu dibuat semacam filter yang mencegah

pengunjung menuliskan kata yang tidak semestinya.

Gambar 20: Contoh buku tamu

Kali ini yang digunakan untuk membuat buku tamu pada Joomla adalah EasyBook,

component yang mudah digunakan dan juga dapat dikostumisasi sesuai kebutuhan. Selain

itu EasyBook juga mempunyai filter badword yang bisa digunakan untuk menyaring kata-

kata kotor yang ditulis pengguna. Berikut adalah langkah-langkah instalasinya.



1. Masuk ke dalam menu Extension Instal/Uninstall

2. Klik browse dan cari file instalasi easybook (saat ini yang saya gunakan nama filenya

"com_easybook_2.0_rc4_valid.zip").

3. Klik upload file & install

Bila berhasil akan ada konfirmasi easybook berhasil dipasang, selain itu juga dalam menu

Component akan ada satu submenu dengan nama easybook. Selanjutnya yang perlu kita

lakukan adalah mengubah setting easybook agar dapat digunakan sesuai dengan keinginan

kita. Langkah-langkahnya sebagai berikut.

Gambar 21: Tampilan atas EasyBook Manager

1. Klik menu Components EasyBook Manage Entries.

2. Selanjutnya klik icon Parameters di bagian atas sebelah kanan.

3. Setelah muncul tampilan konfigurasi parameter, kita bisa menuliskan kata-kata

pembukaan misalkan "Mohon mengisi buku tamu".

4. Jangan lupa untuk memastikan Allow smilies, automatic word wrapping, IP logging,

show e-mail field, require e-mail, Show web site field, Publish new entries, dan

Badword filter dalam pilihan "yes" (atau "show").

5. Untuk pilihan Group for adding an entry juga pastikan bernilai "Everybody" agar

semua pengunjung dapat menuliskan komentar di buku tamu.

6. Setelah selesai, tekan tombol Save.

Gambar 22: Parameter pada EasyBook



Selanjutnya adalah membuat menu pada kategori menu utama agar halaman buku tamu

dapat diakses oleh pengunjung. Langkah-langkahnya adalah sebagai berikut.

1. Klik menu Menus Main Menu.

2. Kemudian klik icon New untuk menambahkan menu baru

3. Pada Select Menu Type, klik pada Easy Book, tunggu bentar dan akan muncul sub

menu Standard layout, klik pada sub menu tersebut.

4. Selanjutnya form menu akan muncul, isikan "Buku Tamu" pada Title dan "buku-

tamu" pada Alias.

5. Sebelum menyimpannya, klik pada Parameters (Component) untuk menampilkan

isian parameter.

6. Kemudian pada Group for adding an entry pilih nilai "Everybody".

7. Setelah selasai baru klik icon Save di bagian atas.

Gambar 23: Form menu untuk menambahkan menu Buku Tamu

Selesai tugas terakhir untuk memasang buku tamu dan menampilkannya pada halaman front

page. Hasilnya bisa anda lihat pada halaman utama website. Untuk menuliskan komentar

baru pada buku tamu, kita bisa mengklik Sign guestbook.

Setelah berhasil membuat buku tamu, kita akan membuat yang sedikit lebih kompleks, yaitu

foto galeri dengan menggunakan plugin JoomGalery.



Foto Galeri

Terkadang kita ingin menampilkan kumpulan foto yang terkategori ke dalam website, bisa

saja kita memasukkannya menggunakan artikel seperti kebanyakan blog yang (memaksa)

menampilkan galeri foto. Namun selain tampilannya kurang bagus, juga lebih sulit untuk

mengupload dan mengupdate album.

Gambar 24: Contoh Galeri Foto pada Joomla

Joomla mempunyai banyak plugin yang bisa digunakan untuk membuat galeri foto, salah

satunya yang banyak dipakai adalah JoomGalery. Langkah instalasinya cukup mudah,

konfigurasinya juga tidak terlalu sulit. Berikut adalah langkah-langkahnya.

1. Seperti biasa install terlebih dahulu dengan Install/Uninstall manager file instalasi

JoomGalery (yang saya gunakan JOOMGALERY_1_5_0_2.zip).

Gambar 25: Instalasi JoomGalery

2. Setelah berhasil, seharusnya kita sudah bisa mengakses menu JoomGalery baru pada

menu Component.



3. Pertama buat kategori album pada Category Manager.

4. Klik icon New, kemudian ketikkan Title, Parent Category, dan Description. Pastikan

Access bernilai "public", dan Published bernilai "Yes". Kemudian Save.

Gambar 26: Form Category

5. Untuk mengupload gambar, kita menggunakan pilihan Picture Upload untuk upload

secara langsung, Batch Upload untuk mengupload gambar dalam file *.zip, FTP

Upload untuk mengupload gambar yang telah diupload sebelumnya melalui FTP, dan

terakhir Java Upload untuk cara upload yang lebih modern dengan Java.

Gambar 27: Form Picture Upload



6. Setelah berhasil menguploadnya, kita baru bisa mengatur propertinya melalui

Picture Manager.

7. Pada picture manager, kita bisa menginputkan Title, Description, dan juga Author.

Dan jika ingin menghapus semua voting pada foto, kita bisa mencek pilihan clear all

votes.

Gambar 28: Tampilan Picture Manager

Selain pengaturan di atas, masih ada banyak pengaturan lain, seperti pengaturan voting,

pengaturan komentar, pengaturan CSS, dan pengaturan konfigurasi. Namun kesemuanya itu

tidak akan dipelajari saat ini karena terlalu banyak. Yang perlu diperhatikan adalah pada

menu Configuration Manager General Settings Paths and Directories, pastikan semua

path yang ada pada konfigurasi tersebut dapat ditulisi (writeable). Jika belum bisa ditulisi,

kita perlu mengaturnya melalui CPanel web hosting, dan mengesetnya menjadi chmod 766.

Selanjutnya adalah membuat menu agar galeri foto kita dapat dibuka oleh pengunjung.

Caranya sama seperti waktu kita membuat menu untuk buku tamu, yaitu dengan melalui

Menu manager. Lebih jelas, langkahnya adalah sebagai berikut.


BAB 7Personalisasi Template Joomla

Bab ini merupakan bab yang sangat berbeda dari sebelumnya, bila pada bab sebelumnya

kita lebih banyak berurusan dengan tampilan grafis dari halaman administrator Joomla, pada

bab ini kita akan banyak (melakukan pekerjaan istilah gaulnya "mengotori tangan" dengan)

menulis kode pemrograman HTML, CSS, dan sedikit XML serta PHP.

HTML, CSS, dan XML

Kurang tepat kalau ketiganya dikatakan bahasa pemrograman, karena tidak mampu

melakukan operasi logika maupun aritmatika apapun, dengan ketiganya kita tidak akan bisa

melakukan perhitungan 1 + 1 = 2. Istilah bahasa pemrograman hanya untuk memudahkan

orang awam agar bisa memahami yang akan dilakukan selanjutnya adalah penulisan kode-

kode yang tidak sering ditemui pada kehidupan sehari-hari, seperti layaknya menuliskan

kode pemrograman.

HTML (HyperText Markup Language) merupakan suatu bahasa yang digunakan untuk

membuat tampilan tertentu pada halaman website, yang di dalamnya terdapat dua bagian

inti, yaitu bagian Head dan Body. Bagian Head digunakan untuk menuliskan elemen-elemen

dan juga deskripsi yang tidak tampak pada tampilan website, sedangkan bagian Body

digunakan untuk menuliskan elemen yang akan ditampilkan pada halaman website.

Gambar 29: Contoh penulisan kode HTML Sederhana

CSS (Cascading Style Sheet) adalah bahasa yang digunakan untuk mengatur properti pada

elemen-elemen HTML sehingga bisa terlihat lebih bagus. Contoh properti yang diatur adalah



warna, warna latar, typografi, posisi, ukuran, dan lain sebagainya. CSS biasanya (dan lebih

baiknya) ditulis dalam file tersendiri, kemudian pada file HTML dipanggil pada bagian Head.

Pada CSS terdapat selector yang digunakan untuk memilih elemen HTML yang diatur

propertinya dan pengaturan properti sendiri.

Gambar 30: Contoh penulisan kode CSS Sederhana

XML (eXtensible Markup Language) merupakan bahasa yang digunakan untuk mendifinisikan

data. Dengan menggunakan metode penulisan yang hampir sama seperti HTML, namun

kode-kode yang digunakan dapat didefinisikan sendiri oleh kita, membuat XML mudah

dibaca oleh manusia dan juga mudah diterjemahkan oleh komputer (mesin).

Gambar 31: Contoh penulisan kode XML Sederhana

Dalam pembuatan template Joomla, HTML dan CSS digunakan untuk mendisain tampilan

sebaik mungkin (kadang-kadang juga diperlukan JavaScript untuk menambahkan animasi).

Sedangkan XML digunakan untuk mendefiniskan bagian-bagian yang ada pada template,

sehingga dapat digunakan untuk berinteraksi dengan konten Joomla yang lain.



Costumisasi Template Joomla

Awalnya pada bab terakhir penulis berencana untuk mengajarkan cara membuat template

sendiri menggunakan Joomla, tapi untuk mengajarkan itu semua dari Nol sampai Akhir

diperlukan waktu yang cukup lama dan juga referensi yang cukup banyak. Sehingga penulis

memustukan untuk mengubah target bab ini lebih mudah, lebih aplikatif, namun tepat dapat

digunakan untuk personalisasi website.

Pada bab ini kita tidak akan membuat template dari nol, namun kita akan mengubah dari

template yang sudah ada sehingga tampak seperti buatan kita sendiri, atau paling tidak lebih

berbeda dari template aslinya. Untuk keperluan tersebut, kita akan menggunakan template

gratisan dari Siteground yang tampilan aslinya seperti dibawah ini.

Gambar 32: Tampilan awal template dari Siteground

Mungkin kita tidak akan banyak merubah tata letak tampilan tersebut, tapi hanya mengubah

beberapa warna dan gambar sehingga sesuai dengan yang kita inginkan untuk situs kita

sendiri. Karena bersifat gratisan, kita tidak perlu khawatir merubahnya bahkan

mendistribusikannya kembali.

Agar kita dapat langsung melihat hasilnya, kita perlu menginstallnya terlebih dahulu pada

website Joomla kita yang sudah ada isinya. Caranya seperti instalasi extension yang lain,

melalui menu Extension Install/Uninstall. Selanjutnya pilih file siteground-j15-35.zip, dan

klik Upload File & Install.

Sedikit intermezo. Meskipun Joomla telah menyediakan perangkat editor HTML dan CSS,

penulis sendiri lebih nyaman menggunakan program editor khusus, karena fitur syntax

highligter dan juga code foldingnya sangat membantu penulisan kode. Namun mungkin itu



tidak akan efektif jika kita telah mengupload website ke dalam web hosting. Nyaman atau

tidaknya menggunakan editor adalah tergantung kebiasaan dan keadaan, jadi anda juga

bebas memilih editor apa yang akan anda gunakan. Hanya saja yang penulis gunakan saat

membuat tutorial ini adalah Notepad++, editor gratisan yang mempunyai fitur cukup

lengkap, dan mengedit file yang ada di komputer lokal.

Untuk mengubah tampilan template tersebut, mengakses file HTML (istilah dalam template

Joomla) yang juga adalah file bernama index.php pada folder Template/siteground-j15-35.

Ini merupakan elemen-elemen tampilan yang belum diberikan properti tampilan sama

sekali. Adapun pengaturan tampilannya ada pada file css bernama Template.css yang

terletak pada folder Template/siteground-j15-35/css. Untuk lebih mempermudah buka saja

kedua file tersebut untuk diedit secara langsung.

Percobaan pertama kita adalah mengubah warna background menjadi hijau muda, untuk itu

lihatlah petika kode HTML pada file index.php di bawah ini.

Gambar 33: Petikan kode Index.php

Pada gambar di atas, amati baris ke 14, terdapat kode <body id="page_bg">. Itu

adalah kode HTML yang digunakan untuk memberikan identitas pada elemen, sehingga

nantinya lebih mudah diatur warnanya pada kode CSS.

Sekarang kita berpindah ke file template.css, kita cari kode "page_bg" (untuk lebih

mudahnya gunakan saja fasilitas search). Kita akan mendapatinya pada baris ke 100, dan

gambar lengkapnya seperti di bawah ini.

Gambar 34: Petikan kode template.css



Kemudian untuk merubah warna dari elemen page_bg menjadi hijau muda, ubahlah nilai

background yang semula "#FFF" menjadi "#88ff88" (jangan hilangkan karakter ";"). Simpan

dan lihat hasilnya pada website kita, lihat kita telah berhasil mengubah warna latar menjadi

hijau muda, dan siap untuk melakukan perubahan lainya.

Selanjutnya kita akan mengganti gambar yang ada pada Header dengan gambar yang lebih

cocok dengan latar belakangnya. Tidak terlalu sulit untuk mengubahnya (jika anda sudah

menguasai photo editor seperti PhotoShop atau GIMP), tinggal mengganti file header.jpg

yang berada pada folder template/siteground-j15-35/images dengan gambar yang baru.

Yang perlu diperhatikan adalah, agar layoutnya tidak berubah, kita harus menggunakan

gambar dengan ukuran yang sama, baik panjang dan lebarnya.

Gambar 35: gambar header setelah diganti

Oke, sudah berhasil mengganti gambar header. Tapi bahkan saya yang bukan desainer grafis

pun tahu, ada yang tidak beres dengan judul situsnya, tulisan judul situs kurang kontras dan

juga posisinya kurang tepat. Berarti pekerjaan kita selanjutnya adalah mengaturnya supaya

tepat dengan latar belakangnya.

Kembali ke gambar 33, sekarang perhatikan pada baris ke 17. Terlihat ada variabel Joomla

yang digunakan untuk menampilkan nama situs dan dimasukkan kedalam container <div id="logo">. Seperti tadi, kita tinggal mencari kata kunci "logo" pada template.css.

Gambar 36: Petikan template.css (elemen logo)



Elemen logo yang diatur pada baris 150 sampai 155, adalah pengaturan posisi text logo.

Sedangkan pengaturan teks dan warnanya ada pada baris 157 sampai 168.

Untuk mengubah posisi text, kita bisa mengganti padding pada baris 151 yang sebelumnya

bernilai "30px 0 0 170px" menjadi " 55px 0 0 80px ". Sedangkan untuk mengubah tampilan

font, kita perlu mengubah color menjadi "#ffffcc", font-weight menjadi "bold", font-size

menjadi "25px", dan menambahkan properti text-transform dengan nilai "capitalize" untuk

memastikan huruf depan tiap kata menjadi kapital.

Setelah berhasil mengubah header, sekarang kita langsung ke bawah untuk mengubah

Footer. Selain tampilannya yang kurang cocok dengan warnanya, seringkali kita ingin

menghilangkan jejak pembuat template yang sebenarnya, atau bahkan menghilangkan jejak

Joomla sama sekali untuk alasan keamanan atau agar dianggap keren saja.

Gambar 37: Tampilan Footer yang belum diubah

Untuk melakukannya, kita lihat kembali file index.php yang merupakan inti dari Layout

template joomla yang kita kerjakan saat ini. Terlihat pada baris 53, terlihat identitas footer

itulah yang nanti akan kita cari pada template.css. Selain itu ada satu lagi, yaitu container

<div id="sgf"> yang berisi pemanggilan pada file lain yaitu templates.php.

Gambar 38: Kode HTML untuk Footer (index.php)

Gambar 39: Kode HTML untuk Footer (templates.php)



Untuk mengubah informasi yang ada di footer, agar mengarah pada kita, langsung saja kita

dapat mengubah informasi yang ada pada templates.php. Contoh pengubahannya untuk

personalisasi adalah seperti gambar dibawah ini.

Gambar 39: Kode HTML baru untuk Footer (templates.php)

Sedangkan untuk merubah tampilan, kita siap berangkat untuk memodifikasi template.css,

sesuai dengan identitas elemen yang sudah kita dapatkan sebelumnya yaitu footer dan sgf.

Pengaturan footer dapat ditemukan pada baris 257 sampai dengan 264, sedangkan

pengaturan sgf dapat ditemukan pada baris 939 sampai dengan 956.

Untuk mengubah tampilan latar belakang kita perlu menambahkan satu baris properti yaitu

background dengan nilai " url(../images/footer_gradient.jpg) #ffffff top right repeat-x".

Ternyata setelah diubah terlihat panjang dari footer tidak sesuai dengan panjang content

sebelumnya, sebab itulah kita perlu mengubah nilai width menjadi "960".

Pada informasi Footer, sebenarnya ada teks yang menjadi link dan ada yang tidak, tapi

karena pengaturannya di samakan jadi tidak terlalu tampak. Bila ingin membuatnya terlihat

berbeda, kita bisa mengatur tampilan link tersebut antara baris 940 sampai 951. Ubah nilai

color pada baris 941 dan baris 946 menjadi "#333", kemudian agar tampak lebih tebal

tambahkan properti font-weight dengan nilai "bold" pada baris 949 dan 943. Tampilan

Footer akan berubah seperti di bawah ini.

Gambar 40: Tampilan Footer setelah diubah

Selanjutnya kita akan melakukan tugas yang sedikit lebih sulit. Kesulitannya bukan pada

pengubahnnya, tapi pada pencarian elemennya, karena elemen yang kita atur sekarang

adalah elemen buatan Joomla, bukan elemen yang ada pada template seperti sebelumnya.

Pertama kita akan mengubah pengaturan tulisan "Welcome to the Frontpage" yang terletak

di bawah menu. Setelah di cari pada index.php, ternyata tidak ada. Tentu saja, karena itu

adalah content buatan Joomla yang sewaktu-waktu bisa berubah. Untuk mencarinya

identitas elemennya, kita perlu membuka view source pada browser kita.

Penulis menggunakan Mozila Firefox untuk membuka halaman website dan membuka kode

sumber, dan hasilnya adalah tulisan "Welcome to the Frontpage" ditemukan pada baris 246



dan dimasukkan dalam container dengan class componentheading. Selanjutnya kita tinggal

mencari pengaturan elemen tersebut pada template.css dan ketemu pada baris 289.

Tidak ada pengaturan tampilan yang dilakukan pada elemen ini, kecuali menghilangkannya,

karena memang saya sejak awal tidak suka ada tampilan judul halaman di sini. Caranya

mudah, tinggal menambahkan pengaturan display dengan nilai "none", dan elemen tersebut

akan disembunyikan.

Pengaturan selanjutnya adalah pengaturan header menu. Seperti sebelumnya, kita tidak

akan menemukan identitas elemen (secara deskriptif) pada file index.php, kita perlu

membuka source code-nya terlebih dahulu. Cari tulisan "Main Menu". Nah ketemu pada

baris 46.

Terlihat pada kode sumber tersebut, ternyata Judul menu adalah elemen <h3> yang

terdapat di dalam elemen module_menu. Setelah dicari pada template.css, ternyata tidak

ada pengaturan elemen h3 di dalam module_menu. Penelusuran berlanjut sampai

ditemukan pengaturan h3 di dalam elemen leftcolumn pada baris 616 sampai 631. Kembali

kita melihat kode sumber halaman website, ternyata memang benar elemen h3 yang kita

maksud juga terletak di dalam elemen container leftcolumn, berarti pencarian kita berhasil,

selanjutnya adalah modifikasi pengaturan.

Pengaturan yang akan kita lakukan disini hanyalah mengubah warna tulisan agar terlihat

lebih kontras, serta mengubah garis titik menjadi garis solid. Untuk itu yang perlu kita ubah

adalah nilai color menjadi "#444", kemudian juga mengubah nilai "dotted" pada border-top

dan border-bottom menjadi "solid". Agar warnya garisnya tidak terlalu kontras kita ubah

nilai "#777" manjadi "#aaa" pada kedua properti tersebut.

Sampai di sini pengaturan kita memang belum selesai dan tidak akan pernah selesai,

mengingat tiap orang mempunyai ide dan keinginan untuk tampilan yang berbeda. Tapi

paling tidak, kita telah berhasil mempraktekkan dasar-dasar kostumisasi tampilan pada

Joomla dengan mengubah template yang sudah ada. Selanjutnya dengan lebih banyak

latihan dan latihan, kita akan mampu membuat template kita sendiri mulai dari Nol.


Modul Joomla

Documents

Transcript of Modul Joomla