BullGuard Antivirus Sale - 60% Off with openElement !
Forum Home Forum Home >

openElement

> openElement General Discussion
  New Posts New Posts RSS Feed - Mobile Redirect Issues
  FAQ FAQ  Forum Search   Register Register  Login Login

Mobile Redirect Issues

 Post Reply Post Reply
Author
Message
krys.lemay View Drop Down
Newbie
Newbie


Joined: Apr 09 2020
Location: Boston, MA
Status: Offline
Points: 5
Post Options Post Options   Thanks (0) Thanks(0)   Quote krys.lemay Quote  Post ReplyReply Direct Link To This Post Topic: Mobile Redirect Issues
    Posted: Apr 09 2020 at 8:35pm
Hey guys,
Let me start by saying I in no way consider myself a web programmer but I know enough to be able to make a boring website for the audio company I work for. I have the site up and running but the mobile redirect is not working. 

I tried using the if screen in smaller than ### then redirect to www.website.com. The issue that I am seeing is that most smartphones and tablets have a high screen resolution like that of a computer so this is not working. I do not want to do the CSS way of doing things because that would require me to edit each page on the site to fit the rules.

I have a single mobile page that needs to be shown when on a mobile device but I can't figure out the best way to get the code to recognize the mobile device without looking at screen resolution or completely editing each page to be optimized for each type of device.

Any and all help would be GREATLY appreciated as they want this resolved ASAP.

Thanks!

Krys 
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 6194
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: Apr 09 2020 at 8:57pm
Hi krys

Can you give me a link to your site first?


Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 6194
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: Apr 09 2020 at 9:05pm
Are you aware of OpenElement's Edit Medias?
Back to Top
krys.lemay View Drop Down
Newbie
Newbie


Joined: Apr 09 2020
Location: Boston, MA
Status: Offline
Points: 5
Post Options Post Options   Thanks (0) Thanks(0)   Quote krys.lemay Quote  Post ReplyReply Direct Link To This Post Posted: Apr 09 2020 at 9:06pm
www.terryhanleyaudio.com

The mobile page I have set up is at www.terryhanleyaudio.com/Mobile.htm
Back to Top
krys.lemay View Drop Down
Newbie
Newbie


Joined: Apr 09 2020
Location: Boston, MA
Status: Offline
Points: 5
Post Options Post Options   Thanks (0) Thanks(0)   Quote krys.lemay Quote  Post ReplyReply Direct Link To This Post Posted: Apr 09 2020 at 9:08pm
I am aware of the edit medias but I'm trying not to go in an redo every page to optimize our desktop site for mobile usage. The mobile site is one long scrolling page (at the request of my boss). 

Ultimately my boss wants me to have the mobile redirect happen and tell the mobile page to automatically size to the device width to make up for switching between landscape and portrait mode on a mobile device.
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 6194
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: Apr 10 2020 at 3:08am
Ok,

Create a javascript source code on your main page and add the following code on it

function myFunction(x) {
if (x.matches) {
document.location = "https://www.terryhanleyaudio.com/Mobile.htm";
}

var x = window.matchMedia("(max-width: 700px)")
myFunction(x)
x.addListener(myFunction)



Edited by Hobby001 - Apr 10 2020 at 3:09am
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 6194
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: Apr 10 2020 at 3:09am
You can repeat this code on each of your pages and modify the location parameter

Edited by Hobby001 - Apr 10 2020 at 5:46pm
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 6194
Post Options Post Options   Thanks (1) Thanks(1)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: Apr 10 2020 at 3:10am
You can change the 700 pixels limit to your preferred set-up
Back to Top
krys.lemay View Drop Down
Newbie
Newbie


Joined: Apr 09 2020
Location: Boston, MA
Status: Offline
Points: 5
Post Options Post Options   Thanks (0) Thanks(0)   Quote krys.lemay Quote  Post ReplyReply Direct Link To This Post Posted: Apr 10 2020 at 4:22pm
That worked! Thank you!! You just saved me so much time. Now I just have to figure out why the mobile page is coming up not scaled to each device. 
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 6194
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: Apr 10 2020 at 5:45pm
It is not responsive by design. 

You have to use responsive design techniques to get it.


Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

This page was generated in 0.047 seconds.