modul joomla lp3i (session v & vi)

Session I & II

Written by : Naraya Telematika

Mempercantik Tampilan pada Situs JoomlaSeperti yang telah dijelaskan sebelumnya pada bab awal pengenalan joomla, bahwa joomla merupakan salah satu CMS yang menawarkan kemudahan bagi para designer untuk mempercantik situsnya. Joomla Menyediakan berbagai macam template yang dapat di unduh secara gratis maupun berbayar. Dan kitapun dapat mempercantik kembali template yang sudah kita unduh. Joomla juga menyediakan fitur-fitur berbentuk module ataupun component, untuk menambah fitur dalam situs anda. Pada bab ini kami akan menerangkan cara mempercantik template dengan joomla. I. Menginstal dan Mempercantik Template Pada awal Instalasi Joomla, Joomla telah menyediakan 3 pilihan template untuk situs anda yaitu : Beez, JA_Purity dan Rhuk_milkyway. Sedangkan untuk admin joomla telah menyediakan template Khepri untuk tampilannya. Template-template yang telah disediakan joomla ini masih sangat sederhana, jika anda menginginkan untuk mencari template yang sesuai joomla telah menyediakan berbagai macam template yang dapat di unduh. Anda dapat mengunduh template di situs www.joomla24.com, www.siteground.com/joomlatemplates.htm, http://joomlatp.com/, http://joomlathemes.co/, dan masih banyak lainnya. 1.1. Menginstall Template 1. Setelah anda mengunduh template, masuk ke halaman administrator Extensions > Install/Uninstall untuk menginstall template 2. Setelah berada pada halaman Install/Uninstall, Klik Tombol Browse pada Upload Package File untuk mencari template yang akan di install

Klik Open

Copyright 2011 |Naratel Software Dev. Division

2

3. Setelah open klik Start upload untuk mengupload file, jika file berhasil di upload maka aka nada peringatan bahwa File Upload Sukses

KLik Start Upload

4. Aktifkan Template yang telah di install melalui Extensions > Template manager Centang Check Box pada Template lalu klik Default

Klik Default

5. Maka situs anda telah memiliki Tampilan Template yang baru


3

1.2. Mengubah Bagian-bagian Template Sekarang anda telah memiliki tampilan website baru, tapi tampilan anda masih seperti default Background belakang Nama situs

Kotak menu

Mengganti Nama Situs 1. Untuk Mengganti nama Situs anda harus mengubahnya pada folder situs anda misalnya : xampp/htdocs/nama situs/template/nama folder template(siteground-j15-84)/index.php. Pada index.php anda akan menemukan code untuk nama situs seperti ;


4

Kode nama situs

2. Biasanya nama situs pada kode di tandai dengan adanya sitename 3. Hapus Kode tersebut jika tidak ingin menampilkan nama situs , atau mengubahnya Mengganti bagian-bagian Pada situs 1. Buat header sesuai ukuran header pada situs, beri nama header baru anda seperti nama header yang dulu 2. Apabila sudah Replace Header situs yang berada pada xampp/htdocs/nama situs/template/nama folder template(siteground-j15-84)/image 3. Untuk mengganti warna background atas, anda harus membuat Background yang ukurannya sesuai dengan background asli. Dan Replace pada Folder situs xampp/htdocs/nama situs/template/nama folder template(siteground-j1584)/image 4. Begitupun juga dengan kotak menu, anda harus membuat kotak menu yang ukurannya sesuai dengan kotak menu asli. Dan Replace pada Folder situs xampp/htdocs/nama situs/template/nama folder template(siteground-j1584)/image Mengganti Copyright 1. Untuk Mengganti nama Copyright anda harus mengubahnya pada folder situs anda misalnya : xampp/htdocs/nama situs/template/nama folder template(siteground-j15-84)/index.php. Pada index.php anda akan menemukan code untuk Copyright seperti ;


5

2. Biasanya Copyright pada situs berada pada bagian footer 3. Hapus Kode tersebut jika tidak ingin menampilkan nama situs , atau mengubahnya. II. Menambah Fitur untuk Situs Anda Jika anda menginginkan agar tampilan situs anda tidak monoton anda dapat menambahkan fitur-fitur seperti video, galeri foto, Agenda, Repository. Anda dapat mengunduh file extension joomla pada http://extensions.joomla.org/extensions. Pada bab ini kami akan membahsa tambahan fitur-fitur untuk situs anda 2.1. Menambah Video pada Situs Joomla telah menyediakan Komponen untuk menambah Video anda dapat memilih Component HDV FLV Video Cara menambah Video 1. Download Video HDV FLV Video http://extensions.joomla.org/extensions/multimedia/multimedia-players/videoplayers-a-gallery/10149. 2. Install pada Menu Extensions > Install / Uninstall (caranya seperti menginstall template) 3. Setelah Install Selesai maka akan muncul peringatan bahwa component Video berhasil di Install dan anda akan langsung masuk pada halaman konfigurasi Component Video

