Creating links to assorted web pages with dual URLs.

[dwappes]

HI:

 

I have a responsive web design with links to pages at another website, which is a site that is NOT mine. However, the pages at the other site have 2 different URLs. For example: (www.thispage.com/page-1.html or www.m.thispage.com/home.html, as a reference to a mobile page) . In other words, one link at the other site is for desktop viewers and the other link is for mobile users, but all links meant for desktop users are redirected and go directly to their home page (not to the mobile equivalent page).

 

If a user at my website clicks on a link to their website from a mobile device, they are clicking on a link meant for desktop users. But if the user is at my website on a mobile device, the other website redirects them to their mobile "HOME PAGE", thus requiring the user to navigate to the specific page FROM THE HOME PAGE OF THAT SITE.

 

[NOTE: I have the direct links to the specific mobile pages at the other site, but just don’t know how to give my mobile users the option to access them from a single click.]

 

I want my mobile users to be able to go directly to the specific page of the other site without having to navigate to it from the home page of the other site.

 

In short, if my user is on a desktop, they will go to the correct page. But if on a mobile device, they will go to the home page (not the specific page) of the other site and have to navigate to the specific page from there, which can be a real hassle.

 

Here is my question: Is there an inline html or javascript code I can add to each outgoing link that will take the user directly to the specific page I want them to land on if they are using a mobile device instead of a desktop?

 

For example: href = www.abcd.com/page.html (but if less than 800px) go to www.m.defg.com/page2.html.

 

Please keep in mind, my site is already responsive, so I do not need a redirect for my pages, as they are mobile ready. I just need to create redirect links to the pages of the other website if my user is on a mobile device.

 

Please help. Thank you.

Edited October 18, 2015 by dwappes

[MiWebDesign]

Try with server side Solution in PHP, if is Mobile you write the mobile link, else you write the normal link.

<?phpfunction isMobile() {return preg_match("/(android|avantgo|blackberry|bolt|boost|cricket|docomo|fone|hiptop|mini|mobi|palm|phone|pie|tablet|up.browser|up.link|webos|wos)/i", $_SERVER["HTTP_USER_AGENT"]);}?>

When you write a link, insert

<a href="<?php if(isMobile()){ echo 'http://mobilelink.it'; } else{ echo 'http://normal-link.it'; } ?>">My awesome link</a>

[davej]

You can change the visibility of the links in css with a media query.

[justsomeguy]

In Javascript, you can use the window.location object to check if they're on the correct site and redirect if not. Once you detect whether or not they are on a mobile device, you can check window.location.hostname to check which domain they're on. If they're not on the right domain then you can use the other parts of window.location (protocol, pathname, search, hash, etc) to rebuild the same URL on the other domain.https://developer.mozilla.org/en-US/docs/Web/API/Location