Mobile Skin Redirect

I built a skin for myself yet its not mobile friendly at all.

I have been trying to think of a solution to work around this with out having to create more work for myself.

redirecting to a seperate mobile_index page wasnt a very good solution for me. Every page would require a redirect.


I was hoping I could set one of the Jamroom skins to use for mobile devices.

Is there a way I can set up the site when viewed by a mobile device to use skin2 as the default skin for mobile devices and skin1 for desktops and others?

At first I thought this would be no problem. I can just call a redirect to mobile.mysite and install a second copy of Jamroom with the mobile ready skin. However the /data/ on site2 would not be the same as site1.

Then I realized a better way and probably the way to do this would be change the setting in the jrCore to set as skin2 when the index was hit with a mobile device. Any ideas on how I can do this or is there a better way to achieve this?


updated by @developer-networks: 04/13/14 08:20:57AM

You would need to do it in a module I would think.

Take a look at the admin skin module. It allows one skin to be used in the admin area while another is used on the front end.

Same concept.

@b360 - what if you do something like:

If mobile device is detected, send them to m.domain.com - and there you have your separate css and skin templates?

That was how i thought i could do it myself when i first looked in to this. However mobile.mysite.com would be its own seperate entity and would require the jrCore to be installed to it. So it would have its own /data section and it wouldent correlate with mysite.com.

I have been wondering how to make it work for a few days now. Might need a module like michael was saying. So i could have multiple installations of jamroom use one database and media folder.

If i hooked that up i could then send them to mobile.mysite.com and have no worries. This might be something Brian would have the best lead on because it involves the core.

The admin skin is only controlled by just a div id i believe. which brought me to look at the core.


And i found that I have this varible 'jrCore_active_skin' which could allow me to control this but it would would effect both desktop and mobile when set.

Sooo... I think what I need to do here is just create a module that holds and uses a varible like 'jrCore_active_mobilskin' but how can I tell the routing system to use that varible only for mobile devices?


updated by @developer-networks: 03/05/14 05:05:37PM

CSS 3 has you covered.

Just make the skin modern (mobile first), forget multiple sites and cluster servers (complicated, unnecessary, administrative nightmare). Check out css 3 media queries and jr5 device detection functions.

Jamroom gives you a working mobile site out of the box.

If you don't break it, you won't need a custom cluster server module to fix it.


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

I hear ya Steve. I should had thought of mobile first however I ended up with something that works more like an app. Uses the power of the desktops browsers and faster internet. So it really will never work on mobile. It does work on Ipad / epad devices. But a little phone is out of the question currently and a lot of people use a phone to visit the site.

So I felt the absolute best solution would be just make a 2nd skin for mobile. A stripped down version of the website.

To use a seperate skin for mobile I think its just a line of code added to the router.php for a solution.


However Im still looking in to If there is a better way that I am unaware of yet to tell Jamroom "override the active skin for mobile devices only".





updated by @developer-networks: 03/05/14 05:27:07PM

I agree, some things will not work at all on mobile: The screen is too small.

And that's what the media queries and device detection are for - making things "not there" on the desktop. (or showing different things to people with screen space and processor)

You only need one website for that though, it's more complicated enough as it is without having 2 websites to take care of.


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

Your right. Im suggesting It would be cool to have a second skin controlling the mobile device in my case.

That way I could make all pages for a mobile device on that skin and when they updated content it goes to the same place. the same site and data but utilize a 2nd skin directory.

Not leaning to 2 servers or domains as a solution here. But is there a way to use a second skin for mobile devices on the same jr installation.


updated by @developer-networks: 03/05/14 06:06:38PM

Ah touché! That's right.