How to Install CssPro on PrestaShop

If you’re serious about page speed, you know that getting CSS to load efficiently is critical for user experience and SEO. That’s why we created CssPro, a PrestaShop module that automatically adds <link rel="preload"> entries for your CSS files. This ensures Above-the-Fold content loads faster without messy manual tweaks.

Quick Start (≈5 minutes)

  1. Install & enable
    In your PrestaShop Back Office go to Modules → Module Manager → Upload module and select the ZIP.
    On install, Stealth Mode is enabled automatically, so only your IP will see CssPro changes while you configure.
  2. Open the CssPro Dashboard
    Go to Modules → Module Manager → CssPro → Configure. Leave this tab open.
  3. Warm page types
    In another browser window, open your storefront and visit each page type once:
    • Home (index)
    • Category
    • Subcategory (if distinct)
    • Product
    • Cart
    • Checkout (stop before placing order)
    • CMS / Design pages (About, Contact, etc.)
  4. Return to CssPro & Refresh
    Back in the CssPro dashboard, click Refresh. You will now see discovered .css resources linked to each page type and marked for preload.
  5. Verify in page source
    In your storefront, right-click → View page source.
    Press Ctrl+F (or Cmd+F) and search for preload.
    You will see your CSS files referenced in the <head> as:
    <link rel="preload" as="style" href="/path/to/your.css">

When You’re Satisfied

Once you’ve tested and confirmed everything works, go to CssPro → Settings and disable Enable Simulator Status. This significantly reduces page render overhead, putting CssPro into its lean, production-ready mode.

With CssPro, you no longer need to guess if PrestaShop’s built-in performance settings are helping or hurting your store. Instead, you get targeted preloads that accelerate rendering where it matters most — Above the Fold. Faster pages, happier customers, better conversions.