Menu Toolbar

4. Untuk membuat menu Gallery Video masuk dalam halaman Administrator > Top Menu (Jika ingin menampilkan pada top menu) / Main Menu (Jika ingin menampilkan di main menu) 5. Lalu Klik New dan Pilih Category HDV FLV Player, lalu beri Nama Untuk menu Gallery Video 6. Untuk Mengelola video pada situs, anda dapat masuk dalam halaman Component > HDV FLV Player Berikut ini adalah Toolbar Untuk Konfigurasi Video

Publish : Untuk Menampilkan Video Copyright 2011 |Naratel Software Dev. Division 6

Unpublish : Untuk Menyembunyikan Video Delete : Menghapus Video

Edit : Mengubah Konfigurasi Video New Video : Membuat atau Menambah Video Baru

Default Viewed Reset

Menambah Video : 1. Klik Toolbar New Video 2. Klik Tombol Browse pada upload video 3. Setelah Video telah terbuka, Isi form untuk konfigurasi video - Title - Description - Target Url - Display Playlist - Access - Order - Postroll ads - Preroll ads - Download - Published 4. Lalu klik Toolbar save 5. Maka Video anda telah masuk dalam Gallery Video


7

Tombol Browse

2.2. Menambah Gallery Foto Joomla juga menyediakan fitur untuk slide foto dan gallery foto, contohnya : DJ Image Slider dan JW Image Rotator Konfigurasi DJ Image Slider DJ Image Slider Merupakan Sebuah Component dan Module. Component DJ Image Slider digunakan hanya untuk memasukkan foto, Sedangkan Module DJ Image Slider digunakan untuk pengaturan.

1. Download DJ Image Slider http://www.design-joomla.eu/downloads/dj-imageslider.html . 2. Install pada Menu Extensions > Install / Uninstall (caranya seperti menginstall template)


8

3. Untuk menampilkan Gallery Foto Enable-kan Module DJ Image Slider pada Module Manager 4. Untuk menambah foto masuk ke dalam halaman Administrator > Component > DJ Image Slider

5. Ada 2 menu dalam konfigurasi Component yaitu Slide : Berisi file foto Category : Kategory dari setiap Foto pada Slide 6. Untuk Menambah Foto Klik Toolbar New pada Menu Slide 7. Isi form untuk menambah foto - Title : Untuk judul foto - Alias : Untuk nama alias - Published : Untuk menampilkan atau menyembunyikan

- Image : untuk mengupload gambar atau foto - Description : Untuk Deskripsi/keterangan foto 8. Lalu klik Toolbar Save 9. Untuk Pengaturan Module masuk dalam Extensions > Module Manager > DJ Image Slider


9

10.Pengaturan DJ Image Slider Detail - Title : Untuk Judul - Position : Untuk letak module - Order : Untuk urutan letak module Module Parameter - Slider source : Memilih apakah gambar yang ditampilkan diambil dari folder atau dari DJ Image Slider Component - Slider type : Memilih tampilan gambar Folder As A Source Settings (settingan apabila gambar diambil dari folder) - Image Folder : Nama folder untuk image - Link : Link untuk image Component As A Source Settings - Slides category : Kategori dari DJ Image Slider yang akan di tampilkan - Show Title : Menampilkan atau menyembunyikan nama gambar - Show description : Menampilkan atau menyembunyikan deskripsi gambar - Show readmore : Menampilkan atau menyembunyikan Readmore - Link title : Link untuk nama gambar Copyright 2011 |Naratel Software Dev. Division 10

- Link description : Link untuk Descripsi - Description limit : Batasan karakter untuk deskripsi gambar Basic Slider Settings : - Slide Width : Lebar Slide - Slide Height : Panjang Slide - Fit a size of image to : Menyesuaikan ukuran gambar - Visible Images : Gambar yang di tampilkan setiap slide - Space between images : Jarak antar gambar - Max images : Banyak gambar - Sort by : Urutan gambar berdasarkan - Slide effect : Efek slide - Autoplay : Memilih apakah slide secara otomatis bergerak atau tidak - Show play/pause : Menampilkan tombol Play/Pause - Show next/prev : Menampilkan tombol Next/Prev - Show custom navigation : Menampilkan Costum Navigation atau tidak 11. Lalu klik Save 2.3. Menambah Menu Download Joomla Menyediakan Component untuk menu download yaitu Component Remository

Konfigurasi Remository 1. Download Component Remository http://remository.com/downloads/softwarephp5/joomla-1.5software/remository-components/ . 2. Install pada Menu Extensions > Install / Uninstall (caranya seperti menginstall template) 3. Untuk membuat menu Download masuk dalam halaman Administrator > Top Menu (Jika ingin menampilkan pada top menu) / Main Menu (Jika ingin menampilkan di main menu) Copyright 2011 |Naratel Software Dev. Division 11

