Reduce .css Render Blocking

Add html Resource Hint 'preload' to .css files into header.  Learn more here.

Dashboard

Displays a list of .css registered to your PrestaShop and which can then be managed in the following ways:

Resource Hints

• preload add a rel="preload" Learn more here.
• none (this is default PrestaShop attribute), blocks page render
• Ignore do not load .css file, use to remove loading of unused .css

Priority Hints:

• low
• high
• auto 

Module Settings:

Simulator

Allows admin to test .css configuration internally based on IP address(es).  Disable to go live.

Email alerts 

receive email when new .css discovered

Default Settings for newly discovered .css files,

recommended values Resource Hint: "Preload" |  Priority Hint "auto"

Installation

Shop Backoffice->Module Manager-->Upload a module-->upload cssPro-->Configure

Configuration:

1. Disable CCC of .css files from admin-->performance page
2. Open your front office and navigate through all your shops different page types
3. Refresh cssPro DashBoard to see newly discovered .css files
4. Set Resource Hint to preload for all .css files except theme.css
5. Set Priority HInt of theme.css to High
6. When satisfied disable simulator to go live