Gemini Canvas Site Porting

The fastest way to move Squarespace sites to a free self-hosted environment while keeping your links intact.

Part 1: Generating the Site

1

Access Gemini

Navigate to gemini.google.com and sign in.

2

Turn on Canvas

In the chat box, look for the "Tool" expander at the bottom. Select "Canvas" to enable the side-by-side site previewer.

3

Prepare Assets

Copy the URL of your Squarespace site. Optionally, upload a screenshot for the AI to "see" specific design elements.

4

Paste the Porting Prompt

"I am porting my site from Squarespace to self-hosted. Recreate the page at [PASTE_URL_HERE] in a single file using Tailwind CSS, Vanilla JS, and FontAwesome. CRITICAL: Map the navigation links to end in .html (e.g., /services becomes services.html) so I can host these files while preserving my original link structure. Open this in Canvas."
5

Review & Save

Review the site in Gemini. Once ready, click the download button in the editor.

Local Organization: Create a folder on your computer named site/. Save each page inside as site/<page_name>.html (e.g., site/index.html, site/about.html).
6

Repeat this for each page you would like to port.

Handling Images

Gemini cannot save your images for you. For full recreation, you must save images from your original site locally.

Ask the AI agent: "How can I save the images from my current site locally so they match the HTML paths you just generated?"

Part 2: Preview & Hosting

1. Local Verification

You can open your .html files locally in any browser to see if they look right and check if the navigation between pages works.

2. Deployment

Once ready, proceed to upload the site/ folder to Cloudflare Pages or your own server to host for free.

Cloudflare Step-by-Step Move DNS (Squarespace to Cloudflare)

Why Cloudflare Pages?

  • $0 hosting (versus Squarespace's monthly fee)
  • Faster page load times globally
  • Automated SSL (https) included