TUTORIAL
CARA CEPAT MEMBANGUN WEBSITE
DENGAN JOOMLA! 1.5
Afif Nurwilianto
Wongbagoes MediaTM
+62 85233801344
[email protected] | http://wongbagoes.net
TENTANG PENULIS
Afif Nurwilianto – Wongbagoes sebenarnya bukan seorang ahli bahasa pemograman
ataupun pakar website. Namun, penulis diberikan kesempatan untuk mengenal beberapa
CMS sehingga sedikit mampu (meskipun belum sebaik seorang pakar) membangun
beberapa website berbasis Joomla! ataupun Wordpress. Selain membangun website,
penulis juga aktif menulis di blog pribadi maupun komunitas. Dan pada bulan Mei 2009,
penulis menjuarai kompetisi SEO (Search Engine Optimization) Ebeye. Penulis dapat
dihubungi melalui no HP 08523380134, Yahoo Messenger willwee306, email:
[email protected] dan [email protected] atau dapat mengunjungi blognya di
http://wongbagoes.net.
DISCLAIMER
Tulisan dalam buku ini merupakan gabungan dari pengalaman penulis dan dipadukan berbagai sumber referensi.
Kesamaan atau kemiripan dalam penyajian maupun penggunaan istilah sangat mungkin terjadi. Anda
diperkenankan untuk mempublikasikan, atau menggandakan seluruh atau sebagian dari buku ini. Jika Anda
berkenan, untuk tetap menyertakan nama penulis dalam setiap publikasi atau penggandaan yang menggunakan
buku ini sebagai panduan ataupun referensi.
Chapter 1 – Mengenal Joomla!
Joomla! merupakan salah satu Content Management System (CMS) yang
bersifat Open Source. Joomla! adalah sebuah software gratis yang dapat
digunakan untuk membuat web yang paling sederhana hingga paling
kompleks. Disebut open source karena pengguna dapat memodifikasi,
menghapus, maupun menambah script yang disertakan dalam software
tersebut asal tetap mencantumkan hak cipta dan mentaati peraturan yang
telah disepakati bersama-sama. Joomla! adalah salah satu CMS yang
memilliki komunitas besar di seluruh dunia dengan didukung oleh para pengembang ketiga yang akan terus
mengembangkan program inti Joomla!.
1.1 Sejarah
Munculnya Joomla! berawal dari “konflik internal” di dalam kepengurusan pengembang inti Mambo Open
Source atau lebih sering dikenal dengan Mambo pada tahun 2005. Pihak pendiri (Founder) Mambo ingin
membentuk sebuah institusi yang bernama Mambo Foundation. Gagasan tersebut ditentang keras oleh
pengembang dari pihak ketika (3rd Developer), alasannya karena jika pengembangan Mambo dikendalikan
oleh Mambo Foundation dikhawatirkan suatu saat Mambo akan dikomersilkan. Sekitar bulan Agustus 2005,
sebagian pengembang inti Mambo keluar dari kepengurusan pengembang program inti Mambo.
Perkembangan selanjutnya, para pengembang inti Mambo yang keluar dari kepengurusan tersebut
bergabung dan pada 16 September 2005 membuat sebuah CMS bernama Joomla Open Source. Rilis
versi awal Joomla yaitu versi 1.0.0 yang merupakan “cloning” dari Mambo versi 4.5.3. Disebut cloning
karena memang semua sciptnya sama persis. Nama Joomla! merupakan sebuah ejaan yang berkaitan
dengan ilmu fonetik dari kata Swahili “Juumla” yang memiliki arti bersama-sama atau secara keseluruhan..
Komunitas di belakang Joomla! meliput para pengembang, para perancang, pengurus sistem, penerjemah,
para penulis isi, dan yang paling penting yaitu pengguna (end user). Ketika buku ini ditulis, Joomla sudah
merilis versi 1.5.11. Meskipun Joomla menggunakan bahasa PHP, bukan berarti harus memahami
seluruhnya tentang bahasa PHP. Bagi mereka tidak memahami kode HTML, ASP, CGI, maupun php tidak
perlu takut untuk mempelajarinya karena meskipun tidak tahu tentang kode-kode tersebut, namun masih
bisa membuat sebuah web dinamis secara cepat dengan beberapa fitur yang sangat lengkap. Untuk
mengetahui lebih lanjut tentang Joomla!, dapat mengakses langsung ke alamat website resminya di
http://www.joomla.org.
1.2 Keunggulan Joomla!
Pada awal perkembangannya, Joomla! tidak diminati oleh masyarakat luas. Alasanya klasik, yaitu
dikarenakan Joomla! merupakan software yang gratis sehingga dianggap tidak aman, banyak kelemahan,
kurang bergengsi, tidak impresif dan anggapan negatif lainnya. Sikap apatis tersebut dipatahkan oleh para
pengembang inti Joomla! dengan dibuktikannya beberapa aplikasi tambahan yang sangat fleksibel untuk
disisipkan ke dalam sistem Joomla!. Pada akhirnya, masyarakat dapat memanfaatkan Joomla! untuk
berbagai keperluan terutama membangun website secara cepat tanpa mengesampingkan segi keindahan
tampilan.
Keunggulan Joomla! antara lain:
1. Simple tapi sangat powerfull. Dengan Joomla kita bisa membuat berbagia macam website dinamis. Dari
website yang sangat simpel hingga yang sangat kompleks.
2. Mengakomodasi penguna dengan berbagai macam kemampuan. Bagi yang tidak mengenal PHP sama
sekali, menggunakan Joomla! sama seperti menggunakan aplikasi desktop sehari-hari. Akan tetapi bagi
yang mengerti bahasa pemograman Joomla! menyediakan fasiltas dimana kita dapat mengkostumisasi
berbagai script dan tampilan yang sudah ada.
3. Free dan Open Source. Joomla adalah software open source yang dibangun bersama oleh komunitas.
Anda bebas menggunakan, memodifikasi, mendistribusikan tanpa dipungut biaysa sepeserpun.
Chapter 2 – Instalasi Web Server
Bagi orang awam, mungkin masih terasa asing dengan istilah Apache, PHP, dan MySQL. Karena tanpa
adanya ketiga aplikasi tersebut, maka instalasi Joomla! tidak dapat dijalankan di komputer pribadi (PC).
Sedikit gambaran tentang ketiga hal tersebut:
1. Apache merupakan salah satu dari sekian banyak aplikasi yang berfungsi sebagai web server.
Aplikasi ini sangat reliable untuk dijadikan web server pada komputer pribadi (PC). Untuk informasi
lebih lanjut, silakan kunjungi website resmi di http://apache.org.
2. PHP merupakan salah satu bahasa pemrograman berbasis web. Oleh karena Joomla menggunakan
bahasa PHP, maka dalam komputer pribadi (PC) harus terinstal bahasa PHP. Untuk informasi lebih
lanjut silakan kunjungi website resminya di http://php.net.
3. MySQL merupakan salah satu tipe database yang paling banyak diminati para pengembang web
karena selain mudah instalasinya, juga database ini mampu menampung record sebanyak ratusan
giga. Database ini juga berada di bawah lisensi GNU yang berarti gratis dalam penggunaan
maupun penggandaan. Untuk informasi lebih lanjut, silakan kunjungi website resmi di
http://mysql.com
Dari ketiga software di atas kita diharuskan mengkonfigurasinya yang tidak mudah dan memerlukan waktu
apalagi yang masih awam dengan ketiga hal di atas. Namun, jangan khawatir karena orang awampun dengan
mudah dapat menjalankan ketiga aplikasi ini dengan satu paket software yang sudah menyediakan Apache,
PHP, dan MySQL. Ada berbagai macam web server saat ini, diantaranya: PHPTriad, EasyPHP, XAMP, Wamp
Server, Uniserver, AppServ, dan lain-lain. Untuk tutorial ini, penulis menggunakan WampServer sebagai web
server.
Instalasi WampServer
1. Siapkan file WampServer yang dapat diunduh di alamat http://www.wampserver.com/en/download.php
2. Double click pada file installer wampsever dan terlihat perintah instalasi sebagai berikut:
3. Muncul pembukaan instalasi dan lantas klik next
4. Muncul jendela yang menunjukkan alamat lokasi tempat akan dtempatkannya aplikasi WampServer. Secara
default akan dipilih c:\wamp, Kamu bisa mengubahnya ke tempat lain
5. Pada jendela berikutnya, Anda akan diberi pilihan untuk meletakkan shortcut (pintasan) WampServer,
sebagai ikon di desktop maupun sebagai ikon di Quick Launch. Terserah Anda.
6. Proses instalasi sedang berjalan, silakan tunggu
7. Apabila Kamu telah mempunyai aplikasi mozilla firefox akan muncul jendela alert sebagai berikut:
Apabila Kamu ingin menjadikan Firefox sebagai web browser utama Wampserver, silahkan klik Yes.
8. Berikutnya muncul jendela pengaturan Mail Server, silakan disesuaikan dengan pengaturan Mail Server
Anda. Jika tidak, klik next.
9. Instalasi selesai, klik finish
10. Selanjutnya, klik pada icon Wampserver di kanan bawah desktop Anda dan klik localhost, maka anda akan di
arahkan ke web browser dengan Url http://localhost.
11. Maka tampilan di web browser kamu akan menjadi seperti di bawah ini dan menandakan proses instalasi
berhasil
12. Selesai, cukup mudahkan... ☺
Chapter 3 – Instalasi Joomla! 1.5.11
Setelah proses instalasi WampServer selesai maka kita siap untuk menginstal Joomla! dalam buku ini
menggunakan Joomla! 1.5.11.
1. Extract file Joomla! 1.5.11 ke folder C:\wamp\ www\web
2. Setelah proses ekstrak selesai bukalah salah satu browser (Internet Explorer, Firefox, Chrome, Opera, atau
yang lain) lalu ketikkan http://localhost/web, lalu tekan Enter. Perlu diingat, tulisan web bukan sebagai
patokan. Hal itu tergantung nama folder yang telah dibuat.
3. Tahap 1 - Pilih bahasa yang dikehendaki lalu pilih next di kanan atas.
Extract file Joomla! ke
folder www
4. Tahap 2 – Pemeriksaan sebelun instalasi. Secara default , Joomla mengecek kebutuhan yang harus
dipenuhi. Jika tidak ada masalah, bisa dilanjutkan dengan cara menekan tombol Next.
5. Tahap 3 – Persetujuan mengenai ketentuan lisensi. Pada tahap ini, hanya memberkan informasi
tentang lisensi dan peraturan-peraturan yang harus dipenuhi dalam menggunakan Joomla Open Source.
Tekan tombol Next untuk melanjutkan.
6. Tahap 4 - Database. Masukkan Host, Username, Password, dan nama Database (periksa kembali ketika
membuat database sebelumnya), jika telah yakin tekan tombol Next.
7. Tahap 5 – Konfigurasi FTP. Tidak ada yang perlu dikonfigurasi lantas klik next.
8. Tahap 6 – Konfigurasi Utama. Pada tahap ini kita diminta untuk memasukkan nama situs, misal: Workshop
Joomla! 2009. Kemudian masukkan alamat email dan masukkan passwordnya admin agar mudah diingat.
Sebaiknya aktifkan fasilitas instal sample data agar website tidak kosong sehingga tidak membingungkan
pada tahap selanjutnya. Jika lupa mengaktifkan fasilitas ini, website Anda akan blank. Berikutnya, klik tombol
Next.
9. Tahap 7 – Finish.
Sebelum Joomla dapat digunakan, ada satu langkah terakhir yang harus dilakukan. Anda harus menghapus
folder instalation dalam folder joomla.
10. Setelah dihapus sillahkan refresh URL http://localhost/web. Akan nampak tampilan sebagai berikut:
Chapter 4 – Bagian Utama Joomla!
Joomla terdiri dari dari dua bagian besar, frontend dan backend. Frontend adalah halaman depan situs kita.
Sedangkan backend adalah bagian administratif yang hanya bisa dimasuki oleh orang-orang tertentu saja.
Backend login screen
Frontend
Sekilas mengenai backend
Saat pertama kali masuk ke bagian backend, anda akan disambut oleh icon-icon kontrol panel. Icon-icon ini
merupakan jalur cepat menuju fungsi-fungsi yang sering dikunjungi.
Dalam halaman pertama backend terdapat icon-icon control panel dan juga terdapat menu bar di atas. Dibawah
pat tool bar. Berikut salah satunya:
Keterangan:
Masih belum familiar terhadap funsi di atas. Bisa itu karena sering!!!
Menu Bar
Control Panel
Chapter 5 – Mengelola Artikel
Oleh karena Joomla merupakan sebuah aplikasi web yang bersifat dinamis, maka penulisan artikel lebih
didahulukan dari pembuata item-item menu. Jika diurutkan proses pembuatan web portal menggunakan
Joomla, yang pertama kali dilakukan adalah membuat Section, lalu Category, kemudian Content (Article),
dan yang terakhir Item menu. Dalam prakteknya, berhubung masih terdapat artikel lain dari Joomla yang
tidak digunakan, terpaksa harus menghapus terlebih dulu Section, Category, dan Content tersebut. Sebuah
Category tidak dapat terhapus jika masih terdapat artikel yang berada dalam kategorit tersebut. Sebuah
Section tidak dapat terhapus jika masih terdapat Category di dalamnya. Secara singkat dapat dijelaskan,
semua artikel, category, dan section harus dihapus secara permanen dari administrasi Joomla agar
pengelolaannya lebih mudah dan cepat.
Identifikasi nama Section dan Category sejak awal sangat perlu dilakukan. Hal ini untuk memudahkan
ketika ingin menulis sebuah artikel, karena artikel yang akan ditulis harus mengacu pada nama Category
dan Section. Jika tidak nama Category dan Section yang dinginkan tidak nampak dalam daftar, maka harus
dibuat terlebih dulu. Sebagai persiapan untuk membuat web portal, berikut ini contoh struktur pembuatan
Section (S) dan Category (C).
Misal:
1. Olahraga (S) : 1. Sepakbola (C)
2. Basket (C)
3. Raket (C)
2. Politik (S) : 1. Nasional (C)
2. Internasional (C)
Jadi, sebelum menulis artikel harus membuat Section dan Category terlebih dulu agar ketika ditampilkan
halaman utama website lebih terstuktur sehingga pengguna tidak merasa bingung dalam menyerap
informasi yang ditampilkan.
5.1. Membuat Section
Dalam menentukan nama Section, terlebih dulu harus mengetahui tema artikel yang akan ditulis nantinya.
Hal ini untuk mempermudah pengelolaan nama Category dan Section yang sesuai dengan artikel tersebut.
Sebagai studi kasus, berikut ini penjelasan pembuatan Section yaitu : OLAHRAGA.
1. Pertama kali pilih menu Content > Section Manager.
2. Setelah berada dalam Section Manager, pilih tombol New
3. Masukkan nama Section = Olahraga pada kolom Title. Kemudian Aktifkan radio button Published =
Yes. Aturlah Public Access = Public.
4. Kemudian klik Save
5. Jika sudah selesai Anda bisa membuat section2x yang lainnya.
5.2. Membuat Category
Setelah selesai membuat section kita selanjutnya membuat category. Pilih content > category manager > new.
Untuk contoh kasus kita memilih ketegori sepakbola.
Karena kita tadi telah membuat section Olahraga dan sesuai dengan rencana akan teridri dari berkatagori salah
satunya sepakbola maka kita buat kategori sepakbola.
5.3. Membuat Article
Setelah siap kategori dan section selanjutnya kita memikirkan dan membuat artikel yang sesuai dengan category
dan section yang telah kita buat sebelumnya. Ok, sekarang kita membuat artikel yang misal judulnya “Ronaldo
Resmi Berseragam Madrid”
Masuk menu Content > Article manager > New
Setelah selesai ketik Save. Jangan lupa untuk memilih section terlebih dahulu kemudian akan muncul pilihan
category.
Banyak item-item yang belum dibahas, sebaiknya Anda mencoba satu demi persatu. Karena penulis yakin tresno
iku jalaran soko kulino. Anda akan mencintai Joomla! jika anda senantiasa bergaul dengan Joomla!. ☺
Chapter 7 – Mengelola Navigasi
Navigasi merupakan sesuatu yang sangat penting dalam sebuah website. Dengan navigasi, pengunjung dapat
mudah menumakan content yang mereka inginkan. Joomla sudah memiliki sistem pengaturan menu sendiri
untuk memudahkan administrator mengelola navigasi. Seperti telah dijelaskan di awal, bahwa item menu
dapat menghubungkan (link) Article maupun Component, misalnya: Games, Chatting, dan component lain.
Sedangkan untuk tampilan berita dapat berupa Blog, List, maupun Table.
Tipe item menu bermacam-macam yang dapat dibedakan menjadi empat tipe yaitu: internal link, external link,
separator, dan alias. Sedangkan untuk tipe Internal link juga memiliki beberapa kategori item menu yaitu:
Article, Concact, Newsfeed, Poll, Search, User, Weblink, dan Wrapper. Di sini tidak membahas seluruh tipe
item menu. Misal membuat menu baru yang masih berhubungan dengan artikel yang dibuat tadi.
Pilih Menu > main menu > new > section layout
Setelah selesai ketik Save.
Maka di halaman frontend akan muncul menu baru dibawah newsfeed. Untuk jenis yang lain silahkan coba
sendiri. ☺
Isikan olahraga
Pilih section
Chapter 8 – Mengenal Extensions
Secara umum, jumlah Extension (ekstensi) sangat banyak yang terbagi menjadi beberapa tipe yaitu:
Component, Language, Module, Plugins (Mambots), Special, dan Template. Dari beberapa tipe tersebut
dapat dibagi lagi menjadi beberapa kategori. Untuk mengetahui lebih detailnya, silahkan buka
http://extensions.joomla.org
8.1. Component
Jumlah Component yang berkembang saat ini lebih dari ratusan dan akan terus bertambah seiring
dengan perkembangan zaman dan kebutuhan penggunanya. Untuk menginstal Component, terlebih dulu
harus mendownloadnya di website resmi Joomla. Component ada yang gratis dan berbayar, namun tidak
perlu khawatir karena jumlah Component yang gratis lebih banyak dari yang berbayar. Keduanya sama-
sama memiliki fitur yang lengkap dan handal karena sudah teruji dan akan terus“dipantau” oleh komunitas
Joomla, forum diskusi maupun komentar dari para pengguna untuk perbaikan sistem agar lebih baik. Ciri khas
file component diawali dengan kata “com” di depan nama component Meskipun begitu, ada beberapa
component yang tidak menambahkan awalan “com” pada nama component.
8.2. Modules
Module merupakan bentuk ekstensi yang lebih ringan dan fleksibel. Ekstensi ini digunakan dalam
proses penampakan halaman. Anda hanya bisa menampilakan content di depan melalui modul.
8.3 Plugin
Adalah tipe ekstensi yang lebih rumit dan bekerja dengan cara menanggapi suatu event. Pada saat
joomla sedang melakukan kerjanya, baik itu pada inti joomla, modul atau komponen, satu atau lebih evenet akan
terpicu.
Mencoba Komponen Polls
Polls merupakan salah satu komponen yang hadir bersamaan dengan paket instalasi joomla. Sesuai namanya
komponen ini digunakan untuk membuat poling sederhana. Sekarang mari kita coba membuat poling.
Masuk component > polls > new
Lantas klik Save. Coba Anda tengok di front end, apakah sudah muncul poling tersebut??? Klo jawabanya iya
ajaib. Untuk memunculkan masuk extensions > module > polls
Pilih poling
yang sudah
dibuat
Chapter 9 – Mengganti Template
Selain tersedianya berbagai macam extensions, Joomla melalui pengembang pihak ke tiga juga mempunyai
ribuan template yang siap kita gunakan baik yang berbayar ataupun yang gratis. Tentu kita bosen dengan
tampilan default joomla yang terkesan biasa. Untuk mengganti template silahkan ikuti petunjuk beikut:
1. Sipakan file template (.zip) jika menginginkan gratisan dapat di download di siteground.com atau tanya
saja via google.com
2. Masuk extensions > installer > browse > upload
3. Setelah muncul peringatan instal success berarti proses instalsi berhasil. Silahkan Anda segera masuk ke
Extensions > Template manager > centang template yang di pilih > klik default
4. Sekarang tengok halaman frontend
BONUS – 5 Menit Membuat Website Online
Continued…..
Top Related