MEMBUAT WEBSITE DINAMIS MENGGUNAKAN JOOMLA 1.5

Transkripsi

1 MEMBUAT WEBSITE DINAMIS MENGGUNAKAN JOOMLA 1.5 Sudah menjadi sesuatu yang lumrah bagi instansi, perusahaan ataupun badan usaha memiliki website termasuk sekolah. Website merupakan sebuah media yang sangat efektif untuk menjelaskan tentang sebuah instansi ataupun sebuah organisasi ke seluruh penjuru dunia. Artinya informasi yang disajikan dengan menggunakan website adalah informasi yang sifatnya global. Dimana, semua bisa mengakses informasi tersebut. Untuk membuat website, diperlukan beberapa pengetahuan khusus tentang teknologi teknologi yang harus dikuasai. Diantaranya : HTML Pemrograman WEB (PHP, JSP, ASP, dll). Database Client Side Programming (Javascript, VBScript, dll) Desain Grafis ( Photoshop, Corel, dll) Software untuk layout (Dreamweaver, Microsoft Frontpage, dll) Kesimpulannya, banyak hal yang harus kita ketahui sebelum membuat sebuah website. Kemudian yang menjadi pertanyaaan adalah : BISAKAH SAYA MEMPUNYAI / MEMBUAT WEBSITE TANPA HARUS MENGUASAI YANG DISEBUTKAN DI ATAS? Jawabannya tentu saja BISA. Kenapa tidak? Karena, ada sekolompok orang /komunitas yang berbaik hati membuatkan website untuk kita dan mendistribusikannya secara free1 jadi tugas kita adalah mengganti isi, gambar dan tampilan website tersebut sesuai dengan kebutuhan. Akan lebih baik lagi jika kita memiliki pengetahuan tentang teknologi di atas. Tetapi, jika tidakpun tidak masalah.. CMS (Content Management System) CMS merupakan solusi website yang sudah jadi yang bisa dimodifikasi sesuai dengan kebutuhan. Baik itu gambar, content dan lain sebagainya. Singkatnya, CMS memungkinkan kita mempunyai/mengelola website tanpa harus memiliki pengetahuan teknis tentang pembuatan website. 1 Free artinya adalah bebas, bukan gratis. Makna free lebih mengacu pada kebebasan. Kebebasan mengembangkan, kebebasan menggunakan untuk kepentingan apa saja dan kebebasan mendistribusikan tanpa diharuskan membayar lisensi. Kebebasan mendistribusikan inilah yang membuat kata free menjadi gratis (pemaknaan secara tidak langsung). Tapi sekali lagi, Free bukan gratis tapi bebas

2 Ada banyak CMS yang beredar saat ini. Salah satunya adalah Joomla!. Joomla adalah salah satu CMS yang cukup terkenal dan banyak digunakan di internet. Pada pembahasan kali ini, kita akan membuat website sekolah berbasis CMS Joomla! 1. Joomla! CMS Joomla adalah salah satu dari sekian banyak CMS yang ada saat ini. Daftar CMS yang ada saat ini dapat di lihat di Saat ini Joomla! Adalah salah CMS yang paling banyak digunakan. Tetapi secara umum, pada dasarnya, CMS mempunyai karakteristik yang sama. Bersifat modular artinya modul dapat diinstall terpisah, kemudian template juga dapat diinstall terpisah, dan semestinya, modul, componen, template dan lain lain banyak tersedia di internet. 2. Installasi Joomla Untuk menginstall Joomla! Langkahnya sangatlah mudah. Pertama download joomla dari situs resmi joomla. setelah mendapatkan file tersebut copy dan extract di Document Root. Jika kita menggunakan XAMPP, maka lokasi document root adalah di c:\program files\xampp\htodcs. Setelah mengcopy dan mengextract, rubah nama folder yang merupakan hasil extract tersebut menjadi sebuah nama yang mudah diingat dan mudah ditulis. Setelah itu, silahkan buka webbrowser (disarankan menggunakan mozilla firefox yang telah diinstall add ons Web Developer). Kemudian buka URL : namadiretori akan tampil halaman seperti di bawah ini : Tampilan di atas adalah tampilan untuk menginstallasi Joomla kita bisa memilih bahasa apa yang akan kita gunakan untuk proses installasi tesedia banyak pilihan bahasa. Disarankan

