How To Set Up MobileTemplate by nhuang on Joomla 3.0

The developer has provided the official instruction on their website (http://www.nhuang.com/joomla/joomla-mobile-template.html) BUT I have a hard time to understand it so I write my own instruction to help others who might have the same problem.

Just so you know, the layout of my mobile website after setting it up with MobileTemplate is like this.. First you will see the title of the website. It is automatically set up by the template. I didn't do anything to configure it. Next to the title, there's an icon you can click to bring out or close the menu (mobile_nav). Below these two, you'll see a banner which states that this is the mobile version of my official website (content_top). After that you'll see a list of articles. I didn't configure this so I have no idea how the articles are selected. Lastly, there's an empty spot at the bottom (footer).

So... how did I do it?

1. Download and installed it like usual
• Download here: http://extensions.joomla.org/extensions/mobile/mobile-display/24779 
• Then go to Extensions > Extension Manager to install
2. Enable the plugin
• Go to Extensions > Plugin Manager
• Find a plugin called System - Mobile Template
• Enable the plugin
3. Create a new menu set just for your mobile site
• Go to Menus > Menu Manager > Add New Menu
4. Create a new module for that menu
• Go to Extensions > Module Manager > New > Menu
• Set the position to mobile_nav
• To be safe, name the module as mobile_nav too. I haven't got the time to properly test it so I don't know if the name matter at all or not but to be safe, I just do it.
5. If you want to display a slideshow, image or something under the name of your website and menus, create a new module for that
• Go to Extensions > Module Manager > New > Custom HTML or whatever module
• Set the position to content_top
• Again, to be safe, name the module as content_top too. I honestly think there's no need to name the module whatever you want but I was in a hurry when I set it up so I want to avoid any possible problem. Now that I have some spare time, I feel too lazy to test if it actually matters :P
6. If you want to put something at the bottom of your mobile website, create another module
• Go to Extensions > Module Manager > New > Whatever module
• Set the position to footer
7. Okay, you are done :)

This is just the basic k. If you need more, please refer to the official nhuang website.

That's all for now. Bye :)


Terjemahan Bahasa Melayu

Tajuk: Cara pasang dan buat tetapan MobileTemplate yang direka oleh nhuang di Joomla 3.0

Pembangun MobileTemplate iaitu salah satu acuan (template) laman mudah alih (mobile) untuk Joomla dah sediakan panduan rasmi di laman sesawang rasmi mereka (http://www.nhuang.com/joomla/joomla-mobile-template.html) TAPI saya tak berapa faham arahannya sebab macam tengah baca teka-teki. Nasib baik boleh jawab teka-teki tu dan jawapannya saya kongsi di sini untuk orang yang masih belum berjaya menjawab teka-teki tersebut :)

Sebelum itu, saya nak terangkan dulu susun atur laman mudah alih saya selepas selesai memasang MobileTemplate. Mula-mula sekali anda akan nampak tajuk laman. Bahagian ni memang dah ditetapkan secara automatik di dalam acuan ini. Saya tak buat apa-apa. Sebelah tajuk tu, ada satu ikon yang boleh ditekan untuk memaparkan atau sorok menu laman (mobile_nav). Di bawah tajuk dan ikon menu, anda akan nampak sepanduk (banner) yang menyatakan ini adalah laman sesawang rasmi saya versi mudah alih (content_top). Selepas tu anda akan nampak satu senarai artikel. Bahagian ni saya tak usik apa-apa, memang automatik ditentukan oleh acuan jadi saya pun tak tahu artikel apa yang dipaparkan. Akhir sekali, ada satu ruang kosong di bahagian paling bawah laman (footer).

Jadi... macam mana saya buat?

1. Muat turun dan pasang macam biasa
• Muat turun di sini: http://extensions.joomla.org/extensions/mobile/mobile-display/24779 
• Kemudian pergi ke Extensions > Extension Manager untuk pasang
2. Aktifkan 'plugin'
• Pergi ke Extensions > Plugin Manager
• Cari 'plugin' bernama System - Mobile Template
• Aktifkan 'plugin' tersebut
3. Tambah kumpulan menu (menu set) khas untuk laman mudah alih
• Pergi ke Menus > Menu Manager > Add New Menu
4. Tambah modul (module) untuk kumpulan menu tersebut
• Pergi ke Extensions > Module Manager > New > Menu
• Tetapkan kedudukan modul di mobile_nav
• Untuk elak sebarang masalah, namakan juga modul tersebut sebagai mobile_nav. Panduan rasmi yang kata, bukan saya kata k. Masa saya pasang modul ni memang waktu tu tengah kelam-kabut jadi saya tak ada masa untuk uji panduan tu betul ke tidak (bahagian ni la). Sekarang dah ada masa, rasa macam malas pulak hehehe.... Jadi terpulang la nak namakan modul ini sebagai mobile_nav atau tidak. Saya rasa tak perlu tapi mana tahu kalau-kalau tak jadi tu, mungkin ini lah puncanya.
5. Kalau ada benda macam sepanduk ke, tayangan gambar bergerak ke, atau apa-apa je, yang hendak dipaparkan di bawah tajuk laman, sila tambah modul yang sesuai untuk benda tu
• Pergi ke Extensions > Module Manager > New > Custom HTML atau modul yang sesuai
• Tetapkan kedudukan modul di content_top
• Sama juga, untuk elak sebarang masalah, sila namakan modul ini sebagai content_top.
6. Kalau ada apa-apa lagi yang dipaparkan di bahagian bawah sekali, sila tambah modul
• Pergi ke Extensions > Module Manager > New > Apa-apa modul yang sesuai
• Tetapkan kedudukan modul di footer
7. Yeah, dah siap :)

Ini panduan secara ringkas je k. Untuk maklumat lanjut, sila layari laman rasmi nhuang.

Sekian :)