Workshops The Power of Joomla! Pokok Bahasan Workshops The Power of Joomla!

Bagian 1: Pengetahuan Dasar Web 1.1 Pengenalan Teknologi CMS 1.2 Software yang dibutuhkan 1.3 Instalasi Joomla! di Lokal 1.4 Pengenalan Hosting dan Domain 1.5 Instalasi Joomla! di Hosting

Bagian 2: Penguasaan FrontEnd Bagian Berita (News) Modul Utama Component Utama Bagian Member (User Login)

Bagian 3: Penguasaan Back-end Penanganan News / Berita Membuat Menu ber Halaman Penanganan Menu Berbagai Tipe Penanganan User Instalasi Template, Module, Component, Mambots Penanganan Module Penanganan Config dan lain-lain

Bagian 4: Pengenalan Template Instalasi Template Baru Modul Template Chooser Template-template Terbaik Dalam Joomla Penanganan HTML (Index.php) Penanganan CSS (template_css.css)

Bagian 1.1: Pengetahuan Dasar Web - Pengenalan Teknologi CMS Workshops The Power of Joomla!

1. Dynamic Website Website adalah kumpulan web page. Web designer biasanya menggunakan tools Tools menghasilkan website yang static Website yang dinamis adalah website yang memiliki kemampuan untuk merubah isinya secara otomatis.

2. DHTML DHTML adalah bahasa dasar utk membuat website dinamis. DHTML adalah gabungan dari XHTML, CSS dan Javascript. Pengetahuan dasar dari ketiga jenis script sangat diperlukan Web designer yang hanya mengandalkan tools tetapi tidak memahami ketiga script akan menemui banyak kesulitan

2. DHTML (XHTML) Merupakan bahasa dasar yang paling utama dari web page Disahkan oleh W3C (World Wide Web Consortium) Merupakan pengganti HTML Dapat menangai penampilan (apprearance) dan isi (content) dari website

2. DHTML (CSS) Merupakan bahasa dasar kedua setelah XHTML XHTML dan CSS berkerja sama dalam membentuk website CSS dikhususkan untuk menangani bagian penampilan (appearance) saja. Dahulu CSS sangat sedikit peranannya (10%), sekarang makin besar (50%).

2. DHTML (JavaScript) Javascript merupakan bahasa pemrograman (script) yang dikhususkan dalam web Termasuk dalam golongan client side script Membuat website menjadi lebih dinamis seperti misalnya menampilkan jam, membuat sebuah tombol yang berubah warna, melakukan validasi terhadap isi dalam form

3. Dynamic Website with PHP/MySQL Search engine, forum, calendar, news dan lainnya yang umumnya menggunakan database tidak dapat dilakukan oleh DHTML. Untuk membuat komponen dinamis tersebut dibutuhkan server side script Web programmer dituntut menguasai client side script, server side script dan database menagement sistem. Web designer biasanya menggunakan komponen yang telah siap pakai

3. Dynamic Website with PHP/MySQL

4. Dynamic Website with CMS Salah satu cara yang sangat mudah untuk membuat website yang dinamis dengan cepat adalah dengan CMS. CMS adalah tools yang dapat mengatur content secara efisien dan efektif dalam membentuk sebuah website seperti misalnya sebuah website portal.

4. Dynamic Website with CMS

4. Dynamic Website with CMS Kelemahan dari cara pembuatan website tanpa CMS adalah kebutuhan akan tenaga kerja dan biaya yang besar. Dengan CMS permasalahan tersebut bisa diatasi Web designer berperan dalam merancang penampilan CMS Web programmer berperan dalam membuat modul CMS User biasa (orang awam) dapat melakukan perawatannya

4. Keuntungan CMS informasi yang up to date dan konsisten Pemanfaatan kembali suatu modul (content reusable) Meningkatkan produktifitas dan kepuasan dari sebuah team Pembuatan website dapat dilakukan secara desentralisasi Fasilitas untuk mendefinisikan alur kerja (work flow).

Dua Versi CMS: Proprietary CMS – harga “sangat” mahal www.vignette.com www.mediasurface.com www.interwoven.com www.reddotsolutions.com Opensource CMS – harga free www.phpnuke.com www.mamboserver.com www.xoops.com www.typo3.com

4. Proprietary CMS:

4. Opensource CMS:

4. CMS Proprietary atau Opensource? Sebaiknya mencoba dulu CMS open source untuk mengetahui fitur-fiturnya. Setelah memahaminya barulah dapat memutuskan. Pemilihan tergantung dari strategi dan kebijakan yang ada dari perusahaan tersebut

4. Software yang dibutuhkan CMS: 1. Web Browser Internet Explorer 2. Web Server Apache 3. Database Server MySQL 4. Script Engine PHP 5. Script Editor PHP Coder & Dreamweaver 6. Software Upload WS FTP Pro 7. CMS Script Joomla / Mambo

