Hirarchie on Mobile

idanshe

Dear Armin,

I have another question regarding the order of the hirarchie in the mobile version. Is it possible to give a specific order how to show on mobile? for example:

carousel 2. Title 3. text
thank you!

arminunruh

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.

idanshe

@arminunruh oh ok.. shame. but thanks anyway!!

idanshe

Hey Armin, is it possible then to make a page which will automatically direct you to it if you surf on mobile or a tablet?
THANKS!!

idanshe

@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!

arminunruh

Hey!
Can you explain what happens? "somehow doesnt work" is a bit vague

arminunruh

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.

idanshe

I land on the same page

arminunruh

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.

idanshe

wow @arminunruh thanks a lot thats great!!

dnz

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

arminunruh

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"

dnz

Hey Armin,

Perfect! Thanks a ton!

Best regards,
Dennis