Archived topic
How to point to a modified mobile.css file in child theme
4 replies · Started by Whelan on May 24, 2019
I have created a child theme and need to modify the mobile.css.
1. Should I just need to upload my mobile.css file into the child theme folder?
2. Should I just add the modified rules or do I need to replace all rules?
3. Should I name it "mobile.css" or minify it and name it mobile.min.css?
Hi there,
Can you first let me know what you are trying to modify in there?
Just want to make sure there isn't a better method.
Let me know :)
Hi
I've been looking at Google PageSpeedInsights and my newly-finished website scored just 25/100 for mobile. I want to reduce "render-blocking resources" and css is one of the things I can improve.
There are about 15 screen-dependant rules which are currently written in the Customizer CSS.
Some are about min-width and some are about max-width.
They are for extra classes that I have created and for rules that cannot be modified via the customiser.
Page Speed Insights also suggest removing "dead rules from stylesheets and defer the loading of CSS not used for above-the-fold content to reduce unnecessary bytes consumed by network activity". I've tried to keep plugins to a minimum but there are lots of css files.
I don't suggest modifying that file.
If you're trying to reduce the number of CSS requests, you can try a plugin like this: https://wordpress.org/plugins/autoptimize/
We use it here on our site and we love it.
Let me know if you need more info :)