Building a Mobile Website

Different ways of making your Website Mobile

Building a mobile website

• Responsive website example• Device Detection website examples• How to choose a good responsive template• How to make basic modifications with

mobilejoomla

Responsive Templates• This is based on your screen size… • the websites tries to be ‘intelligent’ and change depending on your

actual screen size…Regular Screen

Screen made smaller manually

Using Device Detection• Based on the device that opens the site, the

entire template will change.Regular Screen

Site on Mobile DeviceUsing a different template

Advantage with Device Detection

• Based on device can change the template view• Can determine which modules SHOULD or

SHOULD NOT appear on specific devices• Can switch which menus appear, even on an

Ipad (hover does not work well)• Can show preview of device to change styles

Versions of Mobile JoomlaFree Basic Mobile-pro

$0 $29 $100

Has Advertisements No advertisements No advertisements

Can not preview No preview mode Preview Mode – LOVE

No option for tablet changes, etc

Support is PER License, but can install on multiple sites, just can’t get support (and will say invalid on backend)

Mobile joomla Backend - previewClick for preview

Select what modules appear

Advanced module options

• Can select exactly which modules appear or not appear depending on your device

Time for mobile joomla

• Mobile joomla installation could take an additional 5-10 hours based on template styling

• Currently the styling has to be done by ‘inspect element’, css and image changes

• In the future they may make this easier to do• Sometimes new menus need to be created to

simplify the site (syossetlibrary.org) we use a different menu for mobile vs. the entire site