Sanksi Pelanggaran Pasal 72 Undang-undang Nomor 19 Tahun 2002 Tentang Hak Cipta 1. Barangsiapa dengan sengaja melanggar dan tanpa hak melakukan

Transkripsi

1

2 Sanksi Pelanggaran Pasal 72 Undang-undang Nomor 19 Tahun 2002 Tentang Hak Cipta 1. Barangsiapa dengan sengaja melanggar dan tanpa hak melakukan perbuatan sebagaimana dimaksud dalam Pasal 2 Ayat (1) atau Pasal 49 Ayat (1) dan Ayat (2) dipidana dengan pidana penjara masing-masing paling singkat 1 (satu) bulan dan/atau denda paling sedikit Rp ,00 (satu juta rupiah), atau pidana penjara paling lama 7 (tujuh) tahun dan/atau denda paling banyak Rp ,00 (lima miliar rupiah). 2. Barangsiapa dengan sengaja menyiarkan, memamerkan, mengedarkan, atau menjual kepada umum suatu ciptaan atau barang hasil pelanggaran hak cipta atau hak terkait sebagai dimaksud Ayat (1) dipidana dengan pidana penjara paling lama 5 (lima) tahun dan/atau denda paling banyak Rp ,00 (lima ratus juta rupiah).

3 Proyek Membuat Website Sekolah dengan Joomla! SUHANTO

4 PROYEK MEMBUAT WEBSITE SEKOLAH DENGAN JOOMLA! Perpustakaan Nasional : Katalog Dalam Terbitan (KDT) Penulis : Suhanto PROYEK MEMBUAT WEBSITE SEKOLAH DENGAN JOOMLA! - Cet. I. - Yogyakarta : Penerbit Lokomedia, hlm; 14 x 21 cm ISBN : Penerbit Lokomedia, Cetakan Pertama : November 2010 Editor : Lukmanul Hakim Cover : Subkhan Anshori Layout : Lukmanul Hakim Diterbitkan pertama kali oleh : Penerbit Lokomedia Jl. Jambon, Perum. Pesona Alam Hijau 2 Kav. B-4, Kricak Yogyakarta redaksi@bukulokomedia.com website : Copyright Lokomedia, 2010 Hak Cipta dilindungi oleh Undang-Undang Dilarang memperbanyak, mencetak ataupun menerbitkan sebagian maupun seluruh isi buku ini tanpa izin tertulis dari penerbit.

5 Kata Pengantar Memiliki website saat ini bukanlah sesuatu yang sulit atau wah lagi...dengan ada Joomla sebagai CMS (Content Managament System) yang sangat popular saat ini.banyak pihak yang menggunakan Joomla untuk kepentingan nonkomersial maupun komersial. Dengan adanya buku ini mengajak pembaca khususnya pemula yang baru mengenal Joomla, untuk mempelajari bagaimana konsep dan cara untuk membangun sebuah website dengan Joomla sehingga menghasilkan suatu web yang terlihat manarik. Untuk memudahkan pembaca, penulis juga menyertakan CD pendamping yang didesain khusus untuk pembaca sehingga dalam mempelajari setiap materi yang di berikan tidak akan mengalami kesulitan. CD ini terdiri dari Extensions Joomla, xampp-win , Template Joomla dan tidak kalah penting yaitu video tutorial. Puji syukur ke hadirat Allah SWT atas berkat dan rahmatnya sehingga penulis dapat menyelesaikan buku ini.mohon maaf jika ada kekurangan, Saran dan Kritik Anda sangat kami harapkan untuk penyempurnaan lebih lanjut dan Akhir kata, kami berharap buku ini dapat bermanfaat bagi banyak orang. Surabaya, Agustus 2010 Penulis v

6 vi

7 Daftar Isi Kata Pengantar...v Daftar Isi...vii BAB 1. Dunianya Web dan CMS Om Apa itu Joomla! Sejarah Singkat Joomla! Kelebihan Membuat Web dengan Joomla!...3 BAB 2. Persiapan Lahan Website Sekolah Instalasi WampServer Instalasi Joomla!...13 BAB 3. Renovasi Joomla Hingga Menjadi Website Sekolah Instalasi Template Joomla Rombak Menu dan Modul Joomla Sesuka Kita Instalasi Bahasa Indonesia di Joomla Mengatur Layout (Posisi Modul) Mengedit Nama Modul Membuat Section dan Category Website Sekolah...41 BAB 4. Memilih Perabotan untuk Mempercantik Website Sekolah Instalasi Modul untuk Website Sekolah Modul Clock Modul Counter...51 vii