3 menggunakan English UK. Pilih bahasa pada bagian Select Language setelah klik Tombol Next yang ada di sebelah kanan atas. Gambar di atas menunjukkan tentang kebutuhan yang harus dipenuhi untuk menginstall Joomla!. Pastikan semua bertanda Yes berwarna hijau. Kemudian klik Tombol Next halaman di atas adalah keterangan tentangj lisensi Joomla!. Sebaiknya dibaca secara seksama untuk mengetahui tentang aturan main penggunaan sofware Joomla! Ini. Untuk melanjutkan proses Installasi, Klik Next. Proses berikutnya adalah configurasi database. Untuk melewati tahapan ini, kita terlebih dahulu harus membuat database yang berfungsi untuk menyimpan segala informasi yang dibutuhkan oleh Joomla!. Database yang akan digunakan adalah database MySQL. Oleh karena itu, kita harus membuat database baru pada database MySQL yang sebelumnya seharusnya sudah terinstall (Database MySQL sudah termasuk dalam paket Installasi XAMPP). Untuk membuat database, buka web browser baru kemudian buka URL sbb :

4 phpmyadmin maka akan tampil halaman seperti di bawah ini : untuk membuat database baru, isikan nama database. Misal : websmu kemudian klilk tombol Create. Setelah membuat database, kembali lagi ke halaman installasi Joomla kemudian isikan informasi informasi sebagai berikut : Database Type : MySQL Hostname : localhost Username : root passsword : (kosong. Tidak diisikan) Database Name : websmu (sesuai dengan nama database yang telah dibuat sebelumnya) Setelah mengisikan infomasi tersebut di atas dengan benar, klik Next untuk melanjutkan proses installasi

5 Gambar di atas adalah konfiguasi FTP. Konfigurasi ini tidak perlu di rubah. Klik next untuk melanjutkan installasi. Halaman di atas adalah konfigurasi utama website. Ada beberapa informasi penting yang harus diisi. Site Name Site name adalah nama website yang akan kita buat. Misal : Situs Resmi SMK Negeri 3 Mataram Your address yang akan menjadi penanggung jawab website tersebut (webmaster). Segala informasi yang berkaitan dengan perubahan, installasi dan sebagainya akan

6 dikirimkan ke emial ini. Misal : firman@inixindojogja.com. Admin Password Password administrator yang akan ditanyakan ketika akan melakukan administrasi website. Gunakan password yang mudah diingat tapi tidak mudah ditebak oleh orang lain. Misal : s3cret, LoV3@d#151ght, dan seterusnya. Password yang baik adalah terdiri dari minimal 6 karakter, terdiri dari huruf besar dan huruf kecil dan angka serta karakter asterik. Jangan gunakan nama panggilan, tanggal lahir, nama istri, nama pacar dst. Confirm Admin Password : Konfirmasi password yang telah diisikan sebelumnya. Untuk memastikan password yang akan digunakan. Jangan lupa untuk mengklik tombol Install Sample Data. Kemudian klik tombol next untu melanjutkan Jika tampil halaman seperti di atas, artinya proses installasi Joomla! Sudah berhasil. Sebagai langkah terakhir adalah kita harus menghapus atau merename direktori installastion yang berada di dalam direktori yang telah kita extract sebelumnya. Untuk melihat hasilnya, klik tombol Site. Jika tidak ada yang salah, maka akan tampil halaman seperti di bawah ini :

7 Joomla terdiri dari 2 bagian. Bagian pertama adalah untuk pengunjung. Dimana semua orang dapat melihat konten yang disediakan. Sedangkan bagian yang lain adalah bagian adminstrator. Dimana di bagian ini tidak semua orang bisa masuk. Bagian administrator adalah bagaian dimana semua content, tampilan, dan semua yang ditampilkan pada halaman user, diatur. Untuk masuk ke halaman administrator dapat dilakukan dengan membuka webbrowser baru kemudian membuka URL sebagai berikut : atau dengan menggunakan link yang ada pada halaman depan. Isikan username dengan admin dan password sesuai dengan password administrator pada

