Skill: michelle447/site-cloner (version 1.0.0)

--- name: site-cloner description: Clone any live website into a self-contained, dependency-free HTML file with all content, styles, fonts, and images extracted and preserved. Use when asked to clone, copy, replicate, or mirror a website; or when the user says "clone this site", "copy this site", "make me a copy of this URL", or "recreate this website". Handles React/Vue/Angular SPAs by extracting from the JS bundle. Optionally deploys to a VPS via nginx and pushes to a private GitHub repo. --- # Site Cloner Clones any live website into a clean, standalone HTML file with all assets. ## Workflow ### 1. Fetch the page ```powershell $html = (Invoke-WebRequest -Uri "<URL>" -UseBasicParsing).Content ``` Check `<script src="...">` and `<link rel="stylesheet" href="...">` tags. ### 2. Detect site type - **Static HTML**: Extract content directly from `$html` - **React/Vue/Angular SPA**: The `<body>` has only `<div id="root">` — extract from the JS bundle instead (see references/spa-extraction.md) ### 3. Extract content from JS bundle (SPA) Download the JS bundle, then mine for: - **UI copy**: `[regex]::Matches($js, '"([A-Z][^"]{10,400})"')` — filter for strings with spaces, no code keywords - **Image paths**: `[regex]::Matches($js, '"(/[^"]+\.(jpg|jpeg|png|webp|svg|avif))"')` - **Nav links**: search for `href:"#` patterns - **Theme/colors**: download the CSS bundle, extract `--[a-z-]+:` custom properties - **Fonts**: look for `family=` in the CSS `@import` URL ### 4. Download all images ```powershell $images = @("image1.png", "image2.jpg") # from step 3 $dir = "C:\Users\MJ\.openclaw\workspace\<site-name>-clone\images" New-Item -ItemType Directory -Force -Path $dir | Out-Null foreach ($img in $images) { Invoke-WebRequest -Uri "<BASE_URL>/images/$img" -OutFile "$dir\$img" -UseBasicParsing -TimeoutSec 25 } ``` ### 5. Build the HTML file Use `write` tool to create `index.html`. Follow the template in references/html-template.md. **Rules:** - Single file, zero npm/build dependencies - Inline all CSS in `<style>` tags using extracted custom properties - Load fonts via Google Fonts `<link>` tag - Reference images as `/images/filename.ext` - Add scroll animations via IntersectionObserver - Add navbar scroll behavior, carousel logic, form toast — all vanilla JS ### 6. Deploy to VPS (if requested) ```powershell # Upload files ssh -i C:\Users\MJ\.ssh\vps_key root@187.124.92.226 "mkdir -p /var/www/<name> && chmod 755 /var/www/<name>" scp -i C:\Users\MJ\.ssh\vps_key index.html root@187.124.92.226:/var/www/<name>/ scp -i C:\Users\MJ\.ssh\vps_key -r images root@187.124.92.226:/var/www/<name>/ ssh -i C:\Users\MJ\.ssh\vps_key root@187.124.92.226 "chmod 755 /var/www/<name>/images" # Write nginx config locally, scp it (never write via heredoc — variable escaping breaks) $config = "server { listen <PORT>; server_name _; root /var/www/<name>; index index.html; location / { try_files `$uri `$uri/ =404; } }" # Write full multiline config to file first, then scp $config | Out-File ".\nginx-<name>.conf" -Encoding ASCII -NoNewline scp -i C:\Users\MJ\.ssh\vps_key ".\nginx-<name>.conf" root@187.124.92.226:/etc/nginx/sites-available/<name> ssh -i C:\Users\MJ\.ssh\vps_key root@187.124.92.226 "ln -sf /etc/nginx/sites-available/<name> /etc/nginx/sites-enabled/<name> && nginx -t && systemctl reload nginx" ``` **Port allocation** (MJW VPS — 187.124.92.226): - 8080 → arnicapatch - 8081 → taylored-touch - 8082 → twisted-roots - 8083+ → next available **Critical nginx gotcha:** Always write the config to a local file and `scp` it. Never use heredoc or `printf` over SSH — `$uri` gets mangled. ### 7. Push to GitHub (if requested) ```powershell cd "<clone-dir>" git init git add index.html images/ git commit -m "Initial clone of <URL>" gh repo create <name>-clone --private --source=. --remote=origin --push ``` If repo already exists: `git remote set-url origin [REDACTED_SECRET]:michelle447/<name>-clone.git && git push` ## Output Always report: - ✅ Local path - ✅ GitHub URL (if pushed) - ✅ VPS URL (if deployed) - Image count downloaded


Security scan verdicts — ClawScan: suspicious | static analysis: clean | VirusTotal: clean | SkillSpector: suspicious (MEDIUM)