8 Modul Shout Box Cara Menghapus Artikel di Joomla Membuat Artikel Baru Mengelola Artikel Membuat Link antara Menu dengan Artikel Mengganti Header Website Membuat Top Menu Hubungi Kami Membuat Top Menu Donwload Membuat Top Menu Agenda...77 BAB 5. Upload Website Sekolah ke Internet Berkenalan dengan Hosting dan Domain Mengekspor Database Joomla Memilih Hosting dan Domain Membuat Database dan Usernya Meng-Upload Website Sekolah...92 BAB 6. Cara Menggunakan Proyek Website SMK...97 BAB 7. Aneka Trik Joomla Pilihan Menghilangkan Tulisan Welcome to the Frontpage Mengubah Title Bar Mengubah Footer Website Menampilkan Status YM sampai Facebook Maaf Kami dalam Renovasi!!! Memanfaatkan Terjemahan Google Translate Mempercantik Tanggal pada Artikel viii

9 7.8. Make Up Website Anda dengan SlideShow Mempercantik Album Foto dengan Light Gallery Manajemen User Menampilkan Video dalam Artikel Daftar Pustaka ix

10

11 BAB I DUnianya Web dan CMS

12 Bab 1 Dunianya Web dan CMS Zaman dulu membangun sebuah web adalah kerjaan yang wah banget deh. Website adalah salah satu komponen yang sangat penting didalam dunia internet. Pembuatan website mempunyai berbagai tujuan. Saat ini sebuah website tidak hanya dimiliki perusahaan besar yang telah memiliki bisnis di dunia nyata, namun banyak sekali bisnis yang justru berawal dari internet dan tidak kalah pentingnya, website juga sudah digunakan didalam pemerintahan yang bahasa kerennya E- Government, ini bertujuan agar pemerintah lebih dekat dengan rakyat. Membangun Website Sekolah itu Susah & Mahal Ya? Ah, Itu Cuman Gooship Aja Kok... Jika anda menanyakan pertanyaan itu 10 tahun yang lalu, maka jawabanya adalah sulit Buanget the..karena anda dituntut untuk menguasai bahasa Pemograman HTML dan bahasa yang lain (yang pasti bukan bahasa Indonesia..he..he) dan jika pertanyaan itu anda menanyakan saat ini maka jawabannya bisa juga tetap sulit, bisa juga jawabannya sangat mudah. 1.1 Om Apa Thu Joomla! Joomla! adalah satu CMS (Content Management System) yang paling terkenal saat ini, Pengertian CMS itu sendiri adalah pengelolaan isi atau content. Bila dikaitkan dengan web, maka CMS bisa didefinisikan sebagai software yang mampu mengelola isi atau content dari sebuah website seperti melakukan publikasi, edit, ataupun menghapus sebuah content. Tentu saja, pengelolaan ini hanya bisa dilakukan oleh orang-orang yang telah diberikan hak untuk melakukannya. Yang termasuk ke dalam kategori content ini bisa saja berupa tulisan, gambar, video, file, ataupun yang lainnya. 1.2 Sejarah Singkat Joomla! Pada tahun 2001 sebuah perusahaan di Australia bernama Miro membuat sebuah 2 Proyek Membuat Website Sekolah dengan Joomla!

13 CMS bernama Mambo. Software ini dibuat dengan sistem open source sehingga konstributor terhadap pengembangan software ini sangatlah pesat. Karena melihat sisi bisnis yang semakin cemerlang pada tahun 2002, kini perusahaan mulai berubah pikiran dan membuat dua versi dari Mambo yaitu versi open source dan versi komersil yang dijual. Versi open source dinamakan MOS (Mambo Open Source) sedangkan versi komersilnya dinamakan Mambo CMS. Pada tanggal 17 Agustus 2005, perseteruan antara pengembang Mambo dengan Miro sebagai pemegang hak cipta mencapai puncaknya dimana para pengembang Mambo ramai-ramai hijrah dan mengembangkan CMS Open Source sendiri dengan nama Joomla!. Pada tanggal 16 September 2005 diperkenalkanlah Joomla! versi kepada publik yang sebenarnya merupakan produk yang sama dengan Mambo , tetapi dengan beberapa perbaikan. 1.3 Kelebihan Membuat Web dengan Joomla! Joomla! adalah salah satu Open Source Content Management Systems paling powerfull yang pernah ada. Digunakan diseluruh dunia dari situs yang paling sederhana sampai kepada aplikasi korporasi yang kompleks. Kelebihan Joomla! terletak pada kemudahan instalasi dan pengelolaannya. CMS yang satu ini merupakan CMS yang lengkap dan banyak dipakai oleh pengembang web baik luar dan dalam negeri. Sebagai jasa pembuatan website murah, penguasaan banyaknya program CMS sudah menjadi sebuah keharusan. Joomla! terbilang lengkap untuk fitur-fiturnya dan untuk belajar joomla pun gampang, karena sudah ada id-joomla.com yang didalamnya banyak tutorial tentang CMS ini. Id-joomla.com merupakan komunitas Joomla! Indonesia, anggotanya sudah banyak dan mereka saling sharing tentang fitur dan plugin terbaru dari Joomla!. Di dalam web ini kita juga bisa download Joomla! bahasa Indonesia. Berikut ini kelebihan-kelebihan membuat website dengan Joomla!. Kemudahan Instalasi Kemudahan Pengelolahan Open Source Banyak Buanget Fitur-fiturnya Bro sorry ya penulis hanya menjelaskan kelebihannya saja dan untuk kekurangan penulis tidak menjelaskan..he..he.. nah itu tugasnya pembaca untuk mencari Bab I. Dunianya Web dan CMS 3

