WP-Optimize
95Get caching and more with this powerful cache plugin. Cache, optimize images, clean your database and minify f...
Free
1M+ installs 4.8★ (2,606)
CSS Above The Fold
Faster CSS browser rendering displaying selected fragments of your theme stylesheet file directly into the head section.
The facts
- Rating
- 5★ from 1
- Active installs
- 200+
- Price
- Free
- Last updated
- 31 Aug 2015
- Added
- Mar 2015
- Requires WP
- 3.3.2
- Tested up to
- WP 4.3.34
- Downloads
- 16,407
Our analysis
AI-assistedCSS Above The Fold is a WordPress plugin designed to enhance user experience by loading critical CSS styles for the above-the-fold content directly in the head section of a webpage. This approach allows for quicker rendering of the page, potentially improving scores in performance testing tools like Google Page Speed Insights.
The plugin enables you to select specific fragments of your theme's CSS and surround them with special tags to ensure they are loaded in the head section. This means you do not need to maintain separate stylesheets, making it suitable for users looking to optimise their site's loading speed without extensive CSS management.
Best for: This plugin is suitable for WordPress users who want to optimise their site's performance.
What it does well
- ✓Improves above-the-fold rendering speed
- ✓Integrates CSS fragments directly in the head section
- ✓No need for separate stylesheets
- ✓Compatible with existing CSS comments
Where it falls short
- •Only tested up to WordPress version 4.3.34
- •Limited information available on features and usage
Verdict
CSS Above The Fold offers a straightforward solution for improving page load times by focusing on critical CSS. However, its limited testing and documentation may pose challenges for some users.
From the developer
Pau Iglesias's own description of CSS Above The Fold, lightly tidied.
Improve user experience by having your above-the-fold (top of the page) CSS styles in-page.
Even if the rest of the CSS files take a seconds to load, these specific CSS styles displayed from the head section ensure a quick rendering of your page and better score in testing systems like Google Page Speed Insights.
But you do not need to maintain two separate stylesheets, just select specific fragments of your theme style file with a special markup to create an above-the-fold styles joining the CSS fragments in the head section.
This plugin enables a special open and close tags that you can insert editing your style.css theme file to surround pieces of code:
[css-above-the-fold]
… Your theme CSS code fragment …
[/css-above-the-fold]
But this syntax is not an standard CSS, so you need to include this tags between CSS comments, there are two ways to do it:
1. Comment whole section
The easiest way, the CSS is rendered only in the head but not in the stylesheet.
This kind of markup does not allow to use your own CSS comments inside the fragment.
Take care to use this way only when the plugin is active, because you are commenting some parts of your theme stylesheet.
/* [css-above-the-fold]
… CSS code fragment …
[/css-above-the-fold] */
2. Comment only the tags
The unobtrusive way, it allows you to include comments inside fragments, but the fragments are rendered both in the head section and the CSS file.
This way is plugin-independent, and your theme stylesheet will keep running with this plugin activated or not.
/* [css-above-the-fold] */
Tagged as
Alternatives
Other plugins for making sites fast.
All-in-one unbeatable acceleration & PageSpeed improvement: caching, image/CSS/JS optimization...
Free
7M+ installs 4.8★ (2,764)
Comprehensive image optimization with WebP, AVIF, Lazy Load, and more. Optimize images automatically for Faste...
Free
1M+ installs 4.8★ (1,838)
Easy to use Under Construction Page & Coming Soon Page. Enable Under Construction Mode in seconds & sh...
Free
600k+ installs 4.8★ (1,285)
Smush
93Compress and optimize images, enable lazy load, serve WebP & AVIF, and speed up your site with a global im...
Free
1M+ installs 4.8★ (6,051)
Speed up your website by using our WebP & AVIF Converter. Optimize images and serve WebP and AVIF images i...
Free
500k+ installs 4.9★ (1,097)