Forum | Appery.io

How can I make the same button link to one URL when in desktop mode and a different URL when in mobile mode?

My APP links to an external social network that must open in a separate browser window. On that social network is a large button in the header that links the user back into the APP when the user is done in the social network and wishes to return to the APP.

Separately, we also have a desktop website version. The desktop website also links to the social network. In this case, the large header button needs to link back to the desktop website.

So, here is the problem -- In both mobile and desktop mode, the exact same large header button must appear as the header (it is a limitation of the program we are using). Therefore, we need the same large header button to link to one URL in desktop mode (back to the website) and another URL in mobile mode (back to the APP).

Is there HTML code we can use on the large header button that will decide where to link based on whether the user is on a desktop website or on the mobile APP?

Thank you, as always, for your wonderful help.

Hi Aaron.

Please follow these steps to implement what you want:

1 Open deatination page (the page where your button).

2 Set your link with website URL (default behaviour).

3 Open Events bottom tab.

4 Create Page show Event with action Run javascript and populate it with following code:
pre

//Get if browser is mobile.
var isMobile = navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i);

//Create change link logic if it's from mobile browser.
if(isMobile){
//Change a link href.

 Appery("yourLinkName").attr("href", "http://yourMobilehref.com/"); 

};
/pre
Note you should change "yourLinkName" with your link component name.