5. Joomla / Mambo Web developer dapat menggunakan Mambo sebagai core. Komponen lainnya dapat dibuat dan diintegrasikan kedalam core ini. Web designer dapat merancang berbagai macam tampilan (themes) Kekuatan dari Mambo: akses yang cepat (quick), jumlah byte yang dibutuhkan sangat kecil (simple), kemudahan untuk membuat themes yang baru (easy).

5. Joomla / Mambo

7. Instalasi Joomla / Mambo Menyiapkan Script

7. Instalasi Joomla / Mambo Mengaktifkan Joomla/Mambo

7. Instalasi Joomla / Mambo Menampilkan Modul-modul

8. Membuat Tampilan (Themes)

8. Membuat Tampilan (Themes) No. Penjelasan 1. Sitename <?php echo $sitename; ?> 6. Mainbody <?php include ("mainbody.php"); ?> 2. Newsflash <?php include ("newsflash.php"); ?> 7. Right component <?php $side = "left"; include("component.php"); ?> 3. Date <?php echo date(_DATE_FORMAT); ?> 8. Footer <?php echo _FOOTER_INDEX; ?> 4. Pathway <?php include ("pathway.php"); ?> 9. Banners <?php include ("banners.php"); ?> 5. Left component <?php $side = "left"; include("component.php"); ?>

8. Membuat Tampilan (Themes) <table width="100%" border="2"> <tr> <td rowspan="2"> </td> <td> <?php echo $sitename; ?> </td> <td rowspan="2"> <?php echo date(_DATE_FORMAT); ?> </td> </tr> <td> <?php include ("newsflash.php"); ?> </td> <td colspan="3"> <?php include ("pathway.php"); ?> </td> <td> <?php $side = "left"; include("component.php"); ?> </td> <td> <?php include ("mainbody.php"); ?> </td> <td> <?php $side = "right"; include("component.php"); ?> </td> <td colspan="3"> <?php echo _FOOTER_INDEX; ?> </td> </table>

Bagian 1.2: Software Yang Dibutuhkan (Instalasi Lokal) Workshops The Power of Joomla!

Software Utama Joomla! Script: Web Server & Database Server: Browser Joomla_1.0.12-Stable-Full_Package.zip Web Server & Database Server: WinLAMP03.exe Browser Firefox Setup 1.5.0.7.exe

Software Pendukung Aplikasi PHPMyAdmin Template Joomla! phpMyAdmin-2.8.2.4.zip Aplikasi MySQLFront MySQL-Front_2.5_Setup.exe Editor Program phpcoder.exe Editor CSS topstyle.exe Template Joomla! rt_carbonation.tgz rt_technopia.tgz jw_inetgazette.tgz jw_onemorething.tgz Module Joomla! mod_html.zip mod_anaclock2.zip mod_letterman_1.2.2.tar.gz Component Joomla! jobline-1_1_2_2.zip com_akobookplus 2.0.2.zip com_letterman_1.2.2.tar.gz

Bagian 1.3: Instalasi Joomla di Lokal Workshops The Power of Joomla!

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Instalasi di Lokal

Bagian 1.4: Pengenalan Hosting dan Nama Domain Workshops The Power of Joomla!

Domain dan Hosting

Domain dan Hosting

Domain dan Hosting

Domain dan Hosting

Domain dan Hosting

Domain dan Hosting

Workshops The Power of Joomla! Instalasi di Hosting Workshops The Power of Joomla!

Login pada CPANEL

Tampilan CPANEL

Buat Subdomain

Buat Subdomain

Buat Subdomain

Install Joomla dg Fantastico

Install Joomla dg Fantastico

Install Joomla dg Fantastico

Install Joomla dg Fantastico

Install Joomla dg Fantastico

Hasil Instalasi

Hasil Instalasi

Hasil Instalasi

Bagian 2: Penguasaan Front-end Workshops The Power of Joomla!

Penguasaan Front End Bagian Berita (News) Module Utama Component Utama Bagian Member (User Login)

Bagian Berita (News)

Bagian Berita (News)

Bagian Berita (News)

Module Utama

Component FrontPage

Link - Static Content

List - Content Section

Blog - Content Section

Component - Web Links

Component - Contacts

Component - Search

Component - News Feeds

Table - Content Category

Wrapper: Wrapper Component

Bagian Member: Sebelum Login

Bagian Member: Setelah Login

Bagian Member: Rubah isi berita

Bagian Member: Ubah Profile

Bagian Member: Submit News

Bagian Member: Submit Weblinks

Bagian 3: Penguasaan Back-End Workshops The Power of Joomla!

Bagian 3: Penguasaan Back-end Instalasi Joomla ! Penanganan News / Berita Penanganan Menu Berbagai Tipe Penanganan User Instalasi Template, Module, Component Penanganan Module dan Component Penanganan Config dan lain-lain

Flash Demonstration !

Bagian 4: Pengenalan Template Workshops The Power of Joomla!

Bagian 4: Pengenalan Template Instalasi Template Baru Modul Template Chooser Template-template Terbaik Dalam Joomla Penanganan HTML (Index.php) Penanganan CSS (template_css.css)

Flash Demonstration !