Research into Internet traffic trends predicts that mobile internet access will surpass PC-based access by 2014. The mobile commerce market will exceed $119 billion in 2015. The mobile explosion poses a new challenge for content management: how to adapt content to different devices, each with different capabilities such as screen size.
The Device Detection module helps manage the complexity of mobile environments. The module detects requests originating from mobile devices using a Mobile Detect capability API. Coupled with Magnolia CMS's core channel functionality, you can create multiple channels that define the content and format served to a particular device classe. There is no need to duplicate content. The same web content can be served to all devices in a format that is optimized for each device.
- Device detection filter
- Device capability configuration
- Device channel configuration
Device Detection is a community module and typically already installed. Go to Magnolia Store > Installed modules in AdminCentral to check. To install the module individually, see the general module installation instructions. Note that the module requires Magnolia CMS 4.5 or higher.
See the general module uninstalling instructions and advice.
The default configuration detects mobile devices, splitting them into two groups: smartphones and tablets. You don't need to change anything unless you want to detect other types of devices or other capabilities.
Device detection filter
The DeviceDetectionFilter is registered in the Magnolia filter chain at Configuration >
/server/filters/deviceDetection. The purpose of this filter is to intercept the incoming request and discover the capabilities of the device based on its
All devices identify themselves in the
User-Agent request header. Here is an example what the header looks like when an iPhone 3GS requests the Magnolia International corporate home page. The header basically says "I am an iPhone running iOS 4.0.2 and the Safari browser".
GET / HTTP/1.1 Host: www.magnolia-cms.com Connection: close User-Agent: Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_0_2 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version/4.0.5 Mobile/8A400 Safari/6531.22.7
Device capability configuration
The Mobile Detect API provides the capabilities of mobile devices. It knows the specifications of several devices, broken down into groups. The API is built into the Device Detection module so no calls to outside services are needed during detection. Mobile Detect is a clone of Mobile ESP. We use the clone rather than the original because the clone provides a Maven artifact so we do not need to include the API code.
The API is registered in Configuration >
The device detection filter asks the API if the requesting device is a smartphone or a tablet device. Once the device capabilities are identified, the filter creates a
DeviceInfo object in the request and sets the following basic properties:
trueif the device is a smartphone.
trueif the device is a tablet.
| Provides information about the capabilities of the device. Gets the
|Provides information about the device. All attributes are initially set to defined defaults|
Device channel configuration
In order to serve content content to the device in an appropriate format, a channel is resolved next. The DeviceChannelResolver is registered in Configuration >
/server/rendering/channelManagement/channels. This resolver resolves the channel to use based on the
The channel is mapped to a variation. The variation consists of templates and a theme that optimizes the content for displaying on the device.To learn more about how the filter chain works in mobile device detection, see Mobile rendering process.