MEMBUAT WEBSITE DENGAN Joomla!

1. MEMBUAT WEBSITE DENGAN Joomla! Muhammad Yusuf Laboratorium Sistem Informasi Universitas Trunojoyo Email/FB : yusufxyz@gmail.com

2. Apa itu Joomla! ? (1) • Joomla ! Adalah salah satu aplikasi untuk membuat website yang bersifat open source • Dengan Joomla ! Bisa membuat website tanpa membutuhkan pengetahuan tentang desain atau pemrograman web. • Dengan Joomla! Dapat membuat website dengan waktu yang relatif singkat • Beberapa kemudahan yang ditawarkan Joomla! adalah: a. Gratis Bisa didownload secara gratis di http://www.joomla.org, terdapat juga forum diskusi mengenai Joomla di http://www.id-jomla.com

3. Apa itu Joomla! ? (2) b. Kemudahan mengelola website Mengelola isi website dengan Joomla ! Lebih mudah karena sudah disediakan untuk pengaturannya. Pengguna Joomla ! Tinggal membuat apa yang ingin diisikan ke dalam website-nya. c. Kemudahan mengganti tampilan website Tampilan atau yang biasa disebut template Joomla! Sangat banyak dan beragam sesuai dengan versi Joomla!.

4. INSTALASI JOOMLA! (1) • Instalasi Joomla! secara Offline. Sebelum menginstal secara online, sebaiknya Joomla diinstal pada komputer kita sendiri. Yang perlu disiapkan adalah : - Server lokal yakni XAMPP 1.5.3 - Source Joomla! yang akan digunakan, kali ini kita memakai Joomla 1.0.15. - Joomla! Feature, yaitu semua elemen yang dibutuhkan untuk memodifikasi website, seperti module, component, dan template.

5. INSTALASI JOOMLA! (2) • Instalasi local server XAMPP 1.5.3. Sebelum menginstal Joomla!, kita memerlukan server sehingga Joomla! Dapat diinstal dan dijalankan di komputer local tanpa harus terhubung ke internet. Cara menginstall XAMPP 1.5.3. yaitu : 1. Klik 2x icon XAMPP yang ada di komputer anda.

6. 2. Pilih English pada pilihan bahasa yang disediakan 3. Klik OK

7. 4. Klik Next pada halaman setup wizard

8. 5. Klik Install Server XAMPP akan diinstall dalam folder C:\Program File

9. 6. Proses Instalasi berjalan. Jika sudah selesai, klik Finish

10. 7. Setelah proses instalasi selesai, akan muncul tampilan dibawah ini, lalu klik Finish

11. 8. Klik No agar XAMPP tidak masuk ke dalam proses service pada system operasi komputer kita. Jadi komputer tidak terbebani akibat dari XAMPP yang berjalan terus-menerus 9. Klik Yes, jika anda ingin langsung menjalankan control panel XAMPP server.

12. Menjalankan XAMPP Server • Setelah menginstall XAMPP, langkah berikutnya adalah menginstall Joomla!. Namun, sebelumnya harus menjalankan service Apache dan MySQL terlebih dahulu. Caranya adalah : 1. buka XAMMP melalui start-> All Program ->apachefriends->XAMPP->control panel XAMPP service Panel 2. Klik Start pada bagian Apache 3. Klik Start pada bagian MySQL

13. Dengan munculnya tulisan running, maka apache dan MySQL telah berjalan

14. Instalasi Joomla! Versi 1.0.15 • Cara menginstalnya adalah : • Buka folder di C:/Program Files/XAMPP/htdocs/. Buat folder dengan nama Lab Komputasi • Copy seluruh isi folder Joomla! 1.0.15 • Buka browser, lalu ketik localhost/labkomputasi, lalu tekan ENTER. Secara otomatis akan membuka file index.php di folder lab komputasi/installation. Kemudian, klik Next.

16. 4. Klik Next

17. 5. Isi formulir yang disediakan:Host Name : localhostMySQL User Name : rootMySQL Password : kosongkanMySQL Database Name : isi nama database (misal : labkomputasidb)MySQL Table Prefix : biarkan saja

18. 6. Klik Next. Kemudian klik OK jika semua isian telah benar.

19. 7. Masukkan nama situs (nantinya akan muncul di title bar). Misal : www.labkomputasi.com. Lalu klik Next.

20. 8. Isi alamat email dan ganti password yang diberikan (nantinya akan menjadi password admin). Lalu klik Next.

21. 9. Klik View Site untuk melihat halaman website yang telah kita buat. Ini adalah username dan password untuk masuk/login ke Administrator Joomla.

