The Pipeline

From WordPress to Production

Five phases, eleven steps, and dozens of automated sub-tasks. Every phase builds on the last. Every sub-step has a dedicated skill.

Capture2Transform2Optimize2Quality & Security4Deploy1
11 steps62 sub-steps19 skills

Capture

Discover, download, and clean the existing WordPress site

2 steps • 11 sub-steps

Step 1

Recon & Discovery

Crawls the sitemap, discovers every URL, and profiles the entire tech stack — CMS version, theme, plugins, hosting, CDN, and third-party integrations.

Sitemap crawl

Fetch and parse XML sitemap index + child sitemaps

site-crawler

Tech stack detection

Identify WordPress version, theme (Divi, Elementor, etc.), active plugins

technical-scanner

Infrastructure scan

DNS, hosting provider, CDN (Cloudflare, Fastly), SSL certificate

technical-scanner

Page classification

Categorize URLs by type: blog, procedure, gallery, legal, utility

site-crawlertechnical-scanner~30 seconds

198 pages discovered across 6 page types

Step 2

Download & Clean

A headless Chrome browser visits every page, waits for all JavaScript to execute, saves the fully-rendered HTML and every asset, then strips all the bloat.

Playwright capture

Open each URL in headless Chrome, wait for WP Rocket deferred scripts, save rendered DOM

wp-download

Asset collection

Download all images, fonts, CSS, JS files referenced by each page

wp-download

Screenshot capture

Full-page screenshot of every page for visual comparison later

wp-download

Tracker removal

Strip Google Analytics, Facebook Pixel, Hotjar, Segment, and all tracking scripts

postprocess

Dead widget removal

Remove GoHighLevel chat, Podium, CookieYes, LeadConnector, Instagram Feed shells

postprocess

Carousel repair

Reset frozen Swiper/Slick inline transforms, inject reinitializer script

postprocess

URL rewriting

Convert all absolute URLs to relative paths for portability

postprocess
wp-downloadpostprocess~15 minutes

198 pages • 2,187 assets • 6,752 bloat elements stripped

Transform

Extract content and rebuild with clean code

2 steps • 9 sub-steps

Step 3

Extract Content

Parses each cleaned HTML page into structured data. The WordPress markup is discarded entirely — only clean content survives.

Content parsing

Extract headings, paragraphs, lists, images, and embedded media from each page

wp-extract

Navigation extraction

Parse the site's menu structure: top-level items, dropdowns, CTAs

wp-extract

Metadata extraction

Pull title tags, meta descriptions, Open Graph, canonical URLs, schema markup

wp-extract

Page type classification

Auto-detect: home, procedure, blog, gallery, legal, pricing, about

wp-extract
wp-extract~20 seconds

101 blog posts • 69 procedures • 22 galleries • 6 utility pages

Step 4

Rebuild from Scratch

Every page is regenerated from clean templates using the client's brand. No jQuery, no framework, no WordPress infrastructure. Just fast HTML and CSS.

Brand configuration

Read colors, fonts, logo, phone, social links from project.json

shared-layout

Layout generation

Generate header, navigation, footer, CTA banners, and all CSS from brand config

shared-layout

Page templating

Apply type-specific templates: procedure (2-col + sidebar), blog (reading layout), gallery (image grid)

generate-page

CSS inlining

All styles inlined per page — zero external stylesheets, zero render-blocking resources

wp-rebuild

Accessibility baked in

WCAG AA contrast ratios, semantic landmarks, focus indicators, link underlines

shared-layout
wp-rebuildshared-layoutgenerate-page~10 seconds

198 pages • 4.2 MB total HTML (was 47 MB with Divi)

Optimize

Compress images, strip bloat, maximize performance

2 steps • 8 sub-steps

Step 5

Image Optimization

Every image is converted, resized, and properly loaded for maximum speed without visible quality loss.

WebP conversion

Convert all JPG/PNG to WebP at quality 80 — visually identical, 30-50% smaller

optimize-images

HTML reference updates

Update every img src, srcset, CSS background-image, and gallery link to WebP

optimize-images

Lazy loading

Add loading="lazy" to below-fold images, keep first 2 per page eager for LCP

optimize-images

Priority hints

Prune fetchpriority="high" to exactly one per page (the LCP candidate)

optimize-images
optimize-images~5 minutes

1,442 images converted • 1,908 lazy-load attributes added

Step 6

Performance Tuning

Strips any remaining WordPress infrastructure that slipped through, defers non-critical resources, and ensures zero render-blocking.

Unused JS removal

Strip mediaelement, wp-embed, divi-filter, jquery.cookie — scripts the static site doesn't need

optimize-performance

CSS deferral

Convert non-critical CSS to print media with onload swap (blog styles, tooltips, animations)

optimize-performance

Video optimization

Comment out hero videos for performance, keep poster images as static backgrounds

optimize-performance

Font optimization

Preconnect to font CDN, subset fonts to used characters, use font-display: swap

