CSSPro – Eliminate Render-Blocking CSS for Lightning-Fast PrestaShop

Supercharge your PrestaShop performance and Google PageSpeed scores with CSSPro.
Slow-loading pages cost you customers and conversions. CSSPro solves this by eliminating one of the biggest bottlenecks in site speed—render-blocking CSS.

Our advanced module scans your pages, identifies the critical CSS needed for initial rendering, and defers non-essential styles. This means your pages load faster, paint earlier, and provide a smoother experience for visitors across desktop and mobile.

🔧 Key Features:

• 🚀 Automatically extracts and injects above-the-fold critical CSS

• 🧠 Smart deferral of non-critical stylesheets without breaking design

• 📊 Boosts Google PageSpeed Insights and Core Web Vitals

• 🖥️ Fully compatible with PrestaShop 1.7 and 8.x

• 🔄 Works seamlessly with custom and theme-based styles

• 🛠️ Easy installation and configuration — no coding required

Whether you're focused on SEO, conversions, or just want your store to feel lightning-fast, CSSPro is an essential optimization module for any serious PrestaShop merchant.

✔️ Developed by PrestaHeroes — trusted experts in PrestaShop performance.

Installation Instructions:

1. In your PrestaShop Back Office, go to Modules > Module Manager

2. Click "Upload a Module"

3. Select and upload the cssPro ZIP file

4. Once uploaded, click "Configure" to begin setup

Configuration Guide:

1. Add Your IP Address
   In the module configuration, click "Add IP" to ensure the module runs only when your IP is detected in the Front Office.

2. Disable CSS CCC
   Go to Admin > Advanced Parameters > Performance, and disable the CCC (Combine, Compress, Cache) option for CSS files.

3. Browse Your Front Office
   Visit your store's Front Office and navigate through all key page types (homepage, product pages, category pages, CMS, etc.) to allow CSSPro to detect the relevant CSS files.

4. Refresh CSSPro Dashboard
   Return to the module dashboard and click "Refresh" to load the newly discovered CSS files.

5. Set Resource Hints
   Set Resource Hint to “Preload” for all CSS files except for theme.css.

6. Assign Priority
   Set the Priority Hint for theme.css to “High” to ensure critical styles load first.

7. Go Live
   Once you're satisfied with the preview, disable Simulator Mode to activate changes across your live site.