Jump to content

Archived

This topic is now archived and is closed to further replies.

jmad

Pinch Zoom on pages

Recommended Posts

jmad

My mobile sites created with DMS are not pinch zoomable and I would like for one them to be.  I know this has something to do with maximum-scale=1 meta name ="viewport".

 

How would I go about making mobile zoomable?  I think I would need something like <meta name="viewport" content="width=device-width, initial-scale=1">  but I'm not sure and not sure where to add something like or if there is a setting in DMS to make zoomable.

 

 

Share this post


Link to post
Share on other sites
James B

Hi there, unfortunately there's no option to remove the viewport scaling in Dms, as far as I'm aware its a js script being used.   I think this explains the theory behind what DMS does, it uses css scaling instead of allowing the zoom feature. http://www.hongkiat....mobile-screens/

 

The code removing the viewport scaling is in the lib.head.php, I'd imagine you'd need to use a hook/filter to disable and then edit the value. Unfortunately that type of customization would be outside of our support spectrum.

 

Removes viewport scaling on Phones, Tablets, etc.
    if(!ploption('disable_mobile_view', $oset) && !apply_filters( 'disable_mobile_view', '' ))
        echo '<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />';


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
jmad

James B

 

With accessibility issues of mobile devices being a bit of a media topic recently and the number of changes in DMS.  Is it possible to turn on pinchzoom for mobile?  

 

Is there code that can be used?

Share this post


Link to post
Share on other sites
James B

As far as I know it can be overwritten by entering the view port code into the header scripts box, setting the site to scalable.

 

See http://www.iheni.com/mobile-accessibility-tip-dont-suppress-pinch-zoom/ for the code.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
jmad

I tried adding the code below to the custom scripts area in two different variations one with head tag and one without.  It didn't work.  What do I need to do to make it work?

 

<head><meta content=”width=device-width; initial-scale=1.0; maximum-scale=2.0; user-scalable=1;” name=”viewport”>

<meta name=”viewport” content=”user-scalable=YES” /></head>

 

<meta content=”width=device-width; initial-scale=1.0; maximum-scale=2.0; user-scalable=1;” name=”viewport”>

 

<meta name=”viewport” content=”user-scalable=YES” />

Share this post


Link to post
Share on other sites
Danny

Hi,

 

You will need to use a hook to insert them, try searching for wp_head function, that is the one you will probably want to use in your hook. For example:

 

http://cl.ly/image/0K0k002J0r2B


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
jmad

Thanks.  It would be great if this was built into DMS.

Share this post


Link to post
Share on other sites

×