Support » Plugin: Autoptimize » Auto Critical CSS not rendering homepage correctly

  • Resolved leisureinstalls

    (@leisureinstalls)


    When I enable the “Inline “above the fold CSS” while loading the main autoptimized CSS only after page load.” the output causes my homepage to not display correctly. The categories are minimized, hidden product categories are shown and I lose a lot of the store front formatting.

    I also have massive differences in Google Page Speed between my mobile and desktop sites.

    The page I need help with: [log in to see the link]

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    Do you have an auto-generated is_front_page rule, or is this a manual one leisureinstalls ?

    Thread Starter leisureinstalls

    (@leisureinstalls)

    Auto generated is front page.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    maybe a fluke, can you delete it so it can regenerate?

    Thread Starter leisureinstalls

    (@leisureinstalls)

    I deleted the the file and it has regenerated but still experiencing the same issue. I have replicated the look on two different computers, three browsers and a mobile phone. I have noticed that when I am logged in as an admin, it appears fine on both mobile and chrome browser.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    OK, can you

    1. make sure js/jquery/jquery.js is not deferred
    2. untick “try/catch javascript wrapping” in Autoptimize JS settings
    3. (if not OK yet) add

    
    .home .storefront-popular-products, .home .storefront-on-sale-products, .home .storefront-best-selling-products {display:none;}

    to Autoptimize -> critical css -> add css to all rules

    and see how far that take us?

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    any news leisureinstalls ?

    Thread Starter leisureinstalls

    (@leisureinstalls)

    Thanks for the follow up- trying to survive this mess. Yes, it was because I checked a box to defer js/jquery/jquery.js

    Appreciate the help figuring it out. That stuff overwhelms me. Still don’t think I have all the settings right because my mobile site is so slow in comparison to my desktop site.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    ok, happy that works.

    re. the difference between mobile & desktop; it is normal for desktop to be slower (both in real performance in (milli)seconds and in pagespeed score) due to the nature of mobile which has restricted bandwidth and processing power.

    that being said; try not forcing JS in head as the next step?

    Thread Starter leisureinstalls

    (@leisureinstalls)

    My desktop runs fast, it is mobile that runs between 10-30 points. Still checking changes. Now I get my background of my header & footer to show a transparent on the homepage but not others. I tried deleting to see if that was the issue. Can you recreate it?

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    I don’t see transparant backgrounds on home or elsewhere, can you share a screenshot leisureinstalls ?

    Regarding troubleshooting; you can always disable “inline & defer CSS” in Autoptimize (& clear page caches) to see the site without the critical CSS. That way you can test if the problem is with the critical CSS or elsewhere.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    No feedback any more so I assume this got resolved leisureinstalls ? Feel free to follow up if you still encounter issues!

    have a nice day!
    frank

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Auto Critical CSS not rendering homepage correctly’ is closed to new replies.