Mobile devices showing desktop version

Technical Q&A
1

Hi my mobile version on theme customization looks great but on actual mobile phones it shows the desktop version and looks terrible. I have disabled my third party apps and it still is doing it. Please help. my site is hybridhuman.co

2

Hello @rmacdonald10

I checked your site’s code, and the problem is a missing viewport meta tag This tells mobile phones to use the mobile version of your site. Here is the quick fix.

First, for safety, go to Online Store > Themes and Duplicate your theme. Perform these steps on the new copy.

  1. In the theme code editor, go to the file: layout/theme.liquid.
  2. Find the opening <head> tag near the top of the file.
  3. Paste this exact line of code on a new line directly below <head>:HTML<meta name="viewport" content="width=device-width,initial-scale=1">
  4. Click Save.

Now, preview the duplicated theme on your mobile phone. It should display the correct mobile version. If it looks good, you can publish it.

This should solve the problem immediately. Best of luck!

3

Hi @rmacdonald10 ! It looks like your issue might already be resolved — I just checked your store on mobile, and it seems to be displaying the correct mobile version now. Everything looks normal on my end.

Felix

4

Thanks everyone. It was displaying correctly previously, I’m not sure how it was changed, maybe one of these apps I installed.

Thank you very much