If chat text is Zooming in on Mobile browsers

Modified on Fri, 28 Oct, 2022 at 1:20 PM

Zoom In Issue

Why it Happens

The user-scalable attribute in the <meta> tag allows the device to zoom in and out. If the user-scalable attribute is set to “YES” or it is not set at all, that is when the Mobile browser zooms in to focus on the input field.

The most common way of disabling the zoom is using the HTML <meta> tag. The user-scalable attribute allows the device to zoom in and out.

What you need to do

You should define the value as “no” for this attribute in order to disable the zooming option.

To do this, you need to add the following code in your AtomChat Admin Panel (http://app.atomchat.com/ - Manage) -> Settings → Editor → Select Custom JavaScript from the drop-down → Add the following code and save it.

var meta = document.createElement('meta');
meta.name = "viewport";
meta.content = "width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no";
document.getElementsByTagName('head')[0].appendChild(meta);

NOTE:
After adding the code, please clear your browser cache and then check or you can test on a private/incognito browser window.