Hi, I have an issue with viewing my site on mobile devices. The layout seems to be shrinking massively while viewing on a phone. If I enter developer mode on my desktop browser to show mobile size the layout is perfect. Ive attached screenshots to show the issue. I have Enabled Responsive design turned ON. Extended responsive turned ON with max width 1425.
That's actually incorrect. When I do the browser emulation on mine I get this - See attached. See how the typography and menu and layout is not shrunk?
Hey Seth! This issue is occurring due to a malformed custom meta tag that is currently at the top of your HTML head. It's breaking the default theme meta tag below it which sets the viewport sizing for mobile devices. Once the meta tag that's highlighted in my attached screenshot is removed, the issue will be resolved. If you're unsure how that meta tag is getting added into the setup, I would first test third party plugins by temporarily disabling them.
That has fixed it! Many thanks. Is there a way to have that snippet of code in my header.php file without the theme shrinking on mobile? It's for tracking purposes. Cheers!
Hi, I have an issue with viewing my site on mobile devices. The layout seems to be shrinking massively while viewing on a phone. If I enter developer mode on my desktop browser to show mobile size the layout is perfect. Ive attached screenshots to show the issue. I have Enabled Responsive design turned ON. Extended responsive turned ON with max width 1425.
Hey ,
Which iphone are you testing it in ?.
Best
ThemeNectar Support Team
iPhone 10
I am seeing the correct layout in Browser emulation Mode : http://prntscr.com/q8q9ba .
Best
ThemeNectar Support Team
That's actually incorrect. When I do the browser emulation on mine I get this - See attached. See how the typography and menu and layout is not shrunk?
Which Browser are you using to emulate it ?.
ThemeNectar Support Team
Im using Safari. - Develop - Enter Responsive Design Mode. So strange why it's correct there and then shrinks on the actual phone device.
Gonna escalate this to the developer so that he can check in Safari and respond accordingly.
Best
ThemeNectar Support Team
Much appreciated on this. Client is asking questions about this too so need to get sorted.
In the Meantime try using the New Responsive Typography Settings in here : http://prntscr.com/gnf951 and see if that makes any difference.
Best.
ThemeNectar Support Team
Ya I did try that and nothing happens on mobile safari. The entire layout is still shrunk massively site-wide.
Hi Tahir, Just curious if you had an update on this yet? cheers!
Hey Seth! This issue is occurring due to a malformed custom meta tag that is currently at the top of your HTML head. It's breaking the default theme meta tag below it which sets the viewport sizing for mobile devices. Once the meta tag that's highlighted in my attached screenshot is removed, the issue will be resolved. If you're unsure how that meta tag is getting added into the setup, I would first test third party plugins by temporarily disabling them.
Cheers
That has fixed it! Many thanks. Is there a way to have that snippet of code in my header.php file without the theme shrinking on mobile? It's for tracking purposes. Cheers!
Hey Again,
Try using this plugin or similar : https://wordpress.org/plugins/insert-headers-and-footers/. Furthermore if its a GA script in here : http://prntscr.com/q9826a .
Best
ThemeNectar Support Team
That has worked. Thanks so much for you quick response. Really appreciate it.