Archived topic
Mobile isn't displaying properly
7 replies · Started by Sam on December 22, 2022
Need some help figuring out why the mobile version, that displays perfectly when editing, doesn't display at all like it should. Here's the site:
- https://sprmedstg.wpengine.com/
Hi Sam,
For reference, can you point us to a specific section in your site we can observe the issue to assess it properly?
Can you also share a screenshot of how that section looks on the backend?
Uploading Screenshots: https://docs.generatepress.com/article/using-the-premium-support-forum/#uploading-screenshots
Homepage for starters...
1. From My Desktop:
- https://imgur.com/cKmG6CZ
2. From the backend, editing mobile display:
- https://imgur.com/vqGj5kC
3. From my iPhone, actual mobile display:
- https://imgur.com/uKPtZHj
The containers on mobile are set to 320px width (inside #2).
This specific section seems to be causing the issue: https://share.getcloudapp.com/7KujP9ge
I tried removing that container and the issue went away. You can observe this if we hide that section with this CSS you can temporarily add through Appearance > Customize > Additional CSS:
div#gspb_container-id-gsbp-f69f3b69-1778 {
display: none;
}
You'll need to check its settings or reach out to the support of this Block for suggestions on how to fix the issue.
Appreciate it Fernando. Now, next problem haha... Do you know why the page is loading this way on mobile?
- https://imgur.com/FW55kgX
Basically its mixing up where the elements and sections from the page go... Blog posts are at the top, instead of the bottom, just sort of chaotic really.
Another Question: I built all the pages inside reusable templates. Then short code those templates to the page itself. Would it be smarter if each individual section was created separately? Then shortcoded over? So instead of the page having 1 short code it could have 6 or 7?
Let's keep it one question per topic, please.
For the mobile display, I suspect that there might be some caching or optimization that's conflicting.
Can you disable all plugins except GP Premium and GenerateBlocks to test first?
It's an AMP issue... Google AMP is loading every time, and it's loading its own formatting. Gotta turn that off until I can properly format the amp pages I guess.
Make sure you are using the compatibility plugin:
https://docs.generatepress.com/article/amp-compatibility/