8 proses installasi kemudian klik Login akan tampil halaman seperti di bawah ini : Halaman di atas adalah halaman depan untuk administrator. Dari sinilah administrator dapat melakukan administrasi website. 3. Management Content Content di joomla dikelompokkan menjadi beberapa kelompok section dan category. Dimana dalam sebuah section terdiri dari beberapa category dan content haruslah diikutkan dalam salah satu kategory. Berikut ini adalah ilustrasi yang menggambarkan hirarki section, kategory dan content items. Sections Cagegory Content items Content items Category Category Content items Membuat Sections Untuk membuat section baru dapat dilakukan melalui menu Content > Section Manager

9 Halaman di atas adalah section manager dimana section dapat diatur. Baik itu penambahan baru, penghapusan section, edit, delete, publish ataupun unpublish. Untuk membuat section baru, klik icon New. Akan tampil halaman seperti di bawah ini : Isikan Title dengan nama section.misal : Prodi. Isikan alias sama dengan title atau dikosongkan saja. Pastikan Published pada posisi Yes. Kemudian Access Level pilih Public. Untuk menyimpan, klik tombol Save atau untuk menyimpan dan melanjutkan pengeditan klik Apply Membuat Category Untuk membuat category baru, dapat dilakukan menggunakan menu Contents > Category Manager.

10 Klik icon New untuk membuat category baru. Akan tampil halaman seperti di bawah ini : Isikan Title dengan nama kategori yang diinginkan. Misal : Elektronika Komunikasi. Alias dapat juga diisi sama dengan Title atau dikosongkan saja. Pastikan Published dipilih Yes. Pada bagian Sections pilih section yang baru saja dibuat. Misal : Prodi. Klik Save untuk menyimpan atau Apply untuk menyimpan dan melanjutkan pengeditan. Buatlah beberapa kategory lagi dengan cara yang sama. Membuat Content. Content adalah tulisan atau artikel yang menjelaskan tetang sesuatu. Baik itu berita, profil dan sebagainya. Untuk membuat content baru, dapat dilakukan melalui menu Content > Article Manager. Untuk membuat artikel baru, klik New maka akan tampil halaman seperti di bawah ini :

11 Isikan Title dengan judul artikel. Alias adalah judul alternatif. Boleh diisikan sama tapi bisa juga dikosongkan. Pilih section prodi dan category yang diinginkan. Kemudian buatkan berita pada teks editor yang telah disediakan. Untuk membuat artikel ditampilkan sebagian, dan akan muncul link readmore untuk melihat selengkapnya, letakkan cursor pada teks yang akan dipisah. Kemudian klik tombol Readmore pada bagian bawah editor. Untuk menyimpan artikel, klik Save atau klik Apply untuk menyimpan dan melanjutkan penulisan artikel 4. Management Menu. CMS memang didisain full costumizable termasuk menu. Menu menu yang sudah ada adalah contoh contoh menu yang disediakan ketika pertama kali Joomla! Di install. Menu menu tersebut dapat di tambahkan, dapat ditampilkan / dihilangkan. Pada saat awal instalasi, joomla terdiri dari beberapa kelompok menu. Top menu Menu bagian atas yang terletak di bagian atas halaman Main Menu Menu Utama yang adal di sebelah kiri halaman Other Menu Menu tambahan User Menu Menu yang hanya tampil ketika user login.

12 Resource Menu Menu Tambahan Key Concept Menu Tambahan. Setiap kelompok menu adalah sebuah modul. Dimana sebuah modul dapat diaktifkan, dan di non aktifkan dan bahkan bisa dihapus serta bisa juga untuk ditambahkan. Untuk menambahkan kelompok menu baru, dapat dilakukan melalui menu Menus > Menu Manager. Untuk membuat menu baru, klik New, kemudian akan tampil halaman seperti di bawah ini : Isikan Unique Name dengan nama menu misal Program Studi.Isikan Title dengan judul menu. Title ini akan tampil di halaman sebagai judul kelompok menu. Description menjelaskan tentang menu atau keterangan singkat. Isikan sesuai dengan deskripsi menu. Module title adalah nama modul. Ingat setiap kelompok menu adalah module. Klik Save untuk menyimpan.

