Landing Page Copying Workflow

📋 What I Need From You

1. Screen recordings (mobile + desktop) — scroll through the entire page

2. Link to the original page — so I can inspect CSS/elements in the browser

3. Shopify ZIP — base theme to merge into

🔧 My Process

Extract & Analyze

Extract frames from video recordings (1fps). Use browser to inspect actual page (exact CSS, colors, SVGs).

Document the Structure

List every section: name, visual elements, content type, special features (gradients, sticky headers, etc.)

Build Sections (One at a Time)

Each section = .liquid file with:
✅ Inline CSS in <style> tag
✅ Minimal schema: only name, settings, blocks
❌ NO presets in schema (causes silent rejection)
❌ NO default on url type settings
❌ NO literal newlines in default strings

Create Layout

Custom layout that hides default header/footer. Clean wrapper for {{ content_for_layout }}.

Create Template JSON

Maps all sections with pre-filled content adapted for the brand. References layout + all section files.

Validate Everything

JSON validation on all schemas + template. Check all section types exist as files.

Merge & Package

Copy base theme → add new sections + layout + template → ZIP.

⚠️ Shopify Schema Rules

Rule	Why
NO `presets`	Causes silent rejection for template-based sections
NO `default` on `url` type	URL settings can't have string defaults
NO literal newlines in strings	Invalid JSON control character
NO `tag`, `class`, `max_blocks`	May cause silent rejection

📦 Deliverables Checklist

✅

All schemas validated (no JSON errors)

✅

Template JSON validated

✅

All section types in template exist as files

✅

Layout file exists and referenced correctly

✅

ZIP created and tested

✅

Content pre-filled with brand copy

🏷️ Section Naming Convention

Prefix per page type (gut-*, pq-*, prelander-*) to prevent conflicts between different landing page projects.

← Back to All Workflows

1:1 Landing Page Copy Workflow