ullright Mobile Version
Introduction
ullright offers a very simple method to add templates and css files for mobile devices.
On each request the user agent string of the webbrowser is checked against a list.
Setup
In apps/frontend/config/apps.yml set "enable_mobile_version" to true
all: # Enable mobile version rendering for smartphones etc enable_mobile_version: true
Directory Structure and Important Files
- / - project root
- apps/frontend/ - contains all custom files except web assets like images, css files
- config/
- app.yml - set "enable_mobile_version" to true here
- modules/ - module specific customisations ullCms - customisations of the cms module
- templates - put custom templates for specific cms pages here.
Example: aboutUsSuccess.mobile.php
- templates - put custom templates for specific cms pages here.
- templates/ - custom layouts and html head for normal and mobile version
- _html_head.mobile.php - custom html head statements for mobile devices
- layout.mobile.php - custom mobile layout
- config/
- web/ - web assets
- css/ - custom stylesheets
- custom_multi_format.css - Custom CSS statements for both the normal and mobile version
- custom.css - Custom CSS statements for the normal version
- custom.mobile.css - Custom CSS statements for the mobile version
- css/ - custom stylesheets
- apps/frontend/ - contains all custom files except web assets like images, css files
Check if a Mobile Device was detected
In any template you can find out if the mobile version is active by querying
$sf_request->getRequestFormat()
Example:
<? if ('mobile' === $sf_request->getRequestFormat()): ?> // Yes, mobile version activated, do somethin
HTML Viewport
<meta name="viewport" content="width=device-width,target-densitydpi=150" />
<!-- Tablet initial zoom --> <?php //<meta name="viewport" content="initial-scale=0.8"> ?> <meta name="viewport" content="width=device-width,target-densitydpi=200" />