[Resolved] Issues with GP Premium Mobile Layout

Home Forums Support Issues with GP Premium Mobile Layout

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1386191
    SAGAR

    Hi Tom and everyone,

    I just purchased the GP Premium Theme and its fantastic.

    My PSI score immediately shot up to 90+ by just using this theme which is awesome.

    URL I am talking about: https://www.personalfinancefreedom.com/

    I am a Canadian Personal Finance Blogger and the desktop site looks the way I want it, no issues here.

    However, I am facing some issues with the Mobile Layout

    Actual Issue on mobile :

    The issue I am facing in on both archive pages (homepage and other pages as well) and individual post pages as well.

    Issue: I don’t see the separation grid and layout seems to be broken.

    When you hit the URL on mobile, you can see that the two-column width is broken on mobile and there’s an uneven border and post grid, while on the post pages I am seeing just white background and no border or gradient as in desktop.

    What I want: Just as in desktop, boxes with grey background if its one post since the screen is small for both homepage, pages and post page just as in Desktop.

    Thanks,
    Sagar, Toronto, Canada

    #1386215
    Leo
    Staff
    Customer Support

    Hi there,

    Any chance you can disable all plugins except GP Premium to eliminate conflicts from other plugins first?

    Let me know ๐Ÿ™‚

    #1386244
    SAGAR

    Hi Leo,

    I can’t do that right now, however I can give you the list of plugins I have active and running.

    BTW except WP Rocket, I do not have any other caching or front end plugin such as autoptimize or Page Speed Ninja installed. Its only WP Rocket at the moment.

    #1386245
    Leo
    Staff
    Customer Support

    Maybe try disabling WP Rocket first?

    #1386251
    SAGAR

    sure doing it right now.

    #1386256
    SAGAR

    Done, can you please check now? I am still not seeing the Grid as in desktop?

    #1386268
    Leo
    Staff
    Customer Support

    Sorry I might have misunderstood.

    By default the 2 columns turn into 1 column on mobile as there is usually not enough space for 2 columns on mobile.

    So you actually still want the 2 columns on mobile? Might be very cramped on narrow mobile screens.

    thereโ€™s an uneven border and post grid

    Looks like this one is solved though.

    #1386272
    SAGAR

    Hey Leo,

    All I need is a grid as in desktop, even if its one column I am happy with that.

    Complete box structure with content inside, right now it’s not uniform on mobile as you can see for both archive and posts page.

    Yup the uneven is gone now.

    #1386276
    SAGAR

    In simple words to help you understand better, here’s what I need om Mobile-only:

    1. One column of Archive and Post page content within the border and grey outside, similar to desktop now.

    that’s it!

    As of now, it’s very uneven on mobile with borders not around.

    Please let me know if any questions!

    #1386331
    Leo
    Staff
    Customer Support

    Try adding this CSS:

    @media (max-width: 768px) {
        .generate-columns-container>* {
            padding-right: 18px !important;
            padding-left: 18px !important;
        }
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #1386355
    SAGAR

    Hey Leo, that code works on the homepage/archive pages, thanks!

    However the code is still not working on the post/article pages (full-length posts), I still dont see the grid here.

    ~S

    #1386456
    Leo
    Staff
    Customer Support

    Try this as well:

    @media (max-width: 768px) {
        body.single .site-main, body.page .site-main {
            margin-left: 25px!important;
            margin-right: 25px!important;
        }
    }
    #1386734
    SAGAR

    Thanks, that worked.

    #1387097
    Leo
    Staff
    Customer Support
Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.