Disable CSS file loading for Mobile or window width less than 480

  • Resolved pratikheady

    (@pratikheady)


    5 years, 6 months ago

    Hello,

    Great plugin for page speed improvement. But for mobile I am getting low speed. In order to improve that I need to load different CSS file for Mobile. But I am not able to prevent Autoptimize css file from loading. Can you help me with this?

    I need to prevent Autoptimize file to load for mobile. Also I am not able to detect where CSS file is getting generated and getting added in <Head> tag.

    Please advice how can I resolve this.

    Thanks

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

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

    (@optimizingmatters)

    Autoptimize “catches” the full HTML before being sent to the browser and then extracts the CSS (and JS) and replaces it with the optimized version. There is no way you can tell AO not to “inject” it’s CSS for screen sizes < 480 as AO does not know about visiting browser’s window size.

    In order to load different CSS for mobile you’ll probably have to install/ use a plugin that generates a “mobile-only” version of your site (WP Touch, Jetpack has something similar and I’m sure there are others) OR having a theme that enqueues 2 (or more) CSS-files with media-queries in the media-attribute which tell browsers if they should or should not load the CSS-file.

    All in all; you’ll have to fix this at the source (mainly your theme) ??

    hope this clarifies,
    frank

Viewing 1 replies (of 1 total)
  • The topic ‘Disable CSS file loading for Mobile or window width less than 480’ is closed to new replies.