Hirarchie on Mobile
-
Hey! From left, to right in desktop view, everything is stacked up on top of each other in the phone view by default. Theres no way to change that behaviour.
-
@arminunruh oh ok.. shame. but thanks anyway!!
-
@arminunruh so i'm trying to do something like this:
window.location.replace("http://idansher.com/mobile/");
but it's somehow doesn't work. do you know why? or there is another way to do it?
thanks a lot!
-
Hey!
Can you explain what happens? "somehow doesnt work" is a bit vague -
Does nothing show up? Or does it just stay on the same page? If you like you can pm me the login data of your site and I can take a look.
-
Ok, well you did put your script in the mobile css field. However, that's javascript and it wont execute in a <style> tag.
I put this into Lay Options -> Misc Options -> Custom <head> content:<script> var isTouchDevice = navigator.userAgent.match(/(iPhone|iPod|iPad|Android|playbook|silk|BlackBerry|BB10|Windows Phone|Tizen|Bada|webOS|IEMobile|Opera Mini)/); if(isTouchDevice){ if(window.location != "http://idansher.com/mobile/"){ window.location = "http://idansher.com/mobile/"; } } </script>
This will redirect to the /mobile/ page when you are visiting the site with a touchdevice.
I think the better solution would be to layout your projects so the headline, image and description all follow the same order, that when stacked on top of each other in the mobile view it's logical.
Once you did that, then you can use the x-offset functionality (Elements with Offsets – http://laytheme.com/how-to-use.html) to offset your elements in a way that they switch positions. Remember, you won't actually drag and drop around the elements to change their order, you will only use x-offsets to do that.
Because in the mobile view, x-offsets are not used, you will still have the logical order in mobile view.
-
wow @arminunruh thanks a lot thats great!!
-
Hey Armin,
I'm highjacking this thread because I came across a problem I couldn't wrap my head around.
I want everyone that visits my site to be automatically redirected to a certain page that is not my standard desktop front page. So I tried your code you posted above and it works fine. It's just that it obviously applies the redirect to every link on that "mobile front page". So let's say I click the link to my "info" page it takes me back to the "mobile front page" I set the redirect to. Is there any chance to apply the redirect only on the front page (so e.g. if some enters via domain.de but NOT if someone enters via domain.de/info). Or is there a way to include multiple URLs that get checked by that JS string?
Thanks, man!
Best regards,
Dennis -
Hey dnz, hmmm how about this?
<script> var isTouchDevice = navigator.userAgent.match(/(iPhone|iPod|iPad|Android|playbook|silk|BlackBerry|BB10|Windows Phone|Tizen|Bada|webOS|IEMobile|Opera Mini)/); if(isTouchDevice && window.location == "http://idansher.com"){ window.location = "http://idansher.com/mobile/"; } </script>
So here you would only go to http://idansher.com/mobile/ if the exact url you are on is "http://idansher.com"
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it