Zkk Zkk - 1 month ago 16
Javascript Question

How to redirect a "Desktop Desktop"?

My website have two versions. Desktop and Mobile version.

When the user access my website via smartphone, I point it to "Mobile version" -> "m.mywebsite.com".

To make it, I'm using the project called Mobile Detect

So far so good.

In "Mobile version" there is a button ("Switch to Desktop Version") that redirect to "Desktop version". The problem is that in "Mobile version", when I clicked in button "Switch to Desktop Version" it get in loop.

For example:

---> Button "Switch to Desktop Version" is clicked;

---> The page is point to "www.mywebsite.com";

---> The page finishes refresh;

---> Since the user is on the smartphone, the script is loaded again and the user is redirected to "m.mywebsite.com";

How I can solve this?

How I can redirect the user to Desktop version in smartphone?

My code:

<?php
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;
?>
<!DOCTYPE html>
<html>
<head>
<?php if( $detect->isMobile() ) : ?>
<script type="text/javascript">
window.location.href = "http://m.mywebsite.com.br";
</script>
<?php endif ?>
</head>
<body>
<div class="wrapper" style="height: 100vh; display: flex; justify-content: center; align-items: center; flex-direction: column">
<h1>MOBILE VERSION</h1>
<a href="http://www.mywebsite.com.br">SWITCH TO DESKTOP VERSION</a>
</div>
</body>
</html>


--------- UPDATE ---------

Thank's @Uriel, you could solve the problem. Now the page it's working like I want.

<?php
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf8">

<?php if( $detect->isMobile() && (!isset($_GET['force_desktop']) || $_GET['force_desktop'] == 'false')) : ?>
<?php if( $detect->isMobile() ) : ?>

<script type="text/javascript">
window.location.href = "http://m.mywebsite.com.br";
</script>

<?php endif ?>
<?php endif; ?>

</head>
<body style="padding: 0; margin: 0">

<div class="wrapper" style="height: 100vh; display: flex; justify-content: center; align-items: center; flex-direction: column">
<h1>DESKTOP VERSION</h1>
</div>
</body>
</html>

Answer

Set the address of the link

<a href="http://www.mywebsite.com.br">SWITCH TO DESKTOP VERSION</a>

To the address http://www.mywebsite.com.br&force_desktop=true.


Then, when checking for mobile, check also that this GET variable is false (or doesn't exist):

if( $detect->isMobile() && (!isset($_GET['force_desktop']) || $_GET['force_desktop'] == 'false'))

That way, the mobile will load only if there is no true force_desktop variable, and the user uses mobile.

Comments