0

I have built my current theme in my D7 site upon the Foundation theme, and with that comes a LOT of unused CSS that gives me a low score in Pagespeed Insights. I have tried different things, among others to use the Advagg module and it's submodule "Critical CSS". These modules does no good for my site unfortunately, despite repeated trials and despite safe settings etc. The screen goes blank and/or each page takes minutes to load. When I only use safe settings and critical css, the page speed score does not improve (and yes, all settings are done according to docs and I have spent many hours on trialling without luck).

So, instead I thought I would try to move this row in html.tpl.php:

    <?php print $styles; ?>
</body>

...to the bottom of the page just before the ending body tag. Then I would need to add the critical css in the head section. 

    <head>
        <?php print $critical_css; ?>
...

But how can I pass a variable like $critical_css to html.tpl.php, that only contains the just necessary to show the page? Or is this not possible?

Improve this question

1 Answer 1

Reset to default
0

Instructions for the Critical CSS module:

Navigate to: admin/config/development/performance/advagg/critical-css

Under Add Critical CSS - Select the theme that is your front page; usually the default is correct. - User type should be set to 'anonymous' under most circumstances. - Type of lookup, select URL - Value to lookup, type in - Critical CSS, paste in the generated CSS from running your homepage url through https://www.sitelocity.com/critical-path-css-generator which is inside of the 'Critical Path CSS' textarea on the sitelocity page. - Click Save Configuration.

Improve this answer
5
  • As explained I have already tried this, and it didn't help at all. My question is if it is possible to pass a variable with a separate style sheet to html.tpl.php
    – TBJ
    Commented Apr 2, 2019 at 11:00
  • I actually did this yesterday afternoon using sitelocity.com/critical-path-css-generator and it works perfectly. I left the scripts alone and only moved the $styles to the bottom of the body. The dev server I use now records 90% on mobile, as I need to convert some images to webp.
    – macjules
    Commented Apr 3, 2019 at 12:54
  • Do you mean that you use Advagg for critical css and also moved $styles to the bottom of the page?
    – TBJ
    Commented Apr 4, 2019 at 9:33
  • Yes, I mean exactly that. I followed the implicit instructions for AdvAgg and all the required submodules.
    – macjules
    Commented Apr 5, 2019 at 6:40
  • OK, thanks. Does not work on my site though. Tried it now again and the score actually gets worse and pages go about 1 second on every page load without any style at all. But thanks anyway for the input.
    – TBJ
    Commented Apr 5, 2019 at 6:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.