Home » Uncategorized » How to redirect a webpage to a mobile version.

How to redirect a webpage to a mobile version.

A good website designer/developer will ensure that smaller screen resolutions are catered for by using responsive themes. However, there are many website out there designed before the appearance of handheld devices. Here are a few ways to deal with the situation.

This is simple using WordPress because their are plenty of plugins that will do this for. They can even display a version of your WordPress website configured for mobile size screen resolutions. However, it is better to either use a purpose made theme that supports desktop and mobile versions or design a new theme for your mobile version.

If you are using designing an HTML website then you can place the following code in the HEAD section of your website:

<script type="text/javascript">
 if (screen.width <= 850) {
        window.location ="https://yourmobilepage";
 }
 </script>

You can also use document.location instead of windows.location. The resolution here is set to 850 pixels. This code can also be place in your themes header.php which hopefully is in the child folder.  Note however that some mobile cannot execute or have indeed have JavaScript execution disabled.

Another useful way to redirect and you can use this method for other reasons too is using the .htaccess file.   The first stage is to check for MIME types, such as wap, used by  handheld devices. If this true then a redirect is initiated

RewriteEngine On

RewriteCond %{HTTP_ACCEPT} "text\/vnd\.wap\.wml|application\/vnd\.wap\.xhtml\+xml" [NC]
RewriteCond %{REQUEST_URI} ^/$
RewriteRule ^ https://m.domain.com%{REQUEST_URI} [R,L]

 

Support