Blog Deployment SOP

Learned the hard way -- Apr 7, 2026 -- 10+ hours of failures condensed into 7 steps

THE RULE THAT WOULD HAVE SAVED 10 HOURS

Never tell Robert a blog is ready without fetching the RENDERED page and verifying every element.
API 200 != page renders correctly. Check the OUTPUT not the INPUT.

Upload Images

Build Content

Verify Save

CSS + JS

Lazy-Load Fix

Purge 3 Caches

Verify Rendered

Upload ALL Images First

Download from morpheus source
Upload to WP Media Library via REST API
Verify EACH returns image/* content-type (GET, not HEAD)
If returns text/html -- the file was NOT uploaded, it redirects to homepage
Map every source filename to its WP URL
HTML files (iframes): WP blocks them. Build inline SVG/CSS alternative instead.

Build Content (Clean HTML Only)

Start from Audrey's body HTML
REMOVE: nav, body, html, head, style, script tags
REMOVE: hero-img + hero-text divs (Oxygen template handles title/featured image)
REMOVE: container div wrapper (breaks Oxygen sidebar grid)
REMOVE: onclick, onchange, data-click (WP strips them)
REPLACE: all image src with verified WP Media URLs
CHECK: no orphaned closing div tags that escape the content wrapper
Fresh post (no Oxygen meta) uses Template 59 automatically

Verify Content Survived WP Save

GET post with context=edit after saving
Check raw content has ALL custom CSS classes (stat-card, faq-item, cta-box, etc.)
If classes are STRIPPED: post has stale Oxygen meta. Delete _ct_builder_shortcodes.
Check no image src points to morpheus or uses relative paths
Check no orphaned closing div in first 500 chars
Count every widget element vs expected (faq-item=10, quiz-q=6, cam-option=4, etc.)

CSS + JS via Code Snippet (Not Content)

CSS: scope ALL rules under .blog-sidebar-article-content
CSS: remove global reset (*{margin:0}) -- kills the whole page
CSS: hide Oxygen H1 if using custom H1: body.postid-XXXX .blog-sidebar-article-heading
CSS: sticky nav top:80px (Oxygen header height), 46px on mobile
JS: ALL click handlers via addEventListener in DOMContentLoaded (not onclick)
JS: add data-nowprocket to script tag (prevents WP Rocket deferral)
JS: remove raw JSON-LD from JS block -- put in separate ld+json script tag
JS: test showCameraResult accepts (scenario, clickedEl) not bare event.currentTarget

Fix WP Rocket Lazy-Load (Critical)

WP Rocket replaces ALL img src with SVG placeholders
data-no-lazy attribute DOES NOT WORK
skip-lazy class DOES NOT WORK
do_rocket_lazyload filter DOES NOT WORK
FIX: output buffer in template_redirect that reverses SVG swap via preg_replace
Scope to is_single(POST_ID) only
Replaces src="data:image/svg+xml..." back to real URL from data-lazy-src

Purge ALL THREE Cache Layers

Layer 1: Cloudflare CDN -- purge_everything via API
Layer 2: WP Rocket server cache -- user clicks "Clear and Preload Cache" in admin bar
Layer 3: Browser cache -- user does Ctrl+Shift+R or tests in incognito
ALL THREE must be cleared. Missing one = stale page.

Verify RENDERED Page (Not API)

Fetch with curl -A "Mozilla/5.0" (not API endpoint)
Check: SVG placeholders = 0
Check: all image src are real WP URLs returning image/* content-type
Check: CSS ID (sewer-camera-blog-css) in head
Check: JS ID (sewer-camera-blog-js) in footer with data-nowprocket
Check: blog-sidebar-column present (sidebar rendering)
Check: oxy-stock-content-styles present (content inside wrapper)
Check: all widget elements exist with expected counts
Check: JS functions exist (showCameraResult, quizSelect, calcEmergency, etc.)
ONLY THEN tell Robert it's ready. Not before. Never before.

Traps That Cost 10 Hours (Memorize These)

Trap	What Happens	Fix
Orphaned </div>	Content escapes wrapper, sidebar disappears	Remove the orphan, check first 500 chars
Stale Oxygen meta	Post ignores Template 59, layout breaks	Delete _ct_builder_shortcodes from post
WP Rocket lazy-load	All images replaced with SVG placeholders	Output buffer in template_redirect
onclick stripped	Widgets present but don't respond to clicks	addEventListener delegation in DOMContentLoaded
HEAD returns 200	Image URL looks valid but is homepage redirect	GET and check content-type is image/*
Draft preview	Template doesn't fully render	Publish first, verify, decide visibility after
wpautop adds <br>	Flex layouts break with line break elements	CSS: hide br in affected containers
base64 in snippet	Content renders but bypasses template	Use the_content filter or plain post_content
container div	Breaks Oxygen 2-column grid layout	Remove wrapper, let template handle width
Claiming "done"	Robert finds it broken, trust erodes	Verify RENDERED output EVERY TIME