Академический Документы
Профессиональный Документы
Культура Документы
Vol
LUCKY PERMANA
author
published by
EbookJoomla2012 www.Facebook.com/Tutor.Joomla info@EbookJoomla.com
page
diperkenankan menyebarluaskan serial EbookJoomla ini tanpa ijin dari penerbit/penulis. diperkenankan mengutip sebagian atau seluruh isi serial EbookJoomla ini dengan menyebutkan sumbernya.
Daftar isi
Daftar isi ..................................................................................... i Tentang penulis ..........................................................................ii Rencanakan dulu website Anda ................................................ 1 Memahami lebih jauh skema perencanaan website ................. 3
Halaman Publik ............................................................................... 3 Halaman User ................................................................................. 4
Menambahkan kategori artikel .................................................. 7 Menambahkan artikel .............................................................. 11 Menambahkan kategori Direktori Website .............................. 15 Membuat Direktori Website ..................................................... 17 Menambahkan Contact ........................................................... 21
Menambahkan kategori Contact ................................................... 21 Menambahkan data Contact ......................................................... 22
Membuat Menu User ............................................................... 25 Menambahkan item-menu pada Menu Utama & Menu User .. 27
Item-menu pada Menu Utama ...................................................... 27 Item-menu pada Menu User ......................................................... 32
Bacaan Joomla........................................................................ 51
Tentang penulis
Lahir di Kudus pada 1 September 1971, Lucky Permana menjalani pendidikan dasarnya di beberapa kota di Papua (Irian Jaya waktu itu) yaitu Manokwari, Sentani, Serui, dan Jayapura sebelum akhirnya menyelesaikan pendidikan menengahnya di Jakarta. Pendidikan lanjutnya di Akademi Ilmu Statistik (AIS) yang diselesaikan pada 1994, dan Sekolah Tinggi Ilmu Statistik (STIS) jurusan Komputasi Statistik yang diselesaikan pada 1999, menghantarkannya bekerja di Badan Pusat Statistik (BPS) tepatnya di Provinsi Jawa Timur hingga saat ini. Berbagai pengalaman praktis dalam bidang Komputer dan Internet, mendorong Lucky Permana menuliskannya di www.Cangkruk.com. Lucky juga menuangkan pengetahuan dan pengalaman praktisnya itu dalam bentuk buku dan artikel di media komputer. Buku berjudul Mengelola Website Joomla 1.7 dengan 70 Ekstensi Terpopuler adalah bukunya yang keempat, setelah sebelumnya terbit buku pertama berjudul Panduan Lengkap Website Dinamis Joomla! disusul buku kedua berjudul 20 Harta Karun Google. kemudahan dan keunggulannya begitu menggoda, dan buku ketiga berjudul Membuat Website Profesional dengan BlogSpot. Sedangkan artikel komputer yang pernah ditulisnya dan dimuat di Majalah Mikrodata media penggemar komputer adalah Membuat Komponen Hotspot dan Membuat Image Map. Pembaca yang ingin berkorespondensi dengan penulis, dapat melakukannya dengan mengirim email ke luckypermana@cangkruk.com atau melalui contact form di www.cangkruk.com. Sedangkan untuk saling bertukar informasi seputar Joomla, silahkan bergabung di halaman www.facebook.com/tutor.joomla.
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
1
Notes
embaca serial ebookjoomla berjudul "Menggunakan Joomla 2.5 di PC/Laptop", pastinya sudah mengerti apa saja yang diperlukan dan bagaimana cara meng-install Joomla di PC/Laptop. Pembaca juga sudah mengenal backend Joomla, bagaimana mengaksesnya, dan mengenal fitur apa saja yang tersedia untuk mulai membuat dan mengelola website. Meskipun demikian, sebelum mulai membuat apalagi mengelola website Joomla, perlu direncanakan terlebih dahulu website seperti apa yang akan dibangun. Mari kita mulai merencanakan dengan menjawab beberapa pertanyaan ini: WHAT: Website seperti apa yang ingin dibangun? apakah personal profile? atau company profile? atau bisnis? atau komunitas? atau social network? atau lainnya? misal jawabannya adalah: Melalui website, Saya ingin orang mengenal Saya sebagai penulis buku teknologi informasi, dan mengetahui karya-karya Saya. Saya juga ingin berbagi pengetahuan dan pengalaman dengan menuliskannya dalam bentuk artikel. Sayapun ingin memberi kesempatan kepada mereka yang ingin berbagi pengetahuan dan pengalaman dengan menuliskannya di website yang Saya bangun. WHO: Siapa yang diharapkan menjadi target pengunjungnya? misal jawabannya adalah: Semua peminat teknologi informasi, baik pembaca ataupun mereka yang ingin berperan serta menulis artikel teknologi informasi di website Saya. HOW: Bagaimana informasi ditampilkan? misal jawabannya adalah: Saya ingin menampilkan informasi profil Saya, biodata/CV, karya-karya, direktori website yang dikirim oleh para user, dan menyediakan Form Contact untuk mengirim email ke Saya. Saya juga ingin
1
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
menampilkan artikel tulisan. Saya ingin menyediakan Form Login dan halaman khusus pengguna yang diberi hak untuk mengirim artikel dan mengirim informasi link ke website lainnya yang bermanfaat. Satu lagi, Saya ingin mengelola website Saya secara dinamis dengan menggunakan teknologi Content Management System (CMS). Berdasarkan jawaban dari tiga pertanyaan di atas pembaca sudah dapat membuat skema perencanaan website, kira-kira seperti berikut: Halaman Publik Menu Utama Profil Saya Biodata/CV Karya Saya Artikel Komputer Direktori Website Contact Form Login
Halaman User
Menu User Profil User Kirim Artikel Kirim Weblink Langkah perencanaan di atas hanyalah satu cara untuk menyusun rencana website yang akan dibangun. Apabila pembaca memiliki langkah sendiri dalam merencanakan website, silahkan saja diterapkan... yang perlu digarisbawahi disini adalah, RENCANAKAN DULU WEBSITE ANDA sebelum mulai membangunnya.
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
2
Notes
embaca telah membuat skema perencanaan website, dan tentunya berpikir bahwa sekaranglah saatnya untuk mempersiapkan dan menampilkan halaman web. Pemikiran itu ada benarnya, tetapi sebelum mulai, ada baiknya memahami terlebih dahulu 'halaman web' seperti apa yang akan disiapkan dan ditampilkan menggunakan Joomla. Mari perhatikan kembali skema perencanaan website pada Notes-1. Skema tersebut terdiri dari dua macam halaman web yaitu Halaman Publik dan Halaman User. Halaman Publik merupakan jenis halaman web yang disiapkan untuk dapat diakses oleh siapapun pengunjung website, sedangkan Halaman User merupakan jenis halaman web yang hanya dapat diakses oleh pengunjung yang telah terdaftar sebagai user.
Halaman Publik
Secara umum, jenis Halaman Publik ini terdiri dari dua macam fitur yaitu fiturfitur di dalam Menu Utama, dan Form Login. Fitur-fitur di dalam Menu Utama disiapkan untuk menampilkan halaman web berupa informasi berjenis artikel (Profil Saya, Biodata/CV, Karya Saya, dan Artikel Komputer), Direktori Website untuk menampilkan informasi link website yang dikirim oleh user, serta Form Contact untuk mengirim email. Fitur Form Login disiapkan bagi pengunjung untuk masuk ke dalam Halaman User. Lebih jauh lagi, Pembaca perhatikan, informasi berjenis artikel dapat dikelompokkan ke dalam dua kategori yaitu kategori [About Me] untuk tulisantulisan mengenai informasi pribadi (Profil Saya, Biodata/CV, Karya Saya) dan kategori [Artikel Komputer] untuk tulisan-tulisan mengenai komputer.
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Lebih jelasnya, skema HALAMAN PUBLIK yang akan pembaca siapkan nantinya adalah seperti berikut ini: {Main Menu} Menu Utama {menu untuk menampilkan fitur-fitur utama di halaman publik} { kategori [About Me] } Profil Saya {item-menu untuk menampilkan artikel mengenai profil pemilik web} Biodata/CV {item-menu untuk menampilkan artikel mengenai biodata/cv pemilik web} Karya Saya {item-menu untuk menampilkan artikel mengenai hasil karya pemilik web} { kategori [Artikel Komputer] } Artikel Komputer {item-menu untuk menampilkan artikel komputer dari pemilik web dan user} {Weblink} Direktori Website {item-menu untuk menampilkan direktori website yang dikirim oleh user} {Contact Form} Contact {item-menu untuk menampilkan form mengirim email} {Login Form} Form Login {form untuk masuk ke Halaman User}
Halaman User
Halaman User disiapkan untuk pengunjung yang telah terdaftar sebagai user di website Joomla. Fitur-fitur di halaman ini tersedia pada Menu User, sesuai skema perencanaan website, yaitu Profil User, Kirim Artikel, dan Kirim Weblink. Fitur Profil User untuk menampilkan dan mengubah informasi user. Fitur Kirim Artikel untuk menulis dan mengirimkan artikel. Fitur Kirim Weblink untuk mengirim informasi berupa link ke website tertentu. Lebih jelasnya, skema HALAMAN USER yang akan pembaca siapkan nantinya adalah seperti berikut ini:
4
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
{User Menu} Menu User {menu untuk menampilkan fitur-fitur utama di halaman user} {user profile} Profil User {item-menu untuk menampilkan dan mengubah informasi profil user} {create article} Kirim Artikel {item-menu untuk menulis dan mengirim artikel} {submit a weblink} Kirim Weblink {item-menu untuk menulis dan mengirim link ke website tertentu} Pembaca perhatikan skema perencanaan website di atas, penjelasan bertanda kurung kurawal adalah yang nantinya akan disiapkan sesuai jenis fitur yang tersedia pada backend Joomla.
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3
Notes
kema perencanaan website sudah pembaca buat, sekarang saatnya mulai membangun website menggunakan Joomla. Secara berurut mulai dari Notes 3 ini sampai dengan Notes 11 ke depan, penulis akan berupaya menjelaskan cara membangun website sesuai dengan skema perencanaan website yang telah dibuat sebelumnya. Adapun topik pembahasan pada notes tersebut adalah seperti berikut ini: Notes-3. Menambahkan kategori artikel Notes-4. Menambahkan artikel Notes-5. Menambahkan kategori Direktori Website Notes-6. Menambahkan Direktori Website Notes-7. Menambahkan Contact Notes-8. Membuat Menu User Notes-9. Menambahkan item-menu pada Menu Utama dan Menu User Notes-10. Pengaturan module website Joomla Notes-11. Preview website Joomla Pada skema perencanaan website di Notes 1 dan Notes 2, pembaca mengelompokkan artikel di website Joomla ke dalam dua jenis kategori yaitu [About Me] yang disiapkan untuk tulisan-tulisan mengenai informasi pribadi (Profil Saya, Biodata/CV, Karya Saya) dan [Artikel Komputer] yang disiapkan untuk tulisan-tulisan mengenai komputer/teknologi informasi. Kedua jenis kategori tersebut dapat pembaca siapkan dengan memanfaatkan fitur [Category Manager] yang tersedia pada menu [Content] di dalam halaman backend Joomla. Adapun langkah-langkahnya adalah seperti penjelasan berikut: 1. Login ke dalam backend Joomla (halaman Administrator),
7
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
2. Klik menu [Content|Category Manager|Add New Category], atau klik menu [Content|Category Manager] dan lanjutkan klik New,
3. Pada halaman Category Manager: Add A New Articles Category, isikan nama kategori pada Title (yaitu: About Me) dan klik Save & Close untuk mengakhiri.
4. Lakukan langkah yang sama untuk menambahkan kategori artikel lainnya (yaitu: Artikel Komputer). Kategori-kategori yang Pembaca tambahkan di atas, akan tampil di halaman Category Manager: Articles seperti pada gambar di bawah ini.
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
10
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
4
Notes
Menambahkan artikel
artikel/tulisan pada kedua jenis kategori tersebut dapat Pembaca siapkan dengan memanfaatkan fitur [Article Manager] yang tersedia pada menu [Content]
embaca sudah membuat dua macam kategori artikel yaitu [About Me] dan [Artikel Komputer]. Sebagaimana skema perencanaan website yang telah disiapkan sebelumnya, tulisan/artikel mengenai informasi pribadi (Profil Saya, Biodata/CV, Karya Saya) akan disimpan pada kategori [About Me], sedangkan artikel/tulisan mengenai komputer/teknologi informasi yang dikirim oleh Pembaca dan/atau User yang diberi hak akan disimpan pada kategori [Artikel Komputer]. Sebagai Administrator, artikel/tulisan pada kedua jenis kategori tersebut dapat Pembaca siapkan dengan memanfaatkan fitur [Article Manager] yang tersedia pada menu [Content] di dalam halaman backend Joomla. Adapun langkahlangkahnya adalah seperti penjelasan berikut: 1. Login ke dalam backend Joomla (halaman Administrator), 2. Klik menu [Content|Article Manager|Add New Article], atau klik menu [Content|Article Manager] dan lanjutkan klik New,
11
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Pada halaman Article Manager: Add New Article, isikan judul artikel pada Title (misal: Profil Saya). Kemudian pada Category, pilih kategori artikel yang sesuai (pada contoh ini artikel Profil Saya masuk kategori [About Me]). 4. Selanjutnya pada Article Text, ketikkan isi artikel. Pembaca dapat juga menentukan format tulisan pada artikel sesuai fitur yang tersedia, diantaranya yaitu menebalkan huruf (Bold), memberi efek miring pada huruf (Italic), menggarisbawahi huruf/kata/kalimat (Underline), menengahkan tulisan (Center), dan lain sebagainya. 5. Akhiri dengan meng-klik Save & Close untuk menyimpan tulisan yang baru saja dibuat.
6. Lakukan langkah yang sama untuk menambahkan artikel-artikel lainnya, baik pada kategori [About Me] ataupun kategori [Artikel Komputer]. Artikel apa saja yang telah Pembaca tambahkan, akan terlihat di halaman Article Manager: Articles seperti pada gambar di bawah ini.
12
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Menambahkan artikel mengikuti langkah-langkah di atas hanya dapat dilakukan di halaman backend Joomla, oleh Anda sebagai Administrator website Joomla. Sedangkan User yang diberi hak untuk menulis artikel, dapat mengirimkannya melalui menu User yang akan Anda siapkan mengikuti penjelasan di Notes-8 dan Notes-9.
13
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
14
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
5
Notes
irektori Website merupakan salah satu item-menu pada Menu Utama. Sebelum mulai membuat item-menu Direktori Website tersebut, Pembaca perlu mempersiapkan terlebih dahulu website apa saja yang ingin ditampilkan pada Direktori Website.
Pada contoh di EbookJoomla ini, Direktori Website yang disiapkan tersebut akan dikelompokkan ke dalam beberapa kategori yang dibedakan menurut jenisnya yaitu: kategori [Pemrograman], [Pengembangan Web], dan [Tips & Tricks]. Pembaca dapat menambahkan kategori Direktori Website dengan memanfaatkan fitur [Weblinks] yang tersedia pada menu [Components] di dalam halaman backend Joomla. Adapun langkah-langkahnya adalah seperti berikut ini: 1. Login ke dalam backend Joomla (halaman Administrator), 2. Klik menu [Components|Weblinks|Categories] dan lanjutkan klik New,
15
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Isikan nama kategori Direktori Website pada Title, lalu akhiri dengan klik Save & Close.
4. Lakukan langkah yang sama untuk menambahkan kategori Direktori Website lainnya. Kategori-kategori Direktori Website yang telah Pembaca tambahkan, akan terlihat di halaman Category Manager: Weblinks seperti pada gambar di bawah ini.
16
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
6
Notes
irektori Website yang dimaksud disini merupakan kumpulan link ke alamat URL dari website yang menyajikan informasi terkait teknologi informasi.
Pembaca akan menambahkan link website sesuai kategori Direktori Website yang telah dibuat sebelumnya yaitu [Pemrograman], [Pengembangan Web], dan [Tips & Tricks]. Sebagai contoh, link website yang akan ditambahkan adalah seperti tersebut di bawah ini: [Pemrograman] PHP Scripting Language. http://php.net/manual/en/index.php Visual Basic Development us/vstudio/hh388568 Skills. http://msdn.microsoft.com/en-
[Pengembangan Web] Webmaster Resource Center. http://www.ilmuwebsite.com/ Tips dan Trik Komputer. http://www.tipstrikkomputer.com/ Tips n Trick. http://www.tipsntrick.net/ [Tips & Tricks]
Sebagai Administrator Joomla, Pembaca dapat menambahkan link website tersebut di atas dengan memanfaatkan fitur [Weblinks] yang tersedia pada menu [Components] di dalam halaman backend Joomla. Caranya adalah seperti berikut ini: 1. Login ke dalam backend Joomla (halaman Administrator), 2. Klik menu [Components|Weblinks|Links] dan lanjutkan dengan klik New,
17
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Kemudian pada halaman Web Links Manager: Web Link, isikan judul Website pada Title, isikan URL website pada URL, pilih kategori yang sesuai pada Category, dan akhiri dengan klik Save & Close.
4. Lakukan langkah yang sama untuk menambahkan link Website lainnya. Langkah-langkah membuat Direktori Website seperti dijelaskan di atas hanya dapat dilakukan di halaman backend Joomla oleh Anda sebagai Administrator website Joomla. Adapun User yang diberi hak mengirimkan link website untuk ditambahkan ke dalam Direktori Website, dapat melakukannya melalui Menu User yang akan disiapkan mengikuti penjelasan di Notes-8 dan Notes-9. Direktori Website yang telah dibuat mengikuti langkah-langkah di atas, akan tampil di halaman Web Links Manager: Web Links seperti pada gambar berikut ini.
18
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
19
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
20
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
7
Notes
Menambahkan Contact
Pembaca perlu membuat data Contact terlebih dahulu sebelum membuat halaman Contact, agar pesan dari pengunjung dapat terkirim ke alamat email yang ditentukan.
embaca tentunya pernah menemukan sebuah website yang menyediakan halaman berisi form untuk mengirimkan pesan/email. Itulah yang Penulis maksud dengan halaman Contact. Melalui halaman Contact, pengunjung dapat menghubungi webmaster dengan mengirimkan email langsung dari website untuk memberikan feedback berupa testimoni, saran, kritik, pertanyaan, atau masukan penting lainnya. Sebelum mulai membuat halaman Contact, Pembaca perlu menambahkan data Contact terlebih dahulu, agar pesan/email yang dikirim oleh pengunjung dapat terkirim ke alamat email yang telah ditentukan. Caranya adalah seperti dijelaskan berikut ini:
21
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Pada halaman Category Manager: Add A New Contact Category, isikan nama kategori Contact pada Title (misalkan: Owner), lalu akhiri dengan klik Save & Close.
5. Pada halaman Contact Manager: Contact, isikan nama Contact pada Name (misalkan: Lucky Permana), kemudian pada Category pilihlah kategori Contact yang sesuai (contoh pada tulisan ini adalah kategori Owner), lalu pada Contact Details isikan data Anda seperti jabatan (Position), alamat email (Email), alamat (address), dan data lainnya pada kotak yang tersedia.
22
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Pembaca juga dapat menambahkan foto diri dengan meng-klik tombol Select pada Image. Akhiri dengan klik Save & Close
Data Contact yang telah Pembaca tambahkan mengikuti langkah-langkah di atas, akan terlihat di halaman Contact Manager: Contacts seperti pada gambar di bawah ini.
Pembaca telah melakukan langkah-langkah untuk mempersiapkan data Contact mengikuti petunjuk di atas, sedangkan untuk menampilkan halaman Contact di frontend Joomla akan dijelaskan lebih lanjut pada pembahasan di Notes-9.
23
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
24
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
8
Notes
erbeda dengan Menu Utama (Main Menu) yang tersedia secara default sewaktu install Joomla, Pembaca perlu membuat Menu User terlebih dahulu. Lakukan langkah-langkah berikut ini untuk membuat Menu User:
1. Login ke dalam backend Joomla (halaman Administrator), 2. Klik menu [Menus|Menu Manager|Add New Menu],
3. Pada halaman Menu Manager: Add Menu, isikan nama menu pada Title (yaitu: User Menu), isikan Menu type dengan usermenu, dan isikan Description dengan deskripsi dari menu user (misalkan: The user menu for the site). Akhiri dengan klik Save & Close.
25
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
4. Lanjutkan dengan klik pada link Add a module for this menu type,
5. Pada halaman Module Manager: Module Menu, ketikkan Menu User pada Title, ketikkan position-7 pada Position, lalu pilih Registered pada Access, dan akhiri dengan klik Save & Close.
26
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
9
Notes
embaca sudah memiliki Menu Utama dan sudah membuat Menu User, tetapi, kecuali item-menu Home yang sudah tersedia pada Menu Utama (Main Menu) secara default, Pembaca masih perlu menambahkan itemmenu lainnya pada skema perencanaan website (lihat kembali skema perencanaan website di Notes-1 dan Notes-2). Item-menu yang akan ditambahkan pada Menu Utama yaitu: Biodata/CV, Karya Saya, Artikel Komputer, Direktori Website, dan Contact, sedangkan item-menu yang akan ditambahkan pada Menu User yaitu: Profil User, Kirim Artikel, dan Kirim Weblink. Masih tersisa satu, yaitu Profil Saya. Item-menu Home yang semula secara default menampilkan Featured Articles, akan diubah agar menampilkan content Profil Saya. Seperti biasa, lakukan langkah-langkah di bawah ini setelah sebelumnya login dan tetap berada di dalam halaman backend Joomla (halaman Administrator):
Item-menu pada Menu Utama Mengubah tipe item-menu (item menu type) Home
1. Klik pada menu [Menus|Main Menu] untuk masuk ke halaman Menu Manager: Menu Items, lalu klik item-menu Home untuk masuk ke halaman Menu Manager: Edit Menu Item,
27
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
2. Lanjutkan dengan klik tombol Select pada Details-Menu Item Type untuk menampilkan daftar pilihan Select a Menu Item Type:, kemudian klik Single Article yang ada di grup Articles,
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
4. Lanjutkan klik judul content Profil Saya, dan Akhiri dengan klik Save & Close.
2. Lanjutkan dengan klik tombol Select pada Details-Menu Item Type untuk menampilkan daftar pilihan Select a Menu Item Type:, klik Single Article yang ada di grup Articles,
29
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Isikan judul item-menu Biodata/CV pada Title, dan pastikan pada Menu Location sudah terpilih Main Menu, 4. Klik tombol Select/Change pada Select Article di Required Settings, 5. Lanjutkan klik judul content Biodata/CV, dan Akhiri dengan klik Save & Close.
6. Lakukan langkah-langkah yang sama untuk menambahkan item-menu Karya Saya, bedanya, pada langkah ke-3 isikan judul item-menu Karya Saya di Title dan pada langkah ke-5 klik judul content Karya Saya.
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
2. Lanjutkan dengan klik tombol Select pada Details-Menu Item Type untuk menampilkan daftar pilihan Select a Menu Item Type:, klik List All Web Link Categories yang ada di grup Weblinks,
3. Isikan judul item-menu Direktori Website pada Title, dan pastikan pada Menu Location sudah terpilih Main Menu, 4. Akhiri dengan klik Save & Close.
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Isikan judul item-menu Kirim Artikel pada Title, dan pastikan pada Menu Location sudah terpilih User Menu, 4. Pada Basic Options, pilih Yes di Default category, dan pilih Artikel Komputer di Choose a category, 5. Akhiri dengan klik Save & Close.
33
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
34
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
10
Pengaturan module website Joomla
Pengaturan module website Joomla dapat dilakukan di halaman Module Manager yang tersedia di dalam backend Joomla..
Notes
embaca masih ingat apa yang dimaksud module pada Joomla, bukan? Silahkan baca kembali Notes-9 di serial EbookJoomla Vol.1 tentang Mengenal frontend Joomla. Pada Notes-10 di serial EbookJoomla Vol. 2 ini, Penulis akan menjelaskan beberapa pengaturan mendasar yang perlu diketahui Pembaca, pada tiga macam module yang telah disiapkan sebelumnya yaitu: Menu Utama, Menu User, dan Login Form. Pengaturan module website Joomla dapat dilakukan di halaman Module Manager: Modules yang tersedia di dalam backend Joomla. Silahkan login ke dalam backend Joomla, dan klik menu [Extensions|Module Manager] untuk menampilkannya.
35
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Beberapa pengaturan module yang akan dilakukan oleh Pembaca yaitu: Mengubah nama module main menu, Mengubah urutan (ordering) module, dan Menentukan login/logout redirection page.
3. Simpan dengan klik icon bergambar disket. Perhatikan, urutan module setelah Breadcrumbs akan berubah menjadi Menu Utama (1), Menu User (2), dan Login Form (3).
36
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
37
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
38
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
11
Preview website Joomla dan beberapa tips
Caranya mudah, seperti telah Pembaca ketahui, ketikkan saja alamat website Joomla di browser , atau kalau masih di dalam backend Joomla klik saja link View Site.
Notes
ampai disini, Pembaca telah selesai membuat website Joomla sesuai dengan skema perencanaan website. Sekarang saatnya melihat seperti apa tampilan frontend website Joomla yang telah dibuat tersebut. Caranya mudah, seperti telah Pembaca ketahui, ketikkan saja alamat website Joomla di browser (pada contoh EbookJoomla ini yaitu localhost/belajarjoomla/), atau kalau masih berada di dalam backend Joomla klik link View Site di pojok kanan atas. Selanjutnya, silahkan menjelajahi website Joomla dan mencoba semua fitur yang sudah Pembaca siapkan mengikuti petunjuk di Notes-1 s/d Notes-10.
39
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Mendaftarkan user
Pembaca sebagai Administrator Joomla dapat menulis artikel dan menambahkan link Direktori Website, tetapi tidak demikian halnya dengan pengunjung website Joomla. Pengunjung yang berminat untuk menulis artikel atau mengirim link website, harus terdaftar terlebih dahulu sebagai User di website Joomla milik Pembaca. Ada dua cara pendaftaran user, yaitu melalui backend Joomla dan melalui frontend Joomla.
3. Isikan nama pada Name, username untuk login pada Login Name, password untuk login pada Password dan Confirm Password, dan isikan alamat email pada Email. Akhiri dengan klik Save & Close.
40
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
41
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Pengunjung akan menerima link aktivasi yang dikirim ke alamat email yang didaftarkannya, dengan meng-klik link aktivasi tersebut maka Pengunjung akan resmi berstatus sebagai user dan dapat menggunakan Username dan Password-nya untuk Login di website Joomla.
42
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Sekarang, cobalah klik item-menu Kirim Artikel dan/atau Kirim Weblink, apa yang terjadi?.. akan tampil pesan error seperti pada gambar di bawah.
Pesan error tersebut muncul karena, secara default, level user yang diberikan kepada pengunjung terdaftar adalah level Registered, sedangkan untuk dapat mengirim Artikel dan/atau Weblink, User harus berada pada level minimal Author. Pembaca sebagai Administrator dapat mengubah level user dari Registered menjadi Author mengikuti langkah-langkah berikut ini: 1. Login ke dalam backend Joomla (halaman Administrator), 2. Klik menu [Users|User Manager] dan lanjutkan klik pada nama user yang akan diubah level-nya.
43
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
3. Pada Assigned User Groups, beri tanda centang (check) di Author. Akhiri dengan klik Save & Close.
4. Sekarang, pengunjung yang login di frontend Joomla sudah dapat menulis dan mengirim Artikel, dan/atau mengirim link ke Direktori Website.
44
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Pembaca perlu mengubahnya agar menampilkan informasi yang sesuai dengan keinginan. Beberapa hal yang akan diubah mengikuti petunjuk di Notes-11 ini adalah Logo, Site Description, dan Background header.
3. Lanjutkan dengan klik pada link Beez2-Default untuk masuk ke halaman Template Manager: Edit Style, 4. Perhatikan pada kelompok Advanced Options di halaman Template Manager: Edit Style tersebut. Logo adalah informasi file image (gambar) yang akan digunakan sebagai Logo website Joomla, Site Title adalah judul website Joomla yang akan dimunculkan apabila tidak menggunakan logo (informasi logo dikosongkan), dan Site Description adalah deskripsi singkat yang menggambarkan isi website Joomla secara umum.
45
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
5. Klik tombol Select pada Logo untuk memilih gambar logo yang akan ditampilkan. Apabila gambar logo yang diinginkan belum tersedia, upload terlebih dahulu file gambar logo yang diinginkan tersebut dengan meng-klik tombol Choose File, lalu browse dan pilih file yang diinginkan, dan klik tombol Start Upload untuk mulai meng-upload-nya. Setelah selesai upload, pilih (klik) pada gambar logo kemudian klik tombol Insert.
6. Selanjutnya pada halaman Template Manager: Edit Style, hapus (kosongkan) isian Site Title, dan pada Site Description isikan deskripsi website misalkan: Website Personal Profile Lucky Permana. Akhiri dengan
46
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
klik tombol Save & Close. Silahkan preview dengan klik View Site untuk melihat hasilnya.
Selanjutnya, Pembaca dapat mengubah file image background default dengan mengikuti salah satu dari dua cara berikut: Cara pertama, File image background header default (Beez_20) tersimpan pada folder c:\wamp\www\BelajarJoomla\templates\beez_20\images\personal\ (pembaca dapat menyesuaikan BelajarJoomla dengan nama folder yang sudah dibuat), dengan nama file personal2.png. Pada cara pertama ini, Pembaca akan mengubah nama file background yang telah disiapkan menjadi sama seperti nama file background default yaitu personal2.png. Langkah selanjutnya, tentu saja Pembaca harus meng-copy file background tsb ke c:\wamp\www\BelajarJoomla\templates\beez_20\images\personal\ untuk mengganti (replace) file personal2.png yang sudah ada disana sebelumnya.
47
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Cara kedua, Cara pertama merupakan cara termudah yang dapat dilakukan untuk mengubah header website Joomla. Pembaca cukup menyiapkan file background, memberi nama file dengan personal2.png, lalu meng-copy-nya ke folder yang sudah ditentukan. Tetapi bagi Pembaca yang tidak ingin mengubah nama file dan meng-copy-nya ke folder yang sudah ditentukan, dapat mencoba cara kedua yang dijelaskan berikut ini: 1. Sama seperti cara pertama, siapkan terlebih dahulu file image untuk background header. File image bisa dalam format file image lainnya seperti .JPG, tidak harus dalam fomat .PNG. 2. Login ke dalam backend Joomla (halaman Administrator), 3. Klik menu [Content|Media Manager] untuk masuk ke halaman Media Manager. 4. Pada halaman Media Manager, klik tombol Choose File, browse dan pilih file background, lalu klik Start Upload. Sampai langkah ini, Pembaca sudah meng-upload file background ke website Joomla. Ikuti langkah selanjutnya.
48
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
5. Lanjutkan dengan klik menu [Extensions|Template Manager] untuk masuk ke halaman Template Manager: Styles kemudian klik link Beez_20 di kolom Templates (lihat gambar pada pembahasan mengenai Mengubah Logo dan Site Description pada Header Website Joomla, di Notes-11 ini). Pembaca akan masuk ke halaman Template Manager: Customise Template, lalu klik pada link Edit css/personal.css,
6. Selanjutnya pada halaman Template Manager: Edit File, cari dan temukan baris code di bawah ini:
background: #0c1a3e URL(../images/personal/personal2.png ) no-repeat bottom right ;
lalu ubah code URL(../images/personal/personal2.png) dengan code URL(http://localhost/belajarjoomla/images/back-header.png) sehingga baris code seutuhnya menjadi seperti di bawah ini:
background: #0c1a3e URL(http://localhost/belajarjoomla/ /images/back-header.png) no-repeat bottom right ;
Perhatikan, /belajarjoomla/ dan back-header.png pada baris code di atas dapat Pembaca sesuaikan dengan nama folder website joomla dan nama file background yang sudah disiapkan mengikuti langkah-langkah membuat website Joomla sampai sejauh ini.
49
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
7. Terakhir, seperti biasanya, akhiri dengan klik Save & Close. Silahkan preview, website Joomla sekarang sudah tampil dengan header yang baru.
50
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
Bacaan Joomla
Graf, Hagen. 2011. Joomla! 1.6 Beginners Guide. Ebook: www.cocoate.com: cocoate.com/2011/02/joomla-16-beginners-guide. Graf, Hagen. 2011. Joomla! 1.7 Beginners Guide. Ebook: www.cocoate.com: cocoate.com/2011/07/joomla-17-beginners-guide. Graf, Hagen. 2012. Joomla! 2.5 Beginners Guide. Ebook: www.cocoate.com: cocoate.com/2012/02/joomla-25-beginners-guide. Hayne, Kevin. 2008. Joomla! 1.5 Quick Start Guide. Ebook: www.joomla.org: http://help.joomla.org/ghop/feb2008/task048/. Joomla.org. 2008 2011. Absolute Beginners Guide to Joomla!. Website: www.joomla.org: docs.joomla.org/Beginners. Permana, Lucky. 2008 2012. Pojok Joomla. Website: www.cangkruk.com. Permana, Lucky. 2010. Panduan Lengkap Website Dinamis Joomla. Jakarta: Elex Media Komputindo. Permana, Lucky. 2011. Mengelola Website Joomla 1.7 dengan 70 Ekstensi Terpopuler. Jakarta: Elex Media Komputindo. Permana, Lucky. 2012. Menggunakan Joomla di PC/Laptop for Dummy. Web page: www.facebook.com: facebook.com/Tutor.Joomla?sk=notes. Permana, Lucky. 2012. Membuat website Joomla di PC/Laptop for Dummy. Web page: www.facebook.com: facebook.com/Tutor.Joomla?sk=notes. Ramsay, James. 2008. Joomla! Core Features V1.2. Ebook: www.joomla.org: http://help.joomla.org/ghop/feb2008/task020/.
51
S E R I A L E B O O K J O O M L A M E M B U A T W E B S I T E J O O M L A
2 . 5
D I
P C / L A P T O P
52