Mobiledetect is a Smarty plugin for CMS Made Simple System using Mobile_Detect PHP Class written by Serban Ghita. For more information about Mobile_Detect class you can visit mobiledetect.net and if you feel there is some detection missing, find a bug or would like to contribute to Mobile_Detect project, you can find it on Github. Description from Mobile_Detect project:
"Mobile_Detect is a lightweight PHP class for detecting mobile devices (including tablets). It uses the User-Agent string combined with specific HTTP headers to detect the mobile environment."
After downloading function.mobiledetect.php file, you should upload it to your CMSMS folder inside "plugins" folder.
After file was uploaded you can simply use it in your Page Template or Page by calling {mobiledetect}
Smarty tag.
Once {mobiledetect}
tag has been placed in your Template or Page, various $device Smarty Object attributes will become available.
With help of these Object attributes you can easily build a Template logic based on detected device.
{mobiledetect}
{if $device->isMobile}
<div class="mobile-class">
<p>We have found a Mobile device</p>
{if $device->isTablet}
<div class="only-tablet">
<p>This is a Tablet device</p>
</div>
{elseif $device->isPhone}
<div class="only-phone">
<p>This is Phone device and not Tablet</p>
</div>
{/if}
</div>
{/if}
You can also use include or exclude parameters listed below. Don't use both at the same time.
- (optional) include - A comma-separated list of mobile devices the data is intended for.
- (optional) exclude - A comma-separated list of mobile devices the data is not intended for. (Example exclude='tablet, asus')
- (optional) assign - Assign to a variable.
Mobiledetect plugin has also {mobileswitcher}
smarty plugin included.
Mobileswitcher plugin will return a link or URL based on Device detection from Mobile_Detect php class, link is only shown if detected device is truly mobile device. Once link was clicked a session is created and $device Smarty Object attributes will be reset. For exmaple if visitor visits your website with a mobile device and in your template you would be using a Object attribute {$device->isMobile} which in case of a mobile device would return true, after clicking on switcher link {$device->isMobile} would be reset to false.
Just insert the tag into your template/page like:
{mobileswitcher}
With assign parameter you can assign output of this plugin to a Smarty variable, which can be usefull if you want to apply some special layout around switching link but it does not apply to a desktop device, offcourse you could also simply use {$device->isMobile}, but there are many way ways to skin the cat and there is also a {$linktext} Smarty variable available which can be usefull if you are using "hrefonly" parameter but still want to be able to control output of link text.
{mobileswitcher assign='switcher' hrefonly='1' desktoptext='Go to desktop layout' mobiletext='Go to mobile layout'}
{if $switcher}
<div class="switcher-wrapper">
<div class="some-nice-style">
<a class="my-switcher-link" href="{$switcher}">{$linktext}</a>
</div>
</div>
{/if}
- (optional) hrefonly - Will return only URL instead of link. (Example hrefonly='1')
- (optional) class - Class that should be applied to link.
- (optional) title - Value for link title attribute.
- (optional) tabindex - Value for link tabindex attribute.
- (optional) accesskey - Value for link accesskey attribute.
- (optional) desktoptext - Link text that should be displayed for mobile devices. Example: desktoptext='Switch to desktop version'. (Default: Desktop version)
- (optional) mobiletext - Link text that should be displayed for desktop. Example: mobiletext='Switch to mobile version'. (Default: Mobile version)
- (optional) assign - Assign this tag to a Smarty variable.