My Above The Fold CSS

Description

My above the fold CSS let you find out your theme’s – website’s above the fold
CSS code (including media queries).
Enable the plugin ,Set “Enable Above The Fold CSS Display ?” to yes and visit your homepage or any other page of your website.
Thats it!Your Above The Fold CSS is bellow your footer, copy and use it as you please.

You can use the your css code with Autoptimize plugin (or any other) to boost your pagespeed rank.

Key features

  • Generate above the fold CSS including media queries (responsive CSS).
  • You can enable-disable the above the fold CSS display anytime.
  • You can copy your CSS code from any page (bellow page footer).

Demonstration

Installation

Automatic installation

Automatic installation is the easiest option as WordPress handles the file transfers itself and you don’t need to leave your web browser. To do an automatic install of My Above The Fold CSS, log in to your WordPress dashboard, navigate to the Plugins menu and click Add New.

In the search field type “My Above The Fold CSS” and click Search Plugins. Once you’ve found the plugin you can view details about it such as the point release, rating and description. Most importantly of course, you can install it by simply clicking “Install Now”.

Manual installation

The manual installation method involves downloading My Above The Fold CSS plugin and uploading it to your webserver via your favourite FTP application. The WordPress codex contains instructions on how to do this here.

Updating

Automatic updates should work like a charm; as always though, ensure you backup your site just in case.

FAQ

Installation Instructions

Automatic installation

Automatic installation is the easiest option as WordPress handles the file transfers itself and you don’t need to leave your web browser. To do an automatic install of My Above The Fold CSS, log in to your WordPress dashboard, navigate to the Plugins menu and click Add New.

In the search field type “My Above The Fold CSS” and click Search Plugins. Once you’ve found the plugin you can view details about it such as the point release, rating and description. Most importantly of course, you can install it by simply clicking “Install Now”.

Manual installation

The manual installation method involves downloading My Above The Fold CSS plugin and uploading it to your webserver via your favourite FTP application. The WordPress codex contains instructions on how to do this here.

Updating

Automatic updates should work like a charm; as always though, ensure you backup your site just in case.

Reviews

Good

Simple and working as advertised. Good job

This guy is a hero

Just got rid of the revolution slider and concentrated on mobile performance. With autoptimize and this plugin I finally got 100/100 on valkenest.nl
VICTORY!!

One point: if you disable your footer you don’t see the css code bellow the page

BRILLIANT!!!

After using the plugin I extracted my Critical CSS – I used the Above the Fold Optimisation plugin to add the CSS I extracted and that together with W3 Total Cache and the altogether removal of Google Fonts from my theme – I achieved 99/100 on mobile and 100/100 on desktop. The 1% on mobile is more than likely due to the fact I have real crappy host and it’s time to move. A HUGE 5 thumbs up to P Vagelis as his plugin did what I could not get right with the Above the Fold Optimisation plugin – I was getting the FOUC and now the page loads so smooth. Thank You!

PS just one thing – I did find that on my home page – the footer which is about 55px in height that 2 lines of the CSS at the top was underneath the footer – fortunately due to a bit of transparency I could see this and managed to get to copy those two lines too.

Simplicity is the most sophisticated

Simple n straight to point of use. Just what we need – to find what we need – in a life of texts and numbers. On a side note – exporting the CSS or displaying it on the plugin page rather than the actual loading page would make it more interesting 😀

Read all 9 reviews

Contributors & Developers

“My Above The Fold CSS” is open source software. The following people have contributed to this plugin.

Contributors

Changelog

1.3 15/02/2017

  • Dev – Added Option to enable responsive CSS display.

1.2 12/01/2017

  • Dev – Added Option to enable CSS display for all pages.

1.0 11/26/2016

  • Initial Release.