14 kekurangan CMS Joomla ini, tapi caranya gimana OM tanya aja ama Uncle Google.. Dan tidak ada sistem yang sempurna 100% (Kesempurnaan Hanyalah Milik Tuhan). 4 Proyek Membuat Website Sekolah dengan Joomla!

15 BAB II Persiapan Lahan Website Sekolah

16 Bab 2 Persiapan Lahan Website Sekolah Oke..kita akan mempersipan lahan untuk website sekolah kita yang perlu Anda siapkan bukan Meteran untuk mengukur lahan Anda tapi yang Anda perlu siapkan thu Secangkir kopi dan Camilan..he..he Ok..L3st GO!!!!!! Disini kita akan melakukan instalasi WampServer dan Joomla, yang perlu Anda ingat semua tool dan component sudah penulis siapkan dalam bentuk CD, jadi kagak repott2..untuk nyarinya 2.1 Instalasi WampServer Pertama, kita kan melakukan instalasi WampServer yang akan berfungsi sebagai server local. Adapun tahap instalasinya adalah sebagai berikut: 1. Masukkan CD Master Joomla yang ada didalam buku, lalu klik 2x pada Icon WampServer2.0. Lihat gambar 2.1. Gambar 2.1 Ikon WampServer 6 Proyek Membuat Website Sekolah dengan Joomla!

17 2. Maka akan tampil kotak dialog Setup, klik tombol Yes. Lihat gambar 2.2. Gambar 2.2 Kotak dialog Setup 3. Maka tampil kotak dialog Welcome, klik tombol Next. Lihat gambar 2.3. Gambar 2.3 Kotak dialog Welcome Bab II. Persiapan Lahan Website Sekolah 7

18 4. Maka akan tampil kotak dialog License Agreement, pilih I accept the agreement, lalu klik tombol Next. Lihat gambar 2.4. Gambar 2.4 Kotak dialog License Agreement 5. Maka akan tampil kotak dialog Select Destination Location, biarkan terisi c:\wamp, lanjutkan dengan meng-klik tombol Next. Lihat gambar 2.5. Gambar 2.5 Kotak dialog Select Destination Location 8 Proyek Membuat Website Sekolah dengan Joomla!

19 6. Maka akan tampil kotak dialog Select Additional Tasks, pastikan pada bagian Additional icons sudah tercentang semua pilihannya, kemudian klik tombol Next. Lihat gambar 2.6. Gambar 2.6 Kotak dialog Select Additional Tasks 7. Maka akan tampil kotak dialog Ready to Install, langsung aja klik tombol Install untuk memulai proses instalasi. Lihat gambar Tunggu proses instalasi.. apabila di komputer Anda sudah terinstall browser Mozilla Firefox, saat proses instalasi berjalan akan tampil kotak dialog seperti pada gambar 2.8. Gambar 2.8 Kotak dialog menyatakan telah mendeteksi browser Firefox Bab II. Persiapan Lahan Website Sekolah 9

20 Gambar 2.7 Kotak dialog Ready to Install 9. Klik tombol Yes, maka proses instalasi akan dilanjutkan. Dalam beberapa komputer, apabila sudah terpasang proteksi Firewall, maka akan tampil kotak dialog Windows Security Alert. Lihat gambar 2.9. Gambar 2.9 Kotak dialog Windows Security Alert 10 Proyek Membuat Website Sekolah dengan Joomla!

21 10. Klik tombol Unblock, maka proses instalasi akan dilanjutkan, kemudian akan tampil lagi kotak dialog PHP mail parameters. Lihat gambar Gambar 2.10 Kotak dialog PHP mail parameters 11. Klik tombol Next, maka proses instalasi sudah selesai dengan menampilkan kotak dialog Complete, klik tombol Finish. Lihat gambar Selanjutnya, Anda perhatikan pada layar windows di pojok kanan bawah (taskbar), disana sudah terdapat ikon Wamp server yang menandakan bahwa Wamp sudah berhasil terinstall di komputer Anda. Lihat gambar Gambar 2.12 Ikon Wamp server di taskbar windows 13. Klik pada icon Wamp server, maka akan tampil beberapa setting, pilih/klik pada Start All Services untuk mengaktifkan Wamp server. Lihat gambar Bab II. Persiapan Lahan Website Sekolah 11

