WP Mobile Detector Guide

The purpose of this guide is to give users with both basic and advanced skills an overview of the WP Mobile Detector.

Introduction

The WP Mobile Detector was built with the entire WordPress community in mind. It contains a simple WordPress administration area theme editor for those users who are looking to customize their mobile website without having to know CSS, HTML, or PHP. For advanced users, the plugin comes with its own themes folder which allows you to install and customize your own mobile theme with all the hooks and functions as a standard desktop theme.

Getting Started

The WP Mobile Detector comes ready to go out of the box. It will install just like any other WordPress plugin through the WordPress administration area, or you can manually upload it to the WordPress plugins folder (wp-content/plugins).

Once activated through the WordPress plugins page, you will see a new menu item on the left called “WP Mobile Detector” that will allow you to configure the plugin.

Interactive Theme Editor

One of the most powerful features of the WP Mobile Detector is the interactive theme editor. The goal of this feature was to allow anyone to create and customize their own mobile theme without any technical knowledge at all. Through simple menu options, straightforward navigation, a real-time demo, and the simplistic nature of the editor, we believe we have created a tool that anyone can master in a matter of minutes.

Unlike many other mobile plugins on the market, they pigeon-hole you into a single design and allow you to add/remove functionality from that single design. The WP Mobile Detector allows you to do that too, but it gives you the extended functionality of modifying the look and feel of your mobile website. This allows owners of the WP Mobile Detector to make their mobile theme closely resemble their desktop theme to give a unified experience to their visitors.

Mobile Statistics

The WP Mobile Detector comes with a statistics package that allows you to see exactly what type of mobile traffic your website receives. The WP Mobile Detector takes it a step further and provides statistics for both feature phones and smart phones so that you can see which devices are most popular on your website.

These statistics can be used as a standalone or in conjunction with any other Analytics platform such as Google Analytics.

WordPress Mobile

WordPress is a powerful platform that is so much more than just a blog. For many websites it stands as their entire content management system. It was with that in mind that the WP Mobile Detector was built as a fully featured WordPress mobile plugin that utilizes the power of the WordPress platform.

It is our belief that all WordPress blogs will have a mobile plugin installed on their website in the near future, and that is why we didn’t just build a basic mobile plugin that works for today. We built a mobile plugin that other plugins can utilize to increase the power of their plugin and that follows the WordPress guidelines with how to create a plugin so that it can be utilized for years to come on the WordPress platform.

WP Mobile Detector & Other Plugins

The WP Mobile Detector was built in such a way that it should never conflict with other plugins. You can even install other mobile plugins and not only will it not cause any conflicts but it will still work when the other mobile plugin fails to detect a device.

The only plugins it does not work properly with are cache plugins such as the WP Super Cache and W3 Total Cache. The reason for this is because these plugins save a version of your website in a sense, and special integration is required to tell them not to save a version of your desktop website and show it to mobile visitors, and vice versa.

Other plugins such as some real estate plugins or gallery slideshow plugins do not work very well with the WP Mobile Detector because they were built with a desktop screen in mind, so on a mobile device, only part of the gallery may show up. This is simply a fault of the gallery plugin for not being mobile compatible. If this happens to you, the best thing to do is to manually make the plugin mobile compatible or contact the plugin developer and request that they release mobile support.

Mobile Themes

One of the most powerful features of the WP Mobile Detector is its ability to work with any mobile theme currently available. You can install a mobile theme into the themes folder of your WordPress installation, and then select it with the WP Mobile Detector. All mobile visitors will see the selected mobile theme when they visit your website. Please note that the interactive theme editor included with the WP Mobile Detector will only work with themes included with this plugin.

Advanced Use Cases

By request from other plugin developers, the WP Mobile Detector’s detection may be used to extend another plugin. A cookie is set by the plugin named ‘websitez_mobile_detector’ and has a “hash” of values separated by a pipe “|”. The first value is a either a true/”1″ or a false/”0″ to determine if it is a mobile device or not. The second value is the type of device where “0″ is a desktop, “1″ is a smart phone, and “2″ is a feature phone.

How does the WP Mobile Detector work?

The WP Mobile Detector first determines if the device visiting your website is a mobile device. If it is not, the WP Mobile Detector exits with no further checks and sets a cookie on the visitors computer so that it does not have to check if the visitor is on a mobile device on every page load. If the user is on a mobile device, the WP Mobile Detector looks for the mobile theme that you have selected inside of the WordPress administration area and then overrides WordPress to load the mobile theme instead of the desktop theme. For the most part, this is just a simple override of which theme and where it is located through WordPress hooks. 

Troubleshooting

• If you run into any problems with the plugin, the best thing to do is to deactivate the plugin and reactivate it. This will reset ALL settings of the plugin back to “factory” or as it was the first time you installed it. This will lose all of the settings you have changed for the WP Mobile Detector such as colors, menu items, etc. so try this as a last resort.
• The most common issues with the WP Mobile Detector is a conflict with another plugin. Typically this occurs with another mobile detection plugin or a cache plugin. For cache plugins such as WP Super Cache and W3 Total Cache, please search our blog for integration instructions with these plugins. This is an absolute requirement. If you do not follow the integration instructions found on the Websitez.com blog you will run into numerous errors.
• The next most common error is short codes being displayed on a page. This is caused by a short code being registered from your desktop’s “functions.php” file. Unfortunately there is no easy way to fix this. The only way to do so is to move the short code functions into its own plugin or to copy all of the code that performs the functionality of the short code to the “functions.php” file of the mobile theme you have selected.
• Occasionally the demonstration iPhone in the WordPress administration of the WP Mobile Detector area will not show recently updated changes. You may select a new header color, but when it refreshes, it still shows the old color. This is typically an issue with the way your website browser is caching the page. It is recommended to use FireFox with the WP Mobile Detector. If you still experience issues, the best thing to do is clear the cache for your browser and then refresh the page.
• If you receive the message “too many redirects have occurred” this is a result of the select of the mobile home page. On rare occurrences the mobile home page and desktop home page produce a loop that causes this error. The way to fix it is to simply change the mobile home page to a different option. The option “Posts” is typically what most people have changed the setting to.

Support

If you have any questions or comments, or you have any support needs, please feel free to send an email to support[at]websitez.com (replace the [at] with @). Or you can fill out our contact form.