optimize-performanceoptimize-video~3 seconds

On clean rebuild: nothing to strip (zero WP bloat in output)

Quality & Security

SEO audit, security hardening, accessibility, and QA testing

4 steps • 26 sub-steps

Step 7

SEO Audit & Auto-Fix

A 10-point SEO audit scans every page and auto-fixes everything it finds. Not a report — the skill modifies the HTML directly.

Canonical URLs

Ensure every page has absolute canonical pointing to production domain

seo-fix

Meta optimization

Validate title length, meta description content and length

seo-fix

Schema markup

Fix empty/relative URLs in JSON-LD structured data, remove broken SearchActions

seo-fix

Heading structure

Ensure exactly one H1 per page, proper heading hierarchy

seo-fix

Open Graph tags

Fix og:url, og:image, og:site_name for social sharing

seo-fix

Sitemap generation

Generate sitemap.xml with lastmod dates for all pages

seo-fix

Dead page detection

Detect error pages (502s, 404s) that were captured instead of real content

seo-fix
seo-fixtechnical-audit~15 seconds

53 issues found • 53 auto-fixed • Final score: 100

Step 8

Security Hardening

Comprehensive security setup — not just headers, but the full Cloudflare security stack protecting the site from attacks.

Security headers

HSTS with preload, Content Security Policy, X-Frame-Options, Referrer-Policy

cf-security-headers

Bot protection

Cloudflare Bot Management + Turnstile on forms (invisible CAPTCHA alternative)

DDoS mitigation

Cloudflare's automatic DDoS protection at the edge — no server to overwhelm

SSL/TLS

Full (strict) SSL with automatic certificate management, minimum TLS 1.2

WAF rules

Web Application Firewall rules blocking SQL injection, XSS, and common attack patterns

Staging isolation

X-Robots-Tag: noindex on .pages.dev URLs — Google never indexes the test site

cf-security-headers
cf-security-headers~1 second for headers • Cloudflare features configured via dashboard

Step 9

Forms & Interactive Features

WordPress form plugins and third-party widgets are replaced with native alternatives powered by Cloudflare's edge infrastructure.

Form detection

Identify all forms on the site: Gravity Forms, CF7, GoHighLevel iframes

forms

Workers function

Generate a Cloudflare Pages Function (/api/submit) to handle form POST requests at the edge

forms

D1 database

Create a serverless SQLite database (Cloudflare D1) to store every submission

forms

Turnstile protection

Add Cloudflare Turnstile (invisible CAPTCHA) to block bot submissions

forms

Email notifications

SendGrid integration sends formatted HTML emails to staff on each submission

forms

Native HTML form

Replace iframe widgets with clean HTML forms matching the site's brand

forms
forms~5 minutes per form

Workers + D1 + Turnstile + SendGrid — zero third-party iframes

Step 10

Quality Assurance

Multi-layered testing ensures nothing ships broken. Every page is validated against Lighthouse, crawled for broken links, and visually compared to the original.

Lighthouse audit

Run performance, SEO, accessibility, and best practices audits against every page

pagespeed

Broken link check

Crawl every internal and external link, flag 404s and redirects

site-crawler

Visual regression

Compare before/after screenshots to catch missing images, layout shifts, content changes

browser-ui-testing

Mobile testing

Verify responsive layouts at 375px, 768px, and 1024px breakpoints

browser-ui-testing

Form testing

Submit test data through every form, verify D1 storage and email delivery

Accessibility testing

WCAG AA compliance: contrast ratios, keyboard navigation, screen reader landmarks

Static fidelity gate

Automated check for frozen carousels, dead widgets, unsized iframes — blocks deploy if found

static-fidelity
site-crawlerpagespeedbrowser-ui-testingstatic-fidelity~5 minutes

0 failures across 198 pages

Deploy

Ship to production on Cloudflare's global network

1 step • 8 sub-steps

Step 11

Cloudflare Setup & Deploy

The finished site is deployed to Cloudflare Pages with full infrastructure configuration — DNS, caching, redirects, and monitoring.

Pages project creation

Create Cloudflare Pages project, configure build output directory

cf-deploy

Asset upload

Upload all HTML, images, fonts, and static assets to Cloudflare's CDN (300+ edge locations)

cf-deploy

Custom domain

Configure DNS records (CNAME) to point the client's domain to Cloudflare Pages

SSL certificate

Automatic SSL certificate provisioning and renewal via Cloudflare

Redirect rules

Configure 301 redirects for old WordPress URLs that changed during rebuild

Cache rules

Set cache-control headers: immutable for hashed assets, short TTL for HTML

Analytics

Enable Cloudflare Web Analytics (privacy-first, no cookie consent needed)

Monitoring

Set up uptime monitoring and alerting for the production domain

cf-deploy~2 minutes for deploy • DNS propagation up to 24 hours

3,619 files • 300+ CDN locations • Zero-downtime deploys