OWN DEMO PROJECT · WOOCOMMERCE DESIGN, SEO & SPEED

DriveForge: a WooCommerce store that scores 97 on mobile PageSpeed.

I designed and built DriveForge, a car accessories WooCommerce demo store, using only free tools. I set up 15 products with color and size variations, built a modern animated design, completed on-page and technical SEO, and optimized speed. I then measured the result with Google PageSpeed Insights.

Website: shop.autogearpilot.com (demo store, no real orders)
Date: 1 November 2026 · 9 pages, 15 products
Tools: WordPress, WooCommerce, Blocksy, Rank Math, LiteSpeed Cache, WPForms, Tidio and Google PageSpeed Insights.

THE RESULT

What the final tests reported.

PAGESPEED · MOBILE · HOME

86 → 97

Largest Contentful Paint dropped from 3.3 s to 1.8 s, with zero layout shift.

PAGESPEED · MOBILE · PRODUCT

89 → 96

LCP dropped from 3.0 s to 2.1 s after WebP images and LCP image prioritization.

ON-PAGE SEO · KEY PAGES

0 → 9 of 9

Pages with unique titles, meta descriptions, Open Graph tags and schema markup.

Google PageSpeed Insights lab tests, 1 November 2026
Page · devicePerformance beforePerformance afterLCP before → after
Home · mobile86973.3 s → 1.8 s
Product · mobile89963.0 s → 2.1 s
Home · desktop95980.8 s → 0.4 s
Product · desktop97980.8 s → 0.4 s

Also after: Total Blocking Time 0 ms on every test; mobile layout shift on the product page fell from 0.068 to 0.

Lighthouse lab scores move a few points between runs. PageSpeed’s SEO score shows 58 to 66 only because the demo store is intentionally set to noindex.

EVIDENCE

See the before and after.

The first image summarizes the PageSpeed Insights results before and after optimization. The second shows the on-page SEO checks. The third shows the finished design on desktop and mobile.

Chart of PageSpeed performance scores before and after optimization: home mobile 86 to 97, product mobile 89 to 96
Table of on-page SEO checks before and after: meta descriptions, titles, Open Graph tags, H1 and schema

Speed — 1 November 2026: mobile 86 → 97 (home) and 89 → 96 (product page); desktop 95 → 98 and 97 → 98.

SEO: meta descriptions, keyword titles and Open Graph tags went from 0 of 6 to 9 of 9 key pages; one H1 per page; schema on every page.

DriveForge WooCommerce design showing the category mega menu, best sellers and mobile product page with color swatches
Finished design: mega menu, best sellers and mobile product page

THE BRIEF

Build a store that looks good, loads fast and is ready for search.

I wanted a realistic WooCommerce project to show clients: a modern US car accessories store built only with free tools, with a real product structure, a professional design and measurable speed and SEO results. It runs on a subdomain of my automotive site, so the main site is not affected.

STEP BY STEP

How the work was carried out.

01 · Set up the store and products

I installed WooCommerce with the free Blocksy theme and added 15 products in 4 categories, including variable products with color swatches (seat covers, steering wheel cover, phone mount) and size options (floor mats, sun shade).

02 · Design the pages

I built an animated home page (hero, category grid, best sellers, promo and new arrivals), About, Contact + FAQ and policy pages, a category mega menu, a mobile sticky add-to-cart bar, a welcome popup with a discount code and an AI chat widget.

03 · Complete on-page SEO

With Rank Math I wrote unique titles, meta descriptions and focus keywords for 24 URLs, removed a duplicate H1, set up XML sitemaps and added schema: Organization, WebSite, Product with brand, FAQPage, AboutPage, ContactPage and CollectionPage.

04 · Measure speed before changes

I tested the home page and a product page in PageSpeed Insights. Mobile scored 86 and 89. The main issues were render-blocking requests, large images, short cache lifetimes and unused CSS.

05 · Optimize speed

I removed unused page builder plugins, tuned LiteSpeed Cache, gave the main image fetchpriority high with a responsive srcset, excluded it from lazy loading, re-encoded 10 product photos from PNG to WebP (about 95% smaller) and delayed the chat widget until the first interaction.

06 · Re-test

Mobile scores rose to 97 (home) and 96 (product), and desktop to 98. Every tested page now has an LCP under Google’s 2.5 s “good” threshold and zero layout shift.

THE REMAINING WORK

Keep the next actions visible.

  • Payments: the demo uses cash on delivery and bank transfer; Stripe is installed and needs a test account before card checkout appears.
  • Indexing: the store is noindex on purpose. Canonical tags and search visibility would be switched on for a real launch.
  • Field data: the store has no real traffic yet, so only lab tests are reported.

REPORT CONTEXT

What these figures measure.

Test date: 1 November 2026, before and after the optimization work on the same day. Tool: Google PageSpeed Insights (Lighthouse lab data), mobile and desktop, home page and the Premium Leather Seat Covers product page.

These are lab performance scores and on-page checks, not rankings or traffic, and no ranking result is claimed. FAQ markup is valid, but Google currently shows FAQ rich results mainly for government and health websites.

YOUR STORE · A CLEAR NEXT STEP

Need a WooCommerce store that is fast and ready for search?

Share your products, the kind of store you have in mind and your launch date. I will reply with a clear plan, timeline and price.

Join the discussion

Questions about this case study? Join the discussion below. Comments are reviewed before publication.