Josh Knapp
b511a6684d
Includes new page templates (fitness-gym, nonprofit, online-course, photography-studio, real-estate, startup-company, travel-blog, wedding-invitation) with thumbnail SVGs, test specs, documentation files, and minor updates to index.html, router.php, and playwright config. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
216 lines
5.8 KiB
Markdown
216 lines
5.8 KiB
Markdown
# Windows Export Fix - Copy HTML Feature
|
|
|
|
## Problem
|
|
Windows Defender SmartScreen blocks downloaded ZIP files and HTML files from the site builder, preventing extraction and opening.
|
|
|
|
## Solution: Copy to Clipboard Export 🎉
|
|
|
|
Added a new **"Copy HTML"** button that completely bypasses Windows security warnings!
|
|
|
|
### How to Use
|
|
|
|
1. **Build your site** in the editor as normal
|
|
|
|
2. **Click Export** button in top navigation
|
|
|
|
3. **Click "Copy HTML"** button (new option next to Download ZIP)
|
|
|
|
4. **Open Notepad** (or any text editor)
|
|
- Windows Key → Type "Notepad" → Enter
|
|
- Or right-click desktop → New → Text Document
|
|
|
|
5. **Paste** the HTML
|
|
- Press `Ctrl + V`
|
|
- The entire HTML code will appear
|
|
|
|
6. **Save the file**
|
|
- File → Save As
|
|
- Change "Save as type" to **"All Files (*.*)"**
|
|
- Name it `index.html` (or whatever you want)
|
|
- Save to a folder of your choice
|
|
|
|
7. **Open in browser**
|
|
- Double-click the saved `index.html`
|
|
- Or right-click → Open with → Your browser
|
|
- **No Windows warnings!** ✅
|
|
|
|
### Why This Works
|
|
|
|
- No file download = No Windows SmartScreen scan
|
|
- No ZIP extraction = No security prompts
|
|
- Pure text copied to clipboard = Completely safe
|
|
- You create the file yourself = Windows trusts it
|
|
|
|
### Comparison
|
|
|
|
| Method | Windows Warning | Steps | Multi-Page |
|
|
|--------|----------------|-------|------------|
|
|
| **Copy HTML** | ❌ None | 4 steps | One page at a time |
|
|
| Download ZIP | ⚠️ Always | 6+ steps + unblocking | All pages at once |
|
|
|
|
### Tips
|
|
|
|
**For Single-Page Sites:**
|
|
- Use "Copy HTML" - fastest and cleanest
|
|
|
|
**For Multi-Page Sites:**
|
|
- Copy each page individually, OR
|
|
- Use Download ZIP and unblock the .zip file first:
|
|
1. Right-click downloaded .zip
|
|
2. Properties → Unblock → Apply → OK
|
|
3. Then extract normally
|
|
|
|
**Save Multiple Pages:**
|
|
```
|
|
Copy page "Home" → Save as "index.html"
|
|
Copy page "About" → Save as "about.html"
|
|
Copy page "Contact" → Save as "contact.html"
|
|
```
|
|
|
|
### Advanced: Create a Project Folder
|
|
|
|
```
|
|
C:\MyWebsite\
|
|
├── index.html (Home page - copied from editor)
|
|
├── about.html (About page - copied from editor)
|
|
├── contact.html (Contact page - copied from editor)
|
|
└── images\ (Upload your images here)
|
|
```
|
|
|
|
**Link between pages:**
|
|
```html
|
|
<!-- In your link settings -->
|
|
URL: about.html ← Relative path
|
|
URL: contact.html
|
|
URL: index.html ← Back to home
|
|
```
|
|
|
|
### Still Getting Warnings?
|
|
|
|
If you still see warnings when opening your saved HTML file:
|
|
|
|
**Fix 1 - Unblock After Saving:**
|
|
1. Right-click your saved `index.html`
|
|
2. Properties
|
|
3. Check "Unblock" at bottom
|
|
4. Apply → OK
|
|
|
|
**Fix 2 - Save to a Trusted Location:**
|
|
- Save to `C:\Users\YourName\Documents\Websites\`
|
|
- Windows trusts Documents folder more than Downloads
|
|
|
|
**Fix 3 - Use a Local Web Server:**
|
|
```bash
|
|
# If you have Python installed
|
|
cd C:\MyWebsite
|
|
python -m http.server 8000
|
|
|
|
# Then open: http://localhost:8000
|
|
```
|
|
|
|
## Technical Details
|
|
|
|
### What Gets Copied
|
|
|
|
The "Copy HTML" button generates a complete, self-contained HTML file:
|
|
|
|
```html
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Your Page Name</title>
|
|
|
|
<!-- Google Fonts (if enabled) -->
|
|
<link href="https://fonts.googleapis.com/..." rel="stylesheet">
|
|
|
|
<!-- Embedded CSS -->
|
|
<style>
|
|
/* Reset & base styles */
|
|
/* Responsive rules */
|
|
/* Your custom styles */
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<main id="main-content">
|
|
<!-- Your page content -->
|
|
</main>
|
|
</body>
|
|
</html>
|
|
```
|
|
|
|
### Clipboard API
|
|
|
|
Uses modern `navigator.clipboard.writeText()` for secure copying:
|
|
- Requires HTTPS or localhost
|
|
- User permission granted automatically (no prompts)
|
|
- Works in all modern browsers (Chrome, Firefox, Edge, Safari)
|
|
|
|
### Browser Compatibility
|
|
|
|
| Browser | Copy HTML | Download ZIP |
|
|
|---------|-----------|--------------|
|
|
| Chrome 76+ | ✅ | ✅ |
|
|
| Firefox 63+ | ✅ | ✅ |
|
|
| Edge 79+ | ✅ | ✅ |
|
|
| Safari 13.1+ | ✅ | ✅ |
|
|
|
|
## Future Enhancements
|
|
|
|
Potential improvements for next version:
|
|
|
|
1. **"Copy All Pages"** - Generates a `.txt` file with all pages separated by comments
|
|
2. **"Create Desktop Folder"** - Uses File System Access API to create folder structure
|
|
3. **"Generate README"** - Includes deployment instructions in copied text
|
|
4. **"Export as Gist"** - One-click upload to GitHub Gist
|
|
5. **"Share Link"** - Upload to free hosting (Netlify, Vercel) directly
|
|
|
|
## Troubleshooting
|
|
|
|
### "Copy HTML" button doesn't work
|
|
- **Cause:** Browser doesn't support Clipboard API
|
|
- **Fix:** Update to latest browser version
|
|
- **Workaround:** Use Download ZIP method
|
|
|
|
### Copied HTML doesn't paste
|
|
- **Cause:** Clipboard permission denied
|
|
- **Fix:** Reload page and try again
|
|
- **Workaround:** Click Download ZIP instead
|
|
|
|
### Styles don't work in saved file
|
|
- **Cause:** External resources blocked (Google Fonts, etc.)
|
|
- **Fix 1:** Make sure you're online when opening the file
|
|
- **Fix 2:** Disable "Include Google Fonts" before copying
|
|
- **Fix 3:** Use a local web server (see above)
|
|
|
|
### Images don't show
|
|
- **Cause:** Image URLs point to site-builder canvas, not real files
|
|
- **Fix:** Upload images to your hosting, update URLs in editor before copying
|
|
|
|
## Summary
|
|
|
|
**The "Copy HTML" button is your best friend on Windows!**
|
|
|
|
- ✅ Zero security warnings
|
|
- ✅ Zero file unblocking needed
|
|
- ✅ Works with all Windows versions
|
|
- ✅ Safe, simple, fast
|
|
|
|
**When to use:**
|
|
- Single-page sites (always!)
|
|
- Testing/previewing your site
|
|
- Quick exports
|
|
- Sharing code with others
|
|
- Learning/education
|
|
|
|
**When to use Download ZIP:**
|
|
- Multi-page sites (10+ pages)
|
|
- Production deployment
|
|
- Need all assets in one folder
|
|
- Uploading to web hosting service
|
|
|
|
---
|
|
|
|
**Now go build something awesome without Windows getting in your way!** 🚀
|