13 Mengaktifkan menu Setelah membuat kelompok menu, menu tersebut tidak langsung akan ditampilkan di halaman. Karena statusnya masih Disable. Untuk mengubah statusnya menjadi Enable, haruslah diaktifkan terlebih dahulu melalui menu Extension > Module Manager. Maka akan tampil halaman sbb : Untuk mengaktifkan, klik pada Item Program Studi untuk mengedit modul tersebut. Maka akan tampil halaman seperti di bawah ini : Pilih Yes pada pilihan Enabled. Untuk membuat tampilan menu sesuai dengan menu yang sudah ada pada bagian Advanced Parameter isikan _menu pada kolom isian Module Class Suffix. Klik Save untuk menyimpan. Menambahkan Menu Item Setelah membuat kelompok menu, berikutnya adalah menambahkan menu item yang nantinya akan menampilkan artikel yang ada dalam salah satu kategory ataupun section. Untuk membuat menu items, dari menu Menus > Program Studi. Maka akan tampil halaman seperti di bawah ini :

14 Klik New untuk membuat menu Item baru. Maka akan tampil halaman seperti di bawah ini : Menu item yang dibuat adalah menu yang akan menampilakan blog aratikel sebuah kategori. Pada pilihan Select Menu Item Type. Klik Article > Category Blog Layout. Kemudian akan tampil halaman yang akan menampilkan pilihan category. Pilih kategori pada Kolom pilihan Category. Kemudian Isikan judul Menu pada kolom isian Title Misal : Elektronika Komunikasi. Klik Save untuk menyimpan.

15 5. Installasi dan Modifikasi Template Joomla! Memungkinkan kita mengganti tampilan halaman depan website dengan mudah dan sangat cepat. Yang membuat lebih membahagiakan lagi adalah template untuk joomla! Tersedia banyak sekali di internet dan gratis. Pada saat installasi pertama kali, Joomla! Sudah menyediakan dua buah template. Untuk menambahkan template baru, dapat di download di situs yang menyediakan template. Misalnya siteground.com, joomlahack dan seterusnya. Untuk menginstall template baru, dari menu Extensions > Install/Uninstall kemudian akan tampil halaman seperti di bawah ini : Ada beberapa pilihan sumber installasi. Muladi dari file lokal yang sudah kita download sebelumnya ataupun yang sudah diextract di rekeltori, ataupun link dari internet. Untuk menginstall dari file lokal, klik browse, kemudian pilih file yang merupakan template joomla. Kemudian klik Upload File & Install. Jika Tampil pesan Install Template Success. Artinya prose installasi sudah berhasil. Untuk mengaktifkan template tersebut, dapat dilakukan melalui menu Extensions > Template Manager akan tampil halaman seperti di bawah ini : Untuk memilih template yang akan digunakan, klik radio button pada nama template yang baru di install, kemudian klik icon Default. Untuk melihat hasilnya silahkan refresh halaman depan.

16 6. Upload Joomla! Ke Internet Ada beberapa langkah yang harus dilakukan untuk mengupload file ke server hosting di internet. 1. Backup Database. Untuk membackup database, dapat dilakukan dengan menggunkaan program phpmyadmin. Untuk membuka program phpmyadmin, dapat dilakukan dengan cara membuka web browser(internet explorer, Mozilla Firefox, dll) dengan alamat URL sbb : Pilih database sesuai dengan nama database yang telah dibuat pada saat installasi joomla!. Kemudian klik export kemudian akan tampil halaman seperti di bawah ini :

17 Klik select all dan pastikan Pilihan SQL di Klik Berita tanda Centang pada Save As File kemudian klik Go. Kita akan diminta untuk menyimpan sebuah file. Silahkan simpan file tersebut. 2. Kompres direktori Joomla! Sebelum mengupload, terlebih dahulu, folder joomla yang sudah kita buat sedemikian rupa, kita kompres. Ini berfungsi untuk mempermudah proses upload dan meningkatkan kecepatannya. Klik kanan pada folder yang akan dikompres (Biasanya, jika menggunakan program XAMPP, ada di C:\Program Files\xampp\htdocs) kemudian pilih Send To Compressed (zipped) folder). dapat juga dilakukan menggunakan Winzip ataupun program lain,

18 Hasil dari proses compress tadi akan menghasilkan sebuah file baru dengan nama sesuai dengan nama folder berekstensi zip. Missal : joomla.zip 3. Login ke CPANEL dan upload File Ketika proses pendaftaran hosting berhasil, seharusnya kita mendapatkan infrmasi tentang username dan password CPANEL. Untuk login ke CPANEL dapat dilakukan dengan membuka webbrowser kemudian masuk ke URL sbb : misalkan punya saya adalah Maka kita akan dihadapkan dengan formulir Login yang menanyakan username dan password. Ingat! username dan password ada di yang dikirimkan oleh webhosting tempat kita mendaftar. Isikan username dan password