22. Pada tampilan ini anda diminta untuk menghapus folder installation di dalam folder labkomputasi Buka kembali Windows Explorer dan hapus folder installation di folder labkomputasi

24. 10. Refresh browser (tekan tombol F5). Tampilan utama Joomla akan muncul seperti berikut:

25. Menginstal Bahasa Indonesia • Pertama harus masuk terlebih dahulu ke Adminstrator. Caranya adalah : 1. Buka tab browser baru 2. Ketikkan di url address http://localhost/labkomputasi/administrator 3. Akan muncul seperti ini :

26. 4. Masukkan username dan password di login administrator. Lalu klik Login. Masuklah ke control panel seperti dibawah : 5. Klik Language Manager

27. . 6. Klik New, untuk menambahkan bahasa baru

28. 6. Akan muncul tampilan dibawah ini. Lalu klik Telusur/Browser.

29. 7. Pilih file indonesian_1.0.12.zip yang ada di komputer . Lalu klik open.

30. 8. Klik Upload File & install

31. 9. Jika sukses, klik Continue 10. Klik opsi Bahasa Indonesia, lalu klik Publish

32. Modifikasi Template • Template Joomla ! Standar bisa diubah sesuai dengan keinginan kita. Jika tidak mahir dalam bahasa pemrograman dapat menggunakan template yang sudah ada dan bisa di download dari internet. • Berikut ini langkah-langkah modifikasi template Joomla : 1. Klik menu Installer -> Template-site seperti gambar dibawah ini.

33. 2. Klik Telusuri/Browse seperti gambar dibawah ini

34. 3. Pilih file zip template yang dimiliki, pilih file js_lunar_eclipse.tar. Kemudian klik open.

36. 4. Klik Upload File & Install 5. Jika sukses, klik continue

37. 7. Klik Opsi JS_lunar Eclipse, yaitu nama template yang dipakai lalu klik Default. 8. Refresh browser. Maka tampilannya akan berubah seperti di bawah ini.

39. Modifikasi dan menonaktifkan Main Menu • Dari menu yang diberikan oleh Joomla, mungkin banyak yang tidak diperlukan. Anda bisa mengubah namanya atau menonaktifkan jika tidak diperlukan. • Untuk modifikasi menu dengan cara : Klik Menu yang ada di control panel Administrator, lalu pilih mainmenu. Setelah masuk ke halaman Menu Manager [mainmenu], klik tulisan Home dan ganti menjadi HALAMAN UTAMA seperti dibawah ini.

40. Jika menu lain tidak diperlukan, klik unpublish atau hilangan menu tersebut dengan cara : • Pada halaman Menu Manager, ceklist item menu yang akan dihilangkan • Klik ikon Unpublish dibagian atas. • Item menu yang tidak dipakai adalah : Joomla!! Licence, Links, Search, News Feed, FAQs, Wrapper.

41. Tampilannya akan seperti ini :

42. Modifikasi Top Menu • Selain main menu, ada juga item menu pada bagian atas yang disebut Top Menu. • Sekarang kita akan mengubah item Top Menu menjadi HALAMAN UTAMA, TENTANG LAB KOMPUTASI dan FORUM LAB KOMPUTASI • Caranya adalah : 1. Dari halaman control panel, klik Menu dan pilih topmenu.

43. 2. Klik Home

44. 3. Ubah menjadi HALAMAN UTAMA 4. Klik Save, tampilan halaman menu Manager pun akan berubah seperti dibawah ini. Untuk menampilkan atau tidak item Top Menu pd halaman website Untuk mengatur posisi item Top Menu

45. Menambah Item Menu • Untuk keperluan tertentu, kita perlu menambahkan beberapa menu sesuai dengan kebutuhan. • Caranya adalah : 1. Klik ikon menu di halaman Menu Manager (top menu).

46. 2. Pilih Link URL lalu klik Next

47. 3. Klik Save Pada Link, ketikkan dulu tanda ‘/’ karena kita akan membuat link halamannya nanti .

48. Lakukan hal yang sama untuk menu FORUM LAB KOMPUTASI Tampilan Top Menu setelah diubah seperti gambar berikut :

49. Membuat Menu Tentang Lab Komputasi • Pada sebuah website, biasanya ada profil pemilik website tersebut atau memberikan informasi yang berkaitan dengan website itu. • Caranya adalah : 1. Pada control panel, klik Menu lalu pilih Menu Manager

50. 2. Pada halaman menu manager, klik New 3. Ketik TENTANG LAB KOMPUTASI (tanpa spasi). Kemudian Klik Save.