Mobile themes not applying correctly

Latest Reply from Benjamin Lloyd at 2014-02-05 15:43:45
Hi there,

My activated theme no longer detects tablet mode correctly, so all mobile devices are presented with the smartphone view by default.

Any help?


Any updates on this? I would really like the tablet mode to work properly...
As I can see you have fixed the problem. How did you do it?
Hi Dave,

I've just re-checked on my iPad and as far as I can see the smartphone view is still showing, NOT the tablet view as expected. This problem is therefore unresolved :(
What version of iOS do you use?
iOS7 on an iPad 2.

What are you using to test?
Furthermore - I have now tested with the Hubspot marketing grader mobile preview tool and it also shows the smartphone view in both orientations - I cannot get the tablet mode to display on anything.
I'm not an administrator but I've been through a living $#@% trying to get my theme to work on mobile/tablet devices with zero support from the SMThemes people. They took the time to respond to an email stating that they don't offer support though free or for a fee lol.

Currently my site is 'ok' on a cell phone now and looks awful in portrait mode on a tablet. Similar to you, I didn't want a mobile site on a tablet. I do however have some clues to pass on as to how to view a 'desktop' version of the site on your tablet which will impact your phone as well. Within top.php, if you include the following code:

<meta name="viewport" content="initial-scale=1,maximum-scale=1,width=device-width">

It will force the site to appear in a normal fashion in landscape mode on your tablet and any mode on your phone; however, if you have a slider, as I do, it will not accommodate size wise while in portrait mode, consequently pushing the rest of the site off to the left side.

What I did with respect to the cell phone is added the WPTouch plugin to Wordpress, so that people can view a pretty basic mobile site on their phone or click to view the desktop version which is forced now with the viewport command. So you'll at least have the phone thing tackled and partially the tablet...the rest is yet to be discovered.
I posted this elsewhere - in response to my own inquiry but I'll post it again here. I finally got it working in portrait mode on tablets.

To begin, I commented out the line:

<!--<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/tablet.css" type="text/css" media="screen and (min-width:640px) and (max-width:1023px)" />!-->

within library.php.

This forced the tablet to view style.css for it's values and disregard the 'mobile' site parameters, which I didn't want showing on a tablet. From there, I created a section within style.css under the following:

@media only screen and (min-width:641px) and (max-width:1023px) and (orientation:portrait) {

as well as:

@media (max-device-width: 600px) and (orientation: portrait) {

I needed two @media control options since my site was a mess on smaller tablets such as the Blackberry Playbook - once again, in the portrait mode. The second @media addressed that successfully. Under each @media I needed different values to accommodate the various sized screens.

I intentionally didn't disable the mobile attributes for cell phones as it seems to work quite well as long as you don't use tables in your coding. In fact, I'm going to remove the WPTouch plugin as it's not required now that everything appears to be in order.
I'd like to get somebody to do this for me - negotiation Anybody?
Thanks for this Mel - I've only just seen your posts because I gave up on SMThemes ever providing proper advice.

I'll give your suggestion a go and see how it turns out....
Well I got as far as adjusting the @media entry in style.css and ran out of ideas...

What exactly did you enter under the @media directives Mel?

Leave a reply

Add codeAdd image