Mobile Module
, (*1)
Please note: this module is no longer actively maintained., (*2)
Overview
The mobile module provides detection for mobile devices,
and can serve a different SilverStripe theme to them.
The module can either use redirection to a separate mobile
domain, or serve mobile optimised content under the same URLs.
It includes a default "blackcandymobile" theme to demonstrate the effects., (*3)
The codebase relies on server-side device detection based on user agent strings,
which is an unreliable way to determine if a device is considered to be "mobile"., (*4)
The W3C recommends a "One web" approach
that uses "Responsive Design"
to adapt content, rather than create isolated mobile experiences under their own domain.
Most of the work on mobile optimization will be in client-side techniques
like JavaScript and CSS (e.g. through media queries)., (*5)
Responsive design is not covered by this module, and can be achieved with standard
SilverStripe functionality., (*6)
The module also exposes this state in SilverStripe controllers
so custom logic and CSS/JavaScript includes can be adapted to mobile usage., (*7)
Maintainer Contact
-
Sean Harvey (Nickname: halkyon, sharvey)
, (*8)
-
Will Rossiter (Nickname: wrossiter, willr)
, (*9)
Requirements
- SilverStripe 3.1 or newer
Installation
Unpack and copy the mobile folder into your SilverStripe project., (*10)
Run "dev/build" in your browser, for example: "http://localhost/silverstripe/dev/build?flush=all", (*11)
A new theme called "blackcandymobile" will be created in your themes folder after
invoking the database (dev) build. This theme is a good starting point which you can modify
to create your own mobile theme., (*12)
If the themes folder can't be written to by the web server during dev/build, please
manually copy "blackcandymobile" into your themes folder from the mobile folder., (*13)
Alternatively, the module contains a "jquerymobile" sample theme
which creates a basic navigation interface through jQuery Mobile.
To use this theme, copy it to /themes in the same way,
and set it in your SiteConfig as described below., (*14)
Configuration
- SS2.4: In the CMS, browse to the "Pages" tab and click the root node of the site tree to
access the SiteConfig settings.
- SS3: In the CMS, browse to the "Settings" tab on the left navigation bar to access the
SiteConfig settings.
Once opened, there's a "Mobile" tab which exposes the configuration options of the mobile module., (*15)
These options are quite simple. One set of radio buttons controls the behaviour
of the mobile site, and there's text input fields to enter which domain you want
to act as the mobile, and which is the full site, so that redirection can occur
when a user accesses your site on a mobile device., (*16)
There's also a dropdown of all themes on the site. The theme chosen here will be
the one that mobile users of your site will see., (*17)
Please keep in mind that the mobile domain must point to your site before it will work., (*18)
Search Engine Optimization
The module follows Google's recommendations
by using a 301 HTTP redirection when using the module in "domain redirection" mode.
When using the same URLs, but different themes for mobile and non-mobile content,
Google will detect this change by using a different user agent, and index accordingly., (*19)
Limitations
- No fine grained mobile browser detection. There is only a way to detect the device
in general, e.g. Android or iPhone, but not the browser and features of the device
- Only tested on Android and iPhone devices. Other devices NOT tested
Future enhancements
- Search form in the default theme
- Integrate with subsites module to serve different content for a mobile site
- Device feature detection e.g. "Does this device support SSL?" or "Does this device support XHTML?" for progressive enhancement
- Dynamic image insertion and resizing via HTML5 data attributes
Wallogit.com