19 Berikut Ini adalah tampilan CPANEL untuk mengupload file, Klik Icon dengan nama File Manager setelah itu, akan dibukakan window baru untuk file manager. Tampilannya seperti windows

20 Explorer jadi mungkin anda akan lebih mudah untuk menggunakan. Klik direktori Home www file yang akan diupload akan disimpan di directory tersebut yaitu WWW kemudian klik icon Upload Pastikan tujuan upload adalah /home/<namauser>/www kemudian klik browse untuk memilih file yang akan diupload. File yang akan diupload adalah file hasil compress yang telah kita lakukan sebelumnya.

21 jika tampil halaman seperti di atas, artinya proses upload sedang berlangsung. Tunggu sampai selesai. Setelah 100% Complete, Klik Back to /home/<namauser> Maka kita akan kembali ke halaman file manager 4. Extract File dan memindahkan ke direktori WWW Klik Icon File Joomla.zip kemudian untuk melakukan extract, klik icon dengan nama Extract Akan muncul dialog seperti di bawah ini dan klik Extract File(s)

22 setelah proses extract berhasil, akan muncul sebuah direktori baru dengan nama sesuai dengan nama file yang kita extract sebelumnya. masuk ke direktori tersebut dengan cara men double klik direktori tersebut sehingga tampilannya akan seperti di bawah ini : langkah selanjutnya adalah memindahkan file-file tersebut ke dalam direktori www. Saat ini file-tersebut berada di dalam folder /www/joomla. Untuk memindahkan ke /www klik Select All kemudian klik Drag file dan folder yang telah di select tadi ke direktori www yang ada di sebelah kiri :

23 Drag and Drop seperti menggunakan windows explorer 5. Membuat Database MySQL, Membuat User Database dan Restore Database Kembali ke halaman depan CPANEL.Klik pada kelompok Databases Klik Icon MySQL Databases langkah berikutnya adalah membuat database baru. Masukkan nama database pada kolom isian seperti gambar di bawah ini : setelah membuat database, maka hasilnya seperti di bawah ini. Nama database secara otomatis akan ditambahkan dengan prefix nama user. Cotoh di atas, membuat database dengan nama web, maka jadinya adalah firmani_web.

24 langkah selanjutnya adalah membuat user database. Isikan username, sesuai dengan keinginan, isikan password dan ulangi dengan password yang sama pada isian Password(Again) kemudian klik Create User setelah membuat user, langkah selanjutnya adalah menambahkan user untuk database. Jika pembuatan user dan database telah selesai, maka otomatis listnya akan ada di dialog seperti di atas.klik Add untuk menambahkan user untuk database. Langkah berikutnya adalah memberikan hak akses database untuk user. Beri tanda centang pada ALL PRIVILEGES. Kemudian klik Make Changes

25 Langkah selanjutnya adalah merestore database. Untuk merestore database, dapat dilakukan dengan menggunakan phpmyadmin. PERHATIAN : phpmyadmin yang akan digunakan bukanlah phpmyadmin yang di localhost. Melainkan phpmyadmin yang telah sediakan oleh hosting. Untuk mengakses phpmyadmin, dapat dilakukan dengan mengklik icon phpmyadmin pada halaman depan cpanel kemudian akan terbuka halaman baru dengan tampilan phpmyadmin. Untuk melakukan restore database, pilih nama database, kemudian klik import

26 kemudian akan tampil halaman seperti di bawah ini : Klik browse kemudian pilih file hasil backup yang telah kita lakukan sebelumnya. Kemudian klik GO.

27 6. Mengubah konfigurasi database joomla. Masuk ke file manager, kemudian masuk ke direktori www, kemudian pilih file configuration.phpkemudian klik icon Code Editor. ganti pada bagian : var $user = firmani_webuser ; var $password = bukanrahasia ; var $db = firmani_web sesuaikan dengan database, username, dan password yang telah dibuat sebelumnya. Kemudian Klik Save Changes jika tidak ada yang salah, silahkan lihat hasilnya. Misal ::

28 Artikel ini juga dapat di download di Tidak dilarang keras untuk mengcopy atau memperbanyak isi materi ini. Hak cipta atas ilmu pengetahuan hanya milik Tuhan yang maha kuasa (Allah SWT)