No iOS Pinch to Zoom on my RW Theme Based Sites


(Bruce Kieffer) #1

I cannot use iOS pinch to zoom on any of my RW created theme based sites. Why is that? Any ideas? Is there a setting in RW?


Responsive Theme not zoomable on mobile device
(Rajat Bagga) #2

Hello @bruce from my knowledge, its nothing to do with RW created themes but its to do with the responsive nature of any website. I mean to say any responsive website would not have this (pinch to zoom) functionally in any mobile device browsers unless you create a mobile app and render the data into the mobile app to zoom it. I may be wrong but i did some analysis in past on this issue/questions.

Your best alternative is to have a Magnifont stack from @joeworkman if you like to give the functionality to increase the size of the font in your website

Hope this helps,

Cheers,
Rajat


(Doug Bennett) #3

@bruce I don’t have a problem using pinch to zoom on my responsive sites. Using foundation theme.
You’d have a url?


(Bruce Kieffer) #4

Just to clarify, this is not a deal breaker for me. I feel my sites look fine on mobile devices. Just curious why the pinch does not work.

http://vectorworksexchange.com
http://www.lash-it.com
http://kcfi.biz/test/

I checked these sites of mine and they do “pinch”. Must be theme related. Both of these use Volcano.
http://sfri.biz
http://thriftycabinets.com


(Brad Halstead) #5

@bruce

On the two working “pinch to zoom” sites your "viewport meta tag configuration is different than on your non-working “pinch to zoom” sites.

Perhaps that has something to do with it.

Brad


(Andrew Tavernor) #6

It is because the theme is setting user-scalable to false in the viewport meta tag in the head section of your code. I’m sure the theme developer had a good reason for this. Indeed since the recent iOS update that supports split screen apps on certain devices, you may see it even more as a fix for unwanted zooming of pages.

`meta “viewport” content=“width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0”


(Andrew Tavernor) #7

@Turtle You can obviously type faster than me :slight_smile:


(Brad Halstead) #8

@tav :slight_smile: maybe, but you’re more thorough :wink: Good job!

Brad


(Mike) #9

I’m having the same problem / issue as Bruce.
Viewport was mentioned by Tav, but I can’t for the life of me find any such setting.

Here’s the test site I want to achieve this on:

Thetford Christians Together

Still a work in progress exercise, and using Foundation.

Any ideas would be gratefully appreciated.


(Brad Halstead) #10

@mike_hamilton

It’s a meta tag you have to manually add to the head section of the site to be global.

<meta "viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=1">

Some themes and/or RapidWeaver add the base meta data tag of:

<meta "viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">

Which means it is not scalable.

initial-scale=1.0 - scale is actual size to fit screen based on device-width and device-height
user-scalable=0 - not scalable, 1 - is scalable
minimum-scale=1.0 means that it will not shrink any farther than currently available
maximum-scale=1.0 means it will not zoom any farther than currently available

You can reset max and min to .5 and 2.0 accordingly or leave them off for no control.

Hope that helps.
Brad