Do you want your site mobile or tablet responsive and allow users to pinch and zoom on their mobile device? You can do that with some tweaks in Canvas.

Prerequisite(s)
Canvas Theme
Canvas Child Theme

Step 1 Login to WordPress control panel

Step 2 Go to Appearance > Editor

note:  Your Canvas Child theme should be enabled by default and should have the files style.css and functions.php

Step 3  Click functions.php to modify the file.


Step 4 In the Canvas Child: Theme Functions (functions.php), paste the following codes:

<?php
function woo_load_responsive_meta_tags () {
$html = ”;

$html .= “\n” . ‘<!– Always force latest IE rendering engine (even in intranet) & Chrome Frame –>’ . “\n”;
$html .= ‘<meta http-equiv=”X-UA-Compatible” content=”IE=edge,chrome=1″ />’ . “\n”;

/* Remove this if not responsive design */
$html .= “\n” . ‘<!– Mobile viewport scale | Disable user zooming as the layout is optimised –>’ . “\n”;
$html .= ‘<meta content=”initial-scale=1.0; maximum-scale=4.0; user-scalable=yes” name=”viewport”/>’ . “\n”;

echo $html;
} // End woo_load_responsive_meta_tags()
?>


Step 5 Click Update File button

Step 6 Get your mobile or tablet and open your website from a browser e.g. Chrome. Try to pinch on the screen and see your pages zoom in and zoom out. Enjoy!

note: We have tested it working for iPhone and Samsung Galaxy S5.

Here is a video tutorial on how to enable pinch and zoom in your mobile or tablet using tweaks in Canvas

Leave a Reply

Your email address will not be published. Required fields are marked *