Description: Simple way to detect the client device at php level.
| Author: | 33 Themes UG i.Gr. (profile at wordpress.org) |
| WordPress version required: | 3.4 |
| WordPress version tested: | 3.8.10 |
| Plugin version: | 0.4 |
| Added to WordPress repository: | 27-08-2013 |
| Last updated: | 14-09-2015
Warning! This plugin has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.
|
| Rating, %: | 100 |
| Rated by: | 1 |
| Plugin URI: | http://www.33themes.com |
| Total downloads: | 2 038 |
| Active installs: | 200+ |
 Click to start download |
|
This plugin detects the client device in a simple way at php level.
Identify the device with a CSS body class
- For a desktop in linux
<html>
<body class="linux chrome desktop">
</body>
</html>- For a desktop in Mac
<html>
<body class="mac firefox desktop">
</body>
</html>- For an iphone mobile
<html>
<body class="mac safari mobile portrait">
</body>
</html>- For an iphone mobile landscape
<html>
<body class="mac safari mobile landscape">
</body>
</html>- For an android mobile
<html>
<body class="chrome linux mobile">
</body>
</html>And also for IE 😉
How to indentify the device
<?php
if ( is_tttdevice('desktop') ) {
echo "this is a desktop device";
}
elseif ( is_tttdevice('mobile') ) {
echo "this is a mobile device";
}
elseif ( is_tttdevice('tablet') ) {
echo "this is a tablet device";
}
else {
echo "Opps... we don't know what this device is!!";
}
?>How to remove the sidebar for mobile only
<?php
if ( ! is_tttdevice('mobile') ) {
get_sidebar();
}
?>This means, the sidebar will not show in mobile devices. This is not the same has "hidden" in CSS, with TTT Devices the code is not sent to the client.
Other keywords to detect devices
<?php
if ( is_tttdevice('iphone') ) {
echo "this is an iPhone";
}
if ( is_tttdevice('android') ) {
echo "this is an android";
}
if ( is_tttdevice('windowsphone') ) {
echo "this is an windows phone";
}
if ( is_tttdevice('mobile') ) {
echo "this is a mobile";
}
?>Stop loading some js for mobile
It is very useful if you need make your site faster for mobile or tablet, these browsers can't handle well some javascript effects. You can stop loading them in mobile devices. Example:
In your functions.php file:
function heavyanimation_script() {
if ( is_tttdevice('desktop') ) {
wp_enqueue_script( 'heavyanimation', get_template_directory_uri() . '/js/havyscript.js', array('jquery'));
}
}
add_action('wp_enqueue_scripts', 'heavyanimation_script');This means that js only loads in desktop devices, easy 🙂