4. Lalu Klik New dan Pilih Category Remository, lalu beri Nama Untuk menu Download 5. Masuk Kedalam halaman Administrator Component > Remository 6. Untuk menambah category baru baru atau mengubah klik pada toolbar manage container Untuk menambah klik toolbar Add Untuk mengubah klik pada judul artikel 7. Isi form untuk membuat kategori baru, atau mengubah form untuk mengubah kategori 8. Isi nama Folder, Alias, Deskripsi, pilih Icon dan Centang Check box pada Publishing

9. Lalu Klik Toolbar Save 10.Untuk menambah file pada kategory masuk kedalam control panel Remository > Manage File


12

11.Klik toolbar Add untuk menambah kategory

12.Lalu isi form untuk menambah file baru Pilih Suggest Location (kategori) Isi nama File Title (judul/nama file) Isi File version Pilih Icon file Centang Check Box Publishing Browse atau upload file pada Physical File


13

2.4. Menambah Fitur Buku Tamu (Guest Book) Fitur Guest Book Ini digunakan agar pengunjung dapat memeberi komentar mengenai website.

Konfigurasi Guest Book 1. Download Component Easy Book http://joomla-extensions.kubik-rubik.de/category/download 2. Untuk membuat menu Guest Book masuk dalam halaman Administrator > Top Menu (Jika ingin menampilkan pada top menu) / Main Menu (Jika ingin menampilkan di main menu) 3. Lalu klik new pilih categotry Easy Book Reloaded, Lalu Beri nama Untuk menu guestbook 4. Untuk mengelola Guestbook Masuk kedalam Halaman Administrator Component > Guest Book > Settings o Global Configuration Guest Book Menampilkan komentar pada website dengan persetujuan Admin maka klik Check box No pada Publish New Entries , dan sebaliknya untuk menampilkan pada website tanpa persetujuan admin maka klik Check box YES pada Publish New Entries Untuk menampilkan field apa saja yang terdapat pada form guest book (untuk menampilkan klik check box SHOW, dan untuk menyembunyikan klik check box HIDE) - Show rating field : Menampilkan Field Untuk Rating - Show a hint for rating : Menampilkan field petunjuk Rating - IP Logging : Menampilkan Fiel IP address - Show e-mail field : Menampilkan Field E-mail - Show location field :Menampilkan Field Lokasi pengunjung Copyright 2011 |Naratel Software Dev. Division 14

- Show web site field : Menampilkan field situs pengunjung - Show ICQ field : Menampilkan field alamat ICQ - Show AIM field : Menampilkan field alamat AIM - Show MSN field : Menampilkan field alamat MSN - Show Yahoo field : Menampilkan field alamat Yahoo - Show Skype field : Menampilkan field alamat Skype 5. Lalu Klik Save


15

2.5. Menambah Fitur Agenda Jika anda menginginkan situs anda mempunyai kalender agenda kegiatan maka joomla menyediakan component untuk Agenda kegiatan salah satumya JEvents.

Konfigurasi JEvents 1. Download JEvents http://www.jevents.net/jevents http://www.jevents.net/jevents-download 2. Install pada Menu Extensions > Install / Uninstall (caranya seperti menginstall template) 3. Untuk membuat menu Agenda masuk dalam halaman Administrator > Top Menu (Jika ingin menampilkan pada top menu) / Main Menu (Jika ingin menampilkan di a main menu) 4. Lalu Klik New dan Pilih Category Jevents > Monthly Calender, lalu beri Nama Untuk menu Agenda 5. Masuk kedalam Halaman Administrator Component > JEvent


16

6. Untuk membuat kategori agenda Klik pada menu Manage Category

7. Klik Toolbar New Untuk Membuat Category Baru 8. Isi Form Untuk Membuat kategory baru a. Title : Nama kategori b. Color : Warna Untuk kategori c. Description : Deskripsi kategori

9. Lau Klik Save 10.Untuk menambah Agenda Klik Manage Events pada Control Panel 11.Lalu Klik Toolbar Add


17

12.Isi Form Untuk membuat Agenda baru a. Subject : Subjek Agenda b. Select Category : Kategori Agenda c. Activity : Aktivitas yang dilakukan d. Location : Lokasi e. Contact : Kontak yang dapat dihubungi

13.Lalu Masuk kedalam halaman Calender a. Start Date : Tanggal Agenda Dimulai b. End Date : Tanggal Agenda Diakhiri

14.Lalu Klik Save


18

2.6. Scroll Bar Text Jika Artikel anda terlalu panjang, anda dapat mengunakan scroll Bar text agar tampilan di situs anda terlihat lebuh rapid an menarik 1. Cara mengunakan Scroll Bar text 2. Saat anda membuat artikel baru, pada field artikel klik HTML icon

3. Lalu Tuliskan Pada awal paragraph

4. Lalu Klik Tombol Update, setelah itu save artikel


19

modul joomla lp3i (session v & vi)

Documents