[Resolved] Critical css above fold

Home Forums Support [Resolved] Critical css above fold

Home Forums Support Critical css above fold

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #516019
    Howard

    Hi guys:
    I have extracted my full css and minified it with 2 programs. I use what I think is a better plugin than Autoptimize
    Where would I insert this critical css in my GP blog ? I know it goes somewhere between >header tags < but I also know content must be moved to bottom of “ body” ??
    Where are these (style sheets ?) or codes found on my website? Also , do I use the critical css for the whole site as I extracted above or should I have extracted each page critical css from each page separately?
    Howard

    GeneratePress 2.0.2
    #516111
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    I’m not too sure what you mean. Does the plugin you’re using not add the critical CSS? I suppose you could try putting it in the wp_head hook inside <style></style> tags?

    All of our scripts are enqueued using wp_enqueue_scripts: https://github.com/tomusborne/generatepress/blob/2.0.2/inc/general.php#L12-L60

    It may be worth using a plugin that does this automatically for you, as removing scripts manually will take a decent amount of custom coding.

    #516322
    Howard

    Hi Tom:
    Indeed: I used this plugin to extract full css (https://wordpress.org/plugins/above-the-fold-optimization/ )
    But ONLY to get the CSS extracted, nothing more. I then used “critical path css” to extract critical CSS and then minimized it accordingly

    I do use this (https://wordpress.org/plugins/fast-velocity-minify/) INSTEAD of Autoptimize as I feel it works better for my site overall. However, as you mentioned, it does NOT insert the minified critical css into the GP stylesheeet!

    So now, again you’re right. I am not knowledgeable enough to put the css into my GP site PROPERLY
    Can I hire you personally??? (private job)
    Howard

    #516409
    Howard

    PS I just questiond myself as to whether or not I extracted the FULL CSS ( which is what the first plugin LINK does, and which I followed) or whether I took just a page .. I totally presume the plugin tab said “Extract FULL CSS),,,of website
    Now where to go from here??
    Howard

    #516530
    Tom
    Lead Developer
    Lead Developer

    Unfortunately I don’t do private work currently, but you can always try a site like codeable.io.

    Do you find it makes a massive performance difference having critical CSS vs keeping things default? In my tests it makes very little difference, unless you’re adding tons of custom CSS.

    #516588
    Howard

    Yea well you got me there! Only as I add more posts to the blog; hence things could build up unfortunately as I go along
    I’ve used codeable before and they are excellent
    I will think what you said over
    Thanks for advice
    Howard

    #516760
    Tom
    Lead Developer
    Lead Developer

    No problem! Keep tabs on it – I find if you keep things simple, the speed difference will hardly be noticeable at all.

    #516923
    Howard

    Thanks Tom👌

    #517063
    Tom
    Lead Developer
    Lead Developer
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.