Home › Forums › Technical Theme Support › STAX Theme › Mobile Speed Issues
- This topic has 5 replies, 2 voices, and was last updated 2 months, 2 weeks ago by Berit Sund.
-
AuthorPosts
-
September 22, 2024 at 9:47 am #466790Berit SundParticipant
Hello
Hope you are well! I continue to have issues with LCP on my website and blog: https://www.gutsandgloryhealth.com/gut-health-blog/Having been in touch with WP Rocket and Smush support staff, both seem to think the hero image container needs to be smaller, plus should choose a different size of image in the mobile section. It appears the demo theme also has this issue (https://stax.organicthemes.com/blog/)
Please can you advise how to achieve this with Organic Stax?
FYI I used the One Change service to set up the blog layout.
Kind regards, Berit
September 24, 2024 at 5:20 am #466869David MorganKeymasterHi Berit,
Thanks for reaching out! I hope you’re well as well.
In this case, I would recommend changing the width the Cover Block to Wide instead of Full Width, or removing the Cover Block altogether from the blog page.
You can edit the block by navigating to Appearance > Editor > Templates > Index. The size can be toggled in the block controls, or you can delete it altogether. I attached a screenshot for reference.
Let us know if there is anything else.
Thanks!
Attachments:
You must be logged in to view attached files.September 24, 2024 at 7:20 pm #466883Berit SundParticipantHi David
Thanks. I really like the look of the blog post template provided by your team, is there not a way to mobile optimise it?
Kind regards, BeritOctober 1, 2024 at 12:40 am #467002Berit SundParticipantHi DAvid, wondering whether there’s a way to mobile optimise the blog teme (set up via STAX One Change service)? Kind regards, Berit
October 2, 2024 at 3:59 am #467024David MorganKeymasterHi Berit,
I apologize for the delay. Rather than changing the width of the block, I could provide a style to hide the cover block in mobile, which should help optimization for mobile devices.
You can hide the block using this CSS:
@media screen and (max-width: 768px) { .site-main > .wp-block-cover { display: none; } }
Also, make sure your image is saved in the .webp format for maximum file size savings. When it comes to large images and the LCP, there’s really no way around this optimization aside from either removing the image altogether or compressing the file size as much as possible. It just becomes a matter of preference whether you prefer having the image or prefer optimizing the page as much as possible.
I hope this helps.
Thanks!
October 3, 2024 at 8:37 pm #467053Berit SundParticipantMany thanks, David!
-
AuthorPosts
- You must be logged in to reply to this topic.