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!

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.


Hey Mark, it looks like for the Credit Repair Affiliates Mobile URL is spelled correctly in your script, but the actual URL has a typo: http://unbouncepages.com/credit-repair-affilates-mobile/



If you go to the Page Overview of the mobile page, you can change the URL and correct “affilates” to “affiliates” and it should be good to go.


The Credit Repair Evaluation is working correctly for me, so if you’re still seeing issues, you may need to clear your cache.


Your awesome Quinn.

Thanks for repeating yourself.

I guess I was too tired to understand you the first time 😉.

Works perfectly now. Thanks a million!


Glad I could help, Mark. Cheers!


Hello,

we use the script with a 3 page solution. One page for redirect to desktop or mobile.

I got now the information that the redirect is not working in some cases.

One case are Lenovo Tablet with android system - the stock at the redirect page.

We loose conversions now - please try to help us quick!


regards


Hi Wilhelm. Please check your email Ð I replied to your ticket a little earlier.


For the benefit of everyone else: the scripts in this post won’t treat tablets as ‘mobile’ devices because they typically have screen resolutions comparable with desktops. For more background, see my reply above:



Will you please run down the street with balloons and confetti announcing this feature to the world and tagging me @prestonbates on twitter when you launch? Thanks in advance. One love


The UnBounce script goes above the Google Universal Analytics snippet in the Head, right?


Another question…with this “three-page-solution,” thinking of the funnel, how should we structure our parent page in contrast to the mobile - desktop children? Is the parent page just a copy of either the desktop or mobile?


Hi Preston!


You got it, you’ll want to put the Unbounce script Mark references in the Head of the JavaScript manager. Then click “Done” and “Add” to separate the Google Universal Analytics snippet.


I’ve also tagged your account so you’ll be amongst the first to know when we’re ready to roll out Responsive Beta. And yes, I promise we’ll notify you with balloons and confetti.



Have you guys figured out how to automate this yet within unbounce? It would seem easy enough to just have a setting on your primary landing page that allows you to indentify the mobile version you would like displayed for mobile devises. If both landing pages are in unbounce it seems there should be a way to link them and eliminate the step of having us create the script. Is this in the works or been done yet?


Hi Greg - we haven’t worked on automatically adding the mobile redirection script to the app, but that’s because we’ve been working on responsive pages instead, which will allow you to have a desktop and mobile view for each page that will display automatically depending on a visitor’s browser viewport. We’re in Alpha testing right now, but we’re getting ready to move into a full beta soon. I’ve tagged your account so you’ll be amongst the first to know when that happens.


Thanks for this!

Just updated. As a side thing, any recommendation on how I could frame this in Google Analytics so it understands that mainpage directs to desktoppage or mobilepage?


Hey Mark


If you wanted to follow the flow in GA from the redirect page to the desktop/mobile page then I would place the GA tracking code on your redirect page as well. Be sure to place it before your redirect script.


Keep in mind that there’s still a risk that the redirect will happen before the tracking script has fully executed.


Hey Mark


If you wanted to follow the flow in GA from the redirect page to the desktop/mobile page then I would place the GA tracking code on your redirect page as well. Be sure to place it before your redirect script.


Keep in mind that there’s still a risk that the redirect will happen before the tracking script has fully executed.


Sure, some parralax backgrounds don’t work well on iPad with the way they are coded for unbounce. The parralax background either zooms right in and locks itself or stays static. Whereas it looks great on desktop, so I was trying to make two versions for better UX.


Hi Johnny, any way to fix it?


I meant for this comment:

“Keep in mind that there’s still a risk that the redirect will happen before the tracking script has fully executed.”


For example, currently, I track referrer data in the form submits. Since the form submit happens from desktop/mobile pages and they send in referrer data - I almost always see the referring URL to be that of the redirection page.


So I was wondering if this script is not fully executing?


Hey Mark - You could try to add a callback function to your GA script so that it waits for google to receive the page hit before redirecting.


Replace the following line in your GA code:


ga('send', 'pageview');


with this:


'hitCallback': function() {   
window.location = "http://www.google.com/" + window.location.search.replace(//g,'%20');
}
}); ```

swap out '[http://www.google.com/](http://www.google.com/)' with your redirect URL

Also I recommend adding your subdomain to your properties 'referral exclusion list' incase this is a small self referral issue

[https://support.google.com/analytics/...](https://support.google.com/analytics/answer/2795830?hl=en)

Perhaps one of these solutions will fix your referrals.

Hi Johnny,


Thanks for this!

Can’t add referral exclusion because that way I lose attribution to the main site when/if the subdomain forwards traffic over to the main site.


So I’m going to use the GA code. Only question is, I use Google Tag Manager and the container code is plastered all over the place. How do you suggest I add this particular piece of GA code just for the redirector page?


Hey Mark - Instead of inserting the GTM code I would go into your GA account property and grab the original analytics tracking code. Be sure to modify it the way I detailed above.


Thanks!


Hi guys,


Does this script include the AdsBot of Google that looks for mobile pages as shown here?


Hi Mark - Google AdBot mimics Safari mobile running on iOS, so it should redirect the same way as well.


Reply