Mobile Ready feature

In this article I'm going to tell you how to make mobile, smartphones and tablet PCs, versions of your site.

If you wish to have a mobile version of you site there's a good point to use JoomlArt T3 Framework v.2 for developing your site as the framework already has built-in Mobile Ready Feature. In other words if you try to open you site in your iPhone or any Android device you'll see a mobile version of your site and the one thing to get it ready is to make changes in pre-installed JA T3 v2 templates. First you have to install JA T3 Framework v.2 on your Joomla 2.5.x based site.

 

Download the framework, install one and don't forget to enable it in Joomla Plugins menu.

T3 installed

 

Download free Joomla Art template JA Purity II template for Joomla 2.5.

JA Purity installed

 

Open Template manager and set JA Purity as default template:

JA Purity default

 

Then click ja_purity_ii - Default link and click Profiles tab on the right side and then scroll down. Select iPhone for Android Layout in a dropdown list, save it.

Android layout

 

Take your mobile device(iPhone, Android) and open your site in a browser:

Mobile home

Congratulations! You have a mobile Joomla site! :)

I was using LG Optimus L7 and built-in web-browser in a screen-shot above.

 

Next thing to be done is to customize your template for you.

Go to your active template folder and create next folders inside: blocks, etc/layouts, css, page.

Create folders iphone and android inside of each mentioned above folders.

Folders structure

Some usefull objects:

$device = T3Common::mobile_device_detect(); //iphone, android
$layout = T3Common::get_active_layout(); //iphone

to be continued

Joomla Articles