Skip to main content

Hi everyone! We’ve seen a fair bit of confusion about how best to redirect mobile visitors to a mobile-optimized landing page recently, in particular when you have URL parameters to think about, or you’d like to redirect desktop visitors to a separate page too. Here are a couple of scripts that should simplify this.


Redirect to mobile


Use this version of the script if you want to redirect just mobile visitors, and leave desktop visitors on the current page.


<script>



  (function(){

  

    var userAgent = navigator.userAgent || navigator.vendor || window.opera;

    var mobile = (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(userAgent)||/1207|6310|6590|3gso|4thp|50p1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez(|4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-4a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10|0-2]|n20|2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-(|1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-02-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|540-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(userAgent.substr(0,4)));

  

    // Your mobile URL

    var mobileURL = 'http://go.yoursite.com/mobile-page-name/';

  

    if (mobile) {

      window.location = mobileURL + window.location.search + window.location.hash;

    }

  

  })();



</script>

Redirect to mobile or desktop


Or use this version if you’d like to redirect desktop visitors to another page as well.




<script>

 

 (function(){

 

   var userAgent = navigator.userAgent || navigator.vendor || window.opera;

   var mobile = (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(userAgent)||/1207|6310|6590|3gso|4thp|50t1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez(l4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-|a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10w0-2]|n2022-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-(11-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-|2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5k0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(userAgent.substr(0,4)));

 

   // Your mobile and desktop URLs

   var mobileURL = 'http://go.yoursite.com/mobile-page-name/';

   var desktopURL = 'http://go.yoursite.com/desktop-page-name/';

 

   if ( mobile ) {

     window.location = mobileURL + window.location.search + window.location.hash;

   } else {

     window.location = desktopURL + window.location.search + window.location.hash;

   }

 

 })();

</script>

For either script, you just need to click the Javascripts button in the bottom left of the page builder, select ‘Head’ for placement, paste the script in and republish the page. Make sure you change the values of mobileURL and/or desktopURL to match your page URLs.



The scripts use much more robust mobile detection than before, and will pass on all URL parameters and #anchors.


We owe a big thanks to Markus Stefanko, who adapted our older script to use detectmobilebrowsers.com detection and pass along #anchors.


This is definitely a workaround so please bear in mind that you may experience issues with visitor/view/conversion tracking, depending on which version of the script you use. If this is something you’re concerned about, please contact us at support@unbounce.com, and we’ll try our best to point you in the right direction.


Let us know what you think!

This is a much better redirect option than the previous suggestions using meta refresh scripts and regular redirect javascript. The experience is far improved since the original page doesn’t load before redirecting.


However, the view statistics of the original page are still impacted. Is there any way around that?


Thanks,


Amanda

Hi Amanda - If you use the mobile only redirect, that will affect your desktop stats. The “to mobile and desktop” redirect code will let you keep your mobile and desktop stats separate though.


If you create a third page with just the mobile and desktop redirect code on it, you can direct people to that URL. They’ll then be pushed to either the desktop page or the mobile page. You’ll get the double counts on the page with the redirect, but the stats for your individual mobile and desktop stats will be kept separate,

Hi Amanda. Please see Quinn’s reply below! I’d also like to add that either version of this script (and the older one too) will perform the redirect without waiting to load the page, as long as you ensure the script placement is ‘Head’. Thanks!

Hi Quinn and Mark,


Thanks for your replies. My comment was regarding the retention of original page stats after redirect, which doesn’t seem possible.


To illustrate, we had a webinar registration page in Unbounce. After the webinar took place, we posted the recording and slide deck to a resources page on our website. I’ve redirected the registration page to the new resources page, but the views on the registration page continue to climb, impacting our conversion statistics for that design.


It’s not “the end of the world”, but it would be great to have an option where the original page (in this case, the registration page) stats retained for future analysis on the most effective designs.


Thanks again,


Amanda

Hey Amanda - In cases like this the best approach is to unpublish and set the webinar registration page to a different URL. Then create and set a new page with only the redirection script to the original registration URL. This should prevent any further impact to your original registration page stats.

Thanks - working well so far.


For others: I copied my main page to create a desktop variant, and then create a mobile page from scratch. With those setup, clean, tested, and published, I turned my main landing page into a redirect-only stub and recording my stats previous to the split. Overall didn’t take very long and it appears to behave as intended.


Looking forward to more integrated support mobile support in the future.

Is there a way to do this without losing UTM parameters at the end of the URL?

Hey there! The script will automatically carry over the UTM parameters to the redirected link

Hi Quinn, I’m using the “to mobile and desktop” approach on a few pages and I am a little confused about why the total visitor count is not adding up. To clarify, I have set up 3 pages:



I’ve got the redirect script on landingpage.com and it is showing 8 unique visitors. landingpage.com/mobile is showing 1 unique visitor and landingpage.com/desktop is showing 2 unique visitors for a total of 3 uniques.


What happened to the other 5 that hit landingpage.com?

Hi Frank - I took a look at your pages and looked at the traffic coming to the redirect page. Four of the hits were bots, so they would have either disabled the redirect or abandoned the page after it fired and it looks like the other unaccounted for hit was from the Twitter for iPhone browser. The last one is likely someone who clicked out from Twitter and then immediately backed out to their timeline again.

Got it thanks Quinn.

Happy to help, Frank. You’ll likely see some discrepancy going forward for the same reason, but if you do ever want us to take a look, just reply here or shoot us an email at supportATunbounce.com and I can take a look again to make sure everything’s accounted for.

Wouldn’t it be a better approach to design for mobile first with progressive enhancement, or to just design responsively?


I think the requirement to design two different pages is creating extra work where it’s not required.


Tim

Hi Tim - Completely agreed. This is just a workaround and not meant to be an ideal solution. We’re in the process of building responsive page design and are running a closed alpha test with a handful of customers right now. We want to create a much more elegant solution for you that isn’t any extra work.

I’m really struggling with the concept of these solutions. Let’s assume I create 3 pages: a routing page, a mobile page and a desktop page. Won’t our quality score be negatively affected by the “routing landing page”?


I don’t see a clear solution without significant downsides and this is posing a major issue for us.

Hey Christopher - A redirect should not have a affect on your Quality score. See this Adwords forum post below:


https://www.en.adwords-community.com/t5/Advanced-Features/Page-Redirection-Will-effect-to-quality-sc…


The summary is Google follows the redirect to the actual pages.

Hey everyone, any chance Unbounce can provide me with a third code, one that redirects ipad users to an ipad sized page?

Hi Mitch! Great question.


Right now, the scripts above don’t treat tablets as mobile devices Ð so they won’t be sent to the mobile version.


We’ve found that this is what most people want.


Our templates are between 900 and 1000px wide, so this makes them pretty ideal for tablets. For example, an iPad in landscape mode is 1024 effective pixels wide, so it fits perfectly. In portrait mode it’s 768px Ð so this means your page will appear ‘zoomed out’ slightly, but likely not enough to make any text unreadable.


Mitch, can I ask for some more details about your thinking behind redirecting tablet users to a third version of your page? We don’t have a script for it at the moment, so we’d like to look into this some more.

Doesn’t seem to work on windows phones

Hey there,


Our mobile redirection script should work across all mobile devices, including Windows Phone. Would you be able to let us know exactly which model/software you’re using? I’m going to go ahead and follow up with you directly via email to see if we can help troubleshoot. Hang tight!

Thanks Justin, but I figured out the issue. The person I had tested the landing page before I could make sure the java script showed in the Header. This is resolved due to user error 🙂

Hey Unbounce!


I’m using this URL in a custom menu on Wordpress for my clients affiliate landing page…


http://unbouncepages.com/credit-repai…


I’m redirecting to this URL for mobile users.


http://go.unbouncepages.com/credit-re…


I can’t seem to get it to work…


Even tried redirecting to another URL not on unbounce servers with no luck.


On old Android Evo v2.3.5 doesn’t redirect.


On iPhone 5 says “page not found on server”?


Use the version of the script that redirects just mobile visitors, and leaves desktop visitors on the current page.


Obviously I’m not doing something right.


Any help would be appreciated.

Hi Mark,


The set-up is 90% of the way there. The only thing you’ll need to change is your mobile URL. Rather than at go.unbouncepages.com… you’ll need to link to:

http://unbouncepages.com/credit-repair-affilates-mobile/


The URL of your mobile page will display near the top-left of the screen on Page Overview:


Once you make that change, the redirect should be up and running.

Quinn,


Thanks for the quick reply and for pointing that out.


I made all the necessary changes but it’s still not working.


This is a screenshot from an iPhone 4…


This is a screenshot of the pages screen showing the 4 pages we have created so you can see the URLs. 2 desktop versions and 2 mobile…


This is a screenshot of the script on the affiliates landing page…


Lastly, this is a screenshot of the script on the credit evaluation landing page…


Thanks for the help. I appreciate your time Quinn.

Thanks for the quick replay Quinn and for pointing that out.


I made all the necessary adjustments but unfortunately it’s still not working.


This is a screenshot or the “pages” showing all 4 landing pages so you can see the URLs.


This is a screenshot of the script on “credit-repair-affiliates” so you can see the URL I’m forwarding to…


This is a screenshot of the script on “credit-repair-evaluation” so you can see the URL I’m forwarding to here…


I really appreciate your time Quinn. I hope you can shed some light on this for me.

Reply


Terms & ConditionsCookie settings