If you’ve created a mobile version of your website, you’ll need to be sure that you redirect your mobile visitors to your mobile website. For example, if someone visits domain.com on their phone, you’ll need a way to redirect them to m.domain.com (the mobile version of your site created on a subdomain called “m“).
The question then becomes, “How do you automatically send users to the mobile site?”
If you think about how your redirect actually works, in theory, it’s easy to understand- “If the user is using a mobile device, redirect them to the mobile version of the site“. The solution then relies on how to identify your visitor as a mobile user. There are a few different ways to identify a mobile user:
- Let the user decide
- Use JavaScript
- Use PHP, JSP, ASP to Detect a Mobile Browser
- Use WURFL (Wireless Universal Resource File)
Searching for a new home for your WordPress site? Try InMotion’s WordPress Hosting solutions for secure, optimized servers that are configured for your budget needs.
Provide a Link to Your Mobile-Optimized Site
If you have a mobile-optimized version of your website, then the easiest thing to do to get users to use that is to provide a link that explicitly says that you have a mobile-friendly website. This allows them to manually select to go to the mobile site. It’s not automatic, but it provides a simple solution to the problem. You don’t need extra code, just a well-described link that will catch a user’s eye on your home page.
Use Javascript or jQuery
Javascript can be used to detect mobile devices and there are a lot of different coded solutions that you can find on the internet. It is a well-discussed topic, just make sure that whatever source you view is up-to-date with the current methods that are recommended. The main issue with using code that is looking for specific mobile devices is that it would need to be constantly updated with newer devices.
Use Programming Code to Detect a Mobile Browser
One very convenient source of code for the purpose of detecting mobile browsers is the Detect Mobile Browsers website. It is an open-source provider of scripts for many different languages. The provided code will be able to detect many different user-agents, but it may not catch all of them, so you would have to be familiar with the code and look for updates, or even update it yourself as per your needs.
Use Wireless Universal Resource File (WURFL)
WURFL actually consists of an API and an XML configuration file that give you access to databases that contain information on a wide variety of mobile devices. The advantage of using WURFL is that while the code of the API may go out-of-date, the information about the mobile devices is regularly updated. You can update it periodically and get the most recent list of mobile devices that are being used. You would need to implement the API on your website in order to use it.
As you can see, there are many different possible solutions to have a separate mobile website that is optimized for your users. However, the best solution recommended by the industry is to use responsive design. This allows you to have only ONE set of code for your website. Using responsive design is the ideal solution as it saves time and makes management of your website easier. There’s no need to worry about updating two sites and making sure that both sites are always working.
To learn more about using responsive design, please see our article titled, Introduction: Creating a Responsive Web Design.
Thank you ! This is Perfect
hi – i tried this .htaccess file but doesnt seem to work for me.
i placed it in the root directory of the main “domain.com” – the only thing im thinking is that im testing this on an iphone – is iphone included on those conditions?
The .htaccess method is basically reading what MIME types are accepted by the browser that the visitor is accessing your website through. Mobile devices (including Apple devices) all accept the Wireless Markup Language WML (included in the .htaccess rewrite code), so it in theory should redirect accordingly. Have you tried using Safari from the iPhone in “Private Browsing Mode”? This creates a session in which the cache is temporarily reset (so it’s like clearing your cache without having to lose the “good cache”). Try testing in new private browsing sessions to ensure that the iPhone isn’t just missing the redirect due to Safari’s cache.
Hello Everyone,
Please can anyone help me to redirect my site www.travelsinternational.co.uk to a mobile version.
Best Regards,
Max Miller
The article above does address how to redirect to a mobile site. If you’re having problems with it, then please indicate where you are having an issue. If you require further assistance, then you may need to speak with a developer for help providing the necessary code.
Excellent
Thank you
<script>
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
window.location.href=”https://yourblog.blogspot.com/?m=1″;
}
</script>
place this snippet just after your haed tag .
hello
i’m stumped. I created an “m” directory i the root file on the server. I put the javascript in the head of the desktop website….didn’t work. In fact wouldn’t come up on a cell. I the put the code on the mobile page in the head also….no difference.
What am i doing wrong?
jm
Can you provide a link to the website for us to test further?
Thank you,
John-Paul
Is there any way to remove the redirect device version in the Domain URl that the user sees? For example I don’t wantxxxx.com/phone
Cheers
Chris.
Hello, Chris.
Following this guide will allow you to setup a redirect to an existing Uniform Resource Identifier (URI). However, this article does not cover manipulating URI’s and customizing the way your redirected links appear to your user. As I understand, that would be done via the name and location of the resource you are redirecting to.
How to increase the redirectory speed issues in website to mobilesite .The redirectory speed is 32 seconds……I neeed 3 seconds loaded to the mobileite
So your site takes 30 seconds to redirect to the mobile version? Can you provide us a link to it so we can look into this further for you?
Amazing, worked like a charm
why would the redirect script disappear from the home page file, I insert the script both home/index file save it then redirects as intended then if an edit changes of the content of the home page the dedirect script isn’t there. I put it back and works again.. any idea how to make perminant…?
Sean, if you are using WordPress or another common content management system( CMS ) any update will overwrite changes you have made to one of the CMS files.
Good afternoon CaseyB and all…
The script code…
<script>if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)){
window.location =”https://www.soultrainradio.co.uk/mobile.html”;}</script>
works perfect, but how would I allow users to go back to the original site if they wish to.
Kind regards
Gary
Most browsers should allow users to choose to access the desktop version instead of the mobile one.
Alternately, you may be able to create a variable or cookie to remember their choice, and serve the correct option. This will require further development/programming.
Thank you,
John-Paul
Good afternoon Arnel,
Thanks for your response.
My initial site is responsive at www.soultrainradio.co.uk, but I want phone and tablet users to go to www.soultrainradio.co.uk/mobile.html/ which is a JQuery site I created.
When I used the JS above, it worked on my IPhone 6, but not a Android.
Would this be because I left out the / after the mobile.html.
Kind regards,
Gary
Gary, when I go to your site on my Android phone I am redirected to your mobile page, and it loads without issue.
Are you still seeing this issue? Have you tried clearing the cache on the Android phone? If you’re still seeing this issue, what browser and version are you using?
Good afternoon, I have tried the code…
<script>if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)){
window.location =”https://soultrainradio.co.uk/mobile.html.”;}</script>
and when I type my web address… www.soultrainradio.co.uk it takes you to the JQuery mobile page on my IPhone.
My colleague has an android and it does not locate the website and shows a “Website not found error code.”
Can anyone advise any guidance or resolution.
Kind regards
Gary
Hello,
In reviewing the code, it appears that you might have a stray period in the URL. Make sure that you review your code closely so that you have the correct syntax. Stray punctuation can render the code inoperable. The area I’m talking about is the window location pathname.
Check out the above comments for different variations on the code. Additionally, please be aware that it would be preferable to have a responsively designed site instead of 2 separate websites (one for mobile). Search engines would prefer the responsively designed site.
If you have any further questions or comments, please let us know.
Regards,
Arnel C.
nice article
I have a website designed in muse. It did have three versions one for desktop and one for tablet and one for phone. This did work breifly but now I can only see the desktop version on the tablet and phone? Is this the code in the desktop index page being incorrect and not redirecting to the phone or tablet. I have tried refreshing but this doesnt work. So must be either an address issue or in the code?
This is quite annoying as google are now putting priority to mobile/ responsive sites..
See code below can anyone help please?
code from top of html index desktop page:
<script type=”text/javascript”>var jslang=’EN’;</script>
<script type=”text/javascript”>
if(typeof Muse == “undefined”) window.Muse = {}; window.Muse.assets = {“required”:[“jquery-1.8.3.min.js”, “museutils.js”, “webpro.js”, “musewpslideshow.js”, “jquery.museoverlay.js”, “touchswipe.js”, “jquery.musemenu.js”, “jquery.watch.js”, “museredirect.js”, “index.css”], “outOfDate”:[]};
</script>
<script src=”/scripts/museredirect.js?4117159434″ type=”text/javascript”></script>
<script type=”text/javascript”>
Muse.Redirect.redirect(‘desktop’, ‘/tablet/index.html’, ‘/phone/index.html’, ‘desktop’);
</script>
Hello Nigel,
Apologies for the issues with your Muse-created website. We cannot troubleshoot the coding issue as it requires Adobe Muse which we do not have. You will probably need to address issue with the Adobe support forums to get the problem resolved.
If you have any further questions or comments, please let us know.
Regards,
Arnel C.
Hi Christopherm,
Thanks very much for the response. I think my problem had a lot to do with a plugin, Joomsef and after unstalling, everything is ok now. Thanks again!!!
Hi Guys
I have almost completed a project which has normal desktop and a seperate mobile site. I have tried to use the mobile_detect php module.
When run the site auto detects well and displays the mobile site when needed. But….. I have a link on the mobile site to display the desktop site and this I dont seem to be able to get to work.
Any recommendations on what the link should have in way of code to work with the php module
Thanks
Paul
This article only covers the above methods with .htaccess and Javascript, but if you search for PHP in the comments you will see a few suggestions from other users regarding using PHP for redirecting to mobile sites.
I would be most grateful if you could help me find solution to my problem.
1) I am on a shared hosting plan with a cPanel account with a fresh Joomla 3.5.1 installation
2) I created a subdomain which is m.example.com at the document root which is: /public_html and NOT /public_html/m). And this subdomain is only for the purposes of URL redirection on mobile phones as I have a plugin that will detect and redirect users on mobile phones accordingly.
3) Now when I try m.example.com on a mobile phone and in a browser with or without the installed plugin for detection and rediretion, it strangely redirects to www.m.example.com which seems very abnormal.
Please, what can i do to correct it and is this anomally caused by the joomla installation ?
5) After contacting my host, this is the message they gave me:
Please check wget checker tool result:
wget example.com
Resolving example.com (example.com)… 1xx.xx.xxx.xxx
Connecting to example.com (example.com)|1xx.xx.xxx.xxx|:80… connected.
HTTP request sent, awaiting response… 301 Moved Permanently
Location: https://www.example.com/ [following]
wget m.example.com
Resolving m.example.com (m.example.com)… 1xx.xx.xxx.xxx
Connecting to m.example.com (m.example.com)|1xx.xx.xxx.xxx|:80… connected.
HTTP request sent, awaiting response… 301 Moved Permanently
Location: https://www.m.example.com/ [following]
As you can see, there is a permanent 301 redirect somewhere for both the domain and the subdomain.
It was set up neither in cPanel menu nor in .htaccess file. We suppose that it was set up somewhere inside Joomla configuration.
Many thanks in advance and waiting for your response!
You may want to try doing the redirect with .htaccess or one of the other methods suggested instead of the plugin, just to see if it is the plugin at fault or something related to the domain, or something completely unrelated.
Hi.
I want to use your js solution. I need to redirect to same path but on mobile site, not to base mobile site. How can I do that?
I means www.domain.com/dir3/ [redirects to] m.domain.com/dir3/
Best regards
If I understand your question correctly, that you are redirecting to a mobile version of the content in dir3 on m.domain.com, then, in theory, the above steps as written should still work as expected.
Why not have the mobile version as the default and redirect desktop visitors to a desktop version. Its unlikely that desktop users would want to view the site as a mobile device. Mobile users can then follow a simple link from mobile to desktop.
Hello Brett,
Thank you for contacting us. Yes, that is definitely a viable options, but I recommend making your website responsive, which means it adjusts and fits to most devices, mobile and desktop.
Thank you,
John-Paul
Thank you so much, you saved my life!
Used the JavaScript code and it works!
Thank you, thank you, thank you.
This is why I love the internet!
I read very carefully many comments and tried many code script solutions without luck
My question is simple regarding the redirect
Imagine that I have a website www.company.com
Its a mobile friendly page BUT i want the user which enters from a smartphone to redirect to www.company.com/blog which shows again many articles, (same site). Ok I’ve done it BUT, when i redirected there, and press MORE to read an article, it redirects me back to www.company.com/blog as before, so I can’t read the article at all. Some problem occurs when a visitor comes lets say from his mobile reading facebook to a specific article on the site, the code will trigger that and will redirect to www.company.com/blog and its frustrating again without reading the article at all.
There is NO extra url like m.company.com etc, but a same blog page of articles within the website. Haven’t found any solution yet. Everything tried either refreshes again and again the site or the problem I described above.
Hello Nikos,
Sorry for the problem with the site redirect. You need to look at the link that you’re using when clicking on MORE. Whatever that link is, it’s being re-directed when people click on it. You will need to build an EXCEPTION for that link so that your other re-direct doesn’t affect this particle link. We do apologize for no being able to provide code, but we do hope that this points you in the right direction to solve the issue.
If you have any further questions, please let us know.
Kindest regards,
Arnel C.
Mr. JacobIMH
It will not viewable desktop version on my mobile while i am pasting that code…. what i want to do plzzz help me
Hello Gobi Jmp,
Sorry for the problem with the code. Can you please provide detail on what you have done to add the code that Jacob has provided? We’re not sure exactly what you have done and what kind of problem that you are having. If you can please give us details and a URL, then we can investigate further.
If you have any further questions or comments, please let us know.
Regards,
Arnel C.
In what file do you have to place the code? Where is the head section of the website code? P.S. I’m using wordpress.
Since you are using WordPress, your site should already be mobile friendly. This is because the latest versions of WordPRess are “Responsive” by default.
If you still want to redirect, I recommend using a WordPress plugin instead of hard coding a redirect.
Here is a link to our full guide on Adding HTML to a WordPress Page/Post.
hi there, anyone can help me? I have to redirect my old post that use www.mydomain.com to www.mydomain.com/dir
I use .htacess but some of my post use mobile url like mydomain.net/xxxx.HTML?m=1 I tried to make some code in .htacess, but when I tested It was work, I can redirect use plugin in wordpress, but the problem is I plan didn’t install wordpress in my main domain, so the one and only I should use .htacess. please help.
Great Tip!
Thank you so much
Why would my web developer not know this? What should I do about it?
Hello Michael,
It’s not really a major problem but if you don’t like your developer knowing things such as this then you could always find another developer.
Best Regards,
TJ Edens
The only criteria should be screen size. Not the platform. On a large tablet, you want to show the full-featured site. On a PC with small screen (a phone, a netbook, or a wide screen in portrait mode) a narrow-screen setup is better.
Question – if a user access a page https://mywebsite.com is redirected to https://m.mywebsite.com … but if a user access another page https://mywebsite.com/example how can be redirect to page https://m.mywebsite.com/example ?
Thank you!
Hello George,
Thank you for contacting us. The .htaccess option above may be a possibility, have you tried any of the options described above?
Also, keep in mind if you are using CMS (such as WordPress, Joomla, Drupal) it is recommended to use a plugin, or extension.
Thank you,
John-Paul
please correct as i want to redirect desktop website for mobile user to mobile site…plz need ur help …
.htacces (file)
—
Options +FollowSymLinks
RewriteEngine on
#Local
#RewriteBase /hyundai-saudiarabia/
#Server
#Check for mime types commonly accepted by mobile devices
RewriteBase /
RewriteRule ^arabic/ar/cars/(.*)$ /arabic/ar/index.php?car_name=$1 [NC]
RewriteRule ^arabic/ar/commercial/(.*)$ /arabic/ar/index.php?car_name=$1 [NC]
RewriteRule ^arabic/ar/suv/(.*)$ /arabic/ar/index.php?car_name=$1 [NC]
RewriteRule ^en/cars/(.*)$ en/index.php?car_name=$1 [NC]
RewriteRule ^en/commercial/(.*)$ en/index.php?car_name=$1 [NC]
RewriteRule ^en/suv/(.*)$ en/index.php?car_name=$1 [NC]
RewriteCond %{HTTP_ACCEPT} “text\/vnd\.wap\.wml|application\/vnd\.wap\.xhtml\+xml” [NC]
RewriteCond %{REQUEST_URI} ^/$
RewriteRule ^ https://www.hyundairetail.com%{REQUEST_URI} [R,L]
Hello Raj,
Sorry for the problem with your .htaccess file. Providing programming support is unfortunately outside the scope of our support. If you’re unable to resolve your .htaccess code, then it’s recommended that you speak with a developer/programmer concerning the problem. We did review your code and did not see anything that was obviously wrong. You may want to consider using the Javascript solution as opposed to the .htaccess option. Apologies again that we can’t give you a direct answer.
If you have any further questions or comments, please let us know.
Regards,
Arnel C.
i want to know to the name to use in saving the .htaccess file
Hello collins,
Thank you for contacting us. You should just save the changes to the .htaccess file without renaming it. This means it should remain named .htaccess.
Thank you,
John-Paul
after login the user in mobile its goes to some other website.where i give the js code
Hello meenakshi,
You would place your javascript at the top of the pages you wish to redirect.
Kindest Regards,
Scott M
Hello Debbie,
Thanks for the question about adjusting the script to accommodate small monitors. We’re not sure what monitor sizes you’re trying to support. Unfortunately, the best way to determine would be to experiment with the sizes and see if it works for all the different sizes you need to support. We’ve tested only as low as 800 pixels, and this was done with only the few different monitor sizes that we had available to us.
I have also seen this kind of issue handled through CSS. Check out this post as it may provide another solution for you.
Apologies that I can’t provide you a direct answer on this issue. I hope this helps to answer your question, please let us know if you require any further assistance.
Regards,
Arnel C.
Thanks, TJEdens,
It did work on the ipad as well as the iphone after I changed the 800 to 1024, however, if 1024 worked I am certain 1050 would too.
The only issue I am having now is that some monitors in the building are still pretty small. Would like to how low I could take the number to match the largest ipad screen to cover most devices without taking the chance that a monitor might still be small enough as well.
#getwiththetimeswhostillhasasmallmontior
I used the original code posted above to redirect to our mobile site and it worked perfect for the iphone, however not the ipad. Changing the screen width to 1024 made it work on both.
<script type=”text/javascript”>
<!–
if (screen.width <= 1024) {
window.location = “https://m.domain.com”;
}
//–>
</script>
Hello Debbie,
So it works on your iPhone but not the iPad. Try lowering the number to like 1050 and see if it works on the iPad then.
Best Regards,
TJ Edens
I am not using a CMS … it’s an html site.
When it stalls, it just goes to a blank screen and says domain.com at the top. I have uploaded it to the back of my site to see how it works but wasn’t sure if they had to purchase the m.domain first. Basically, that’s just like you would your normal domain, correct? It can all host together. Sorry to sound ignorant but I haven’t done mobile as of yet. It’s my first go at it.
The index url is https://talmagedesign.com/schwartz/ where it is housed now while I’m figuring this out. Thanks.
Hello taldesign,
If it is an html site, then making it mobile friendly instead of having a separate mobile version is much more desirable, both for design-maintenance as well as Google. However if you wish to use a separate m.domain.com then you simply need to create a subdomain of m.domain.com. It is part of the man domain so it does not need to be registered separately. It does need to be created on the server however as it will need to point to its specific directory.
Once all that is in place (along maybe with ‘hello world’ test index page in the m.domain.com) you should see it work correctly.
Kindest Regards,
Scott M
Hi there. Thanks for the tips! This is my first time doing a site redirect. My client has not yet obtained the m.domain. I’m trying to test using a regular domain with the accurate file name but am not getting anywhere. It stalls going to domain.com. Thoughts?
Hello Taldesign,
Thank you for contacting us. If you are using a CMS (such as WordPress, Joomla, Drupal, etc.) I recommend using a plugin to create the redirect. This reduces the chances of existing rules interfering with the one you are adding to your .htaccess.
We are happy to help you troubleshoot further, but will need some additional information. Do you get an error when it stalls?
How are you testing, without the m.domain yet?
Please include any additional information that will help us replicate and test your site.
Thank you,
John-Paul
www.dailygeopakistan.com
on laptop and computer its ok but on mobile and tablets its go to one side and not run good kindly provide any solution i alreasy used your codes
Hello Gill,
Apologies for the problem with your website. We unfortunately do not provide assistance for re-coding your site for mobile use. You may want to consult with a developer or website designer for further help. Check out Google’s guide for Mobile sites for an example of what’s needed to make your website mobile-compatible.
If you have any further questions or comments, please let us know.
Regards,
Arnel C.
I know this is old and I am sure that the link issue was figured out, but why didn’t someone suggest using cookies and saving a value that can be used to differentiate between desktop and mobile?
thank for reply
Hello!
thanks for sharing valuable information, but I mixed up a bit. I have installed redirection code on my main website example.com to mobile version of it https://adheap.example.com/
I tried to add code snipet to my mobile version in dashboard. But still it doesn’t redirect to main website from mobile version.
Please, help
Nataliya
Hello Nataliya,
Thank you for contacting us. As a test, have you tried adding the code to the top of your .htaccess file?
Also, as a test, try renaming your .htaccess file, then creating a new one with just the rule you are adding.
Thank you,
John-Paul
Hi,
This may be a stupid question(s), so apologies. But do you create a whole new file for your .m code, or can this be in with your code for your main site? Also, do you have to buy, m.domain.com, or does that come with www.domain.com. Finally, if you do have to create different files for your mobile site, do they share the same hosting and folder within your hosting, as your normal site.
Many thanks
Hello Ian,
It’s a good question. The answer is – “it depends…” If your site is small and you have one hosting service with only a little traffic, then you can keep everything in one place. If you have a lot of people hitting your site, or your site requires a more robust service for reasons of function or support of an online application, then you may need to have a different location for your mobile site (or your main site).
I hope this helps to answer your question, please let us know if you require any further assistance.
Regards,
Arnel C.
Hello Ian,
It’s a good question. The answer is – “it depends…” If your site is small and you have one hosting service with only a little traffic, then you can keep everything in one place. If you have a lot of people hitting your site, or your site requires a more robust service for reasons of function or support of an online application, then you may need to have a different location for your mobile site (or your main site).
I hope this helps to answer your question, please let us know if you require any further assistance.
Regards,
TJ Edens
I have a website chattercreative.com which points to a mobile version which was created at 414px. Google wants a version for small screens… So I made a version at 320px. But can’t get the Google mobile bot to detect it. Any help that I could get from the community would be great:)
https://chattercreative.com/mobile/320/320_mobile.html
<script language=”javascript” type=”text/javascript”>
<!–
if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/Android/i)))
{location.href=(“https://chattercreative.mobi”);}
–>
</script>
Hello Matthew,
I would suggest using this as it will apply to all mobile devices.
script type=”text/javascript”
if (screen.width <= 699) { location.href=("https://chattercreative.mobi"); }/scriptBest Regards, TJ Edens
Can my load balancer will be able to identify, if there is any request comes from a mobile or tab so that will route to a different web server.
Regards
-Amit
Hello Amit,
These days, responsive websites are created for purpose of handling mobile or non-mobile websites. This prevents the development of separate code just for a mobile site. It’s not that this kind of thing can’t be done, but you will require a programmer/developer if you are unable to put the code together yourself. This is unfortunately not something we can provide a direct solution for you. You can use the code provided in our tutorials, but modification of it for your purposes will require a developer or programmer.
If you have any further questions or comments, please let us know.
Regards,
Arnel C.
what will we do if mobile resolution more than 800px
packersmoversworld.in
If a device has a resolution larger than 800, then it will use the normal site. If you wish for all mobile devices to display the mobile site then you will need to go by device type instead of resolution. There are many examples above for that as well.
Kindest Regards,
Scott M
<script>
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile/i.test(navigator.userAgent)){
if(document.URL !=”mob.error.htm”)
{
window.location =”mob.error.htm”;
}
}
</script>
There is the code that belongs in the page (substituting your mobile page file name or URL for mob.error.htm)
Mob = mobile
error.htm = bad link I can search for on my drive to make sure that the code has been changed for all pages.
This code belongs in the mobile-ready page:
<meta name=viewport content=”width=device-width, initial-scale=1″>
Hello Scott,
Thanks for your reply. I’ve searched in my server public root directory, but didn’t get .htaccess file. But I tried .htaccess process by creating a .htacces file and inserting code. That code works but now I am getting another problem. The problem is I have another two domains in same server and all other domains are redirecting on 1 single mobile site because of root .htaccess file.
Hello all,
I am using java script code to redirect my main site to mobile version site, code is: