November 30, 2012 at 5:32 pm #18275
I altered the design, and don’t want the responsive ( so not: ‘select page’) option.
I tried different viewport settings but either the ipad or the iphone does not display correctly.
What i want is for the website to scale to the width of the device and the option to zoom in.
There is prob. a setting in the css that prevents this, spend hours on it. help!December 2, 2012 at 11:06 am #98846December 3, 2012 at 3:21 am #98847
Can you post a link to your site? so we can check it further.
IsmaelDecember 3, 2012 at 8:13 am #98848
This is one of the websites that has this problem http://www.y u t r a i n.nl
Hope you know what is going on…December 4, 2012 at 5:47 pm #98849December 5, 2012 at 8:48 am #98850
I apologize, but I don’t understand what you mean by ” the option to zoom in.” I am picturing a magnifying glass over WooCommerce plugin shop item images but I think you meant something else?
You also write that you turned off responsive but you later speak of ‘scale to the width of the device’.
Looking at your site, I still see it is responsive. All the media queries seem to be there.
So we can better help you, could you show an example website that has such behavior.
NickDecember 5, 2012 at 9:28 am #98851
Thanks for your reply.
If you open at our website http://www.hotspotdesign.nl in iPad or iPhone you notice:
- when it loads it loads the width of the website in ‘device width’, so you see the website completely
- then the user has the option to zoom (also knows as pinch), so you can scale the website to be larger (zoom in)
Do you understand a bit better what i mean?December 6, 2012 at 6:03 am #98852
Make sure that when you go to the Them Options> Layout & Settings >Responsive Layout the option for that dropdown is set to “Fixed Layout”.
This will prevent the site from responding to the users browser or device size and will let an ipad/tablet zoom into the content.
DevinDecember 6, 2012 at 10:32 am #98853
It has that setting for one site. THe other site is the one of your other themes i used (not flagship) and does not has that option (only the option ‘boxed layout’). But both have the same problem.
Hop you know what is going on.December 6, 2012 at 4:41 pm #98854
Not all of the themes have the option to turn off the responsive design. For the one using Flagship you just need to simply turn the option off.
For the other, we’ll need to know what theme it is using specifically to go forward.
DevinDecember 7, 2012 at 8:02 am #98855
we did turn the option off in flagship but it is not working!
PLease help this very urgent, the website is allready live!
please email me julia [at] hotspotdesign.nl so i can email you the url (i cannot post it here)December 7, 2012 at 1:46 pm #98856December 9, 2012 at 2:00 pm #98857
Please provide us with a url in order for us to look at the changes you made to the code. So far we understand you customized the themes to partially remove the responsive aspect of the design and are experiencing issues with portrait / landscape transiton in mobile ios6 devies. If you would like please mail me the URL to usjahm (aaatttt) gmail (dddooottt) com
Sorry for the delay.
NickDecember 11, 2012 at 1:34 pm #98858December 11, 2012 at 9:37 pm #98859
I have nothing from you but your email asking if I received an email which I initially deleted until I saw this post. Your first email never arrived.
NickDecember 13, 2012 at 6:40 am #98860December 13, 2012 at 7:44 am #98861
Please resent Nick the url. Personally I’m unable to reproduce the issue with an ipad/ipod, etc. because I don’t own such a device. Flagship works fine on my Android 4.0 phone though. I’ll tag this thread for Nick.December 13, 2012 at 12:15 pm #98862
Thanks Dude! I am on top of this one.
As stated in email, you have one of your plugins injecting a second vieport meta directive on line 70 if you view source
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
in addition to the original which is on line 14
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1" />
You will need to edit the plugin that is doing that (i suspect the social plugin, as it is also throwing an error for using a bad google+ jquery ) and change the above meta tag so that the plugin just inject a single space ‘  ;’ (without the empty space between the single quotes.)
You will also need to edit your header.php file and remove the above viewport on line 14 of source (though its probably on a differnt line, should be easy enough to find) and delete it. Paste the line below in its place:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Just dont forget to put it inside
/* <![CDATA[ */
/*paste the code from url mentioned in previous sentence here */
/* ]]> */
Or you can use this plugin by Ben Wong , though I haven’t tested it, but it seems to be doing the same thing.
The topic ‘ipad/iphone viewport? page not displaying correctly’ is closed to new replies.