22 Gambar 2.11 Kotak dialog proses instalasi sudah selesai (complete) Gambar 2.13 Beberapa setting dari Wamp server 12 Proyek Membuat Website Sekolah dengan Joomla!

23 14. Jika sudah, coba Anda ketik di URL browser jika berhasil Anda akan mendapatkan tampilan seperti pada gambar Gambar 2.14 Halaman WampServer di browser Ok Coy? Selanjutnya silahkan nikmati secangkir copy serta camilan yang telah Anda siapkan sebelumnya, sebelum kita menempuh perjalanan selanjutnya. 2.2 Instalasi Joomla! Selanjutnya, kita akan melakukan instalasi Joomla dan cara instalasinya sangat mudah, biar Anda tidak nyasar dan salah jalan dalam instalasinya, silahkan Anda perhatikan baik-baik langkah instalasi berikut: 1. Masukkan CD Master Joomla ke komputer Anda, cari folder Joomla Kemudian, cari file dengan nama Joomla_1.5.rar. Ekstrak file tersebut, lalu letakkan hasil ekstrak tersebut di direktori c:\wamp\www. 3. Kemudian, ubah (rename) nama folder Joomla 1.5 yang baru Anda copykan Bab II. Persiapan Lahan Website Sekolah 13

24 tadi menjadi folder sekolah. 4. Selanjutnya, buka browser Anda, lalu ketikkan kemudian tekan tombol Enter di keyboard, maka akan tampil halaman instalasi Joomla. Lihat gambar Gambar 2.15 Halaman instalasi Joomla 5. Klik tombol Next, maka tampil Pre-installation Check. Lihat gambar Gambar 2.16 Halaman Pre-installation Check 14 Proyek Membuat Website Sekolah dengan Joomla!

25 6. Klik tombol Next, maka akan tampil halaman License. Lihat gambar Gambar 2.17 Halaman License 7. Klik tombol Next, maka akan tampil halaman Database Configuration dan Anda akan mendapat beberapa pertanyaan dan jangan khawatir, karena penulis sudah memberikan jawabannya..he..he..? Database Type : mysql, Host Name : localhost, Username : root, Password = (dikosongkan aja) dan Database Name = dbsekolah. Lihat gambar Gambar 2.18 Halaman Database Configuration Bab II. Persiapan Lahan Website Sekolah 15

26 8. Klik tombol Next, maka akan tampil halaman FTP Configuration, abaikan saja, klik tombol Next. Lihat gambar Gambar 2.19 Halaman FTP Configuration 9. Maka akan tampil halaman Main Configuration, isikan pada Site Name : (terserah Anda, contohnya: SMK N 3 MERAUKE), Your (sesuaikan dengan alamat Anda), Admin Password : 1234 dan Confirm Admin Password : 1234, dan terakhir jangan lupa untuk meng-klik pada tombol Install Sample Data, kemudian klik tombol Next. Lihat gambar Gambar 2.20 Halaman Main Configuration 16 Proyek Membuat Website Sekolah dengan Joomla!

27 10. Semua persyaratannya sudah Anda penuhi..dan Anda akan mendapatkan halaman Finish. Lihat gambar Gambar 2.21 Halaman Finish 11. Lho kok tampilan halamannya kayak error Boz Nyantai ae Brow.. Buka Windows Explorer, lalu masuk ke direktori c:\ wamp\www\sekolah\, kemudiaan cari folder installation, setelah itu hapus folder tersebut. Lihat gambar Semua langkah telah terpenuhi sekarang waktu untuk uji coba..apa semua langkah yg kita lakuin benar, coba ketik di browser dan jika semua langkah benar, maka Anda akan mendapatkan halaman seperti pada gambar Selamat!! Anda sudah berhasil melakukan instalasi Joomla. Agar nggak jenuh silakan Anda istirahat sambil nikmati snack ama secangkir kopi yang sudah Anda siapkan tapi inget..jgn lama2 karena tugas berat menanti kita... Apabila Anda kesulitan mengikuti langkah instalasi Wamp Server dan Joomla, Anda bisa langsung melihat videonya yang terdapat di CD Master Joomla pada folder Video Tutorial. Bab II. Persiapan Lahan Website Sekolah 17

28 Gambar 2.22 Menghapus folder installation yang terdapat di c:\wamp\www\sekolah Gambar 2.23 Halaman website Joomla yang sudah berhasil di install 18 Proyek Membuat Website Sekolah dengan Joomla!