guide

Migrate Your Squarespace Site to Astro

Squarespace templates are genuinely beautiful. The design team at Squarespace produces some of the most polished default layouts in the website builder space. If you picked Squarespace for the aesthetics, that was a reasonable decision.

The performance, however, is a different story. Independent benchmarks from DebugBear put Squarespace sites at an average mobile Lighthouse score of 31 — the worst among every major website builder they tested. Largest Contentful Paint averages 8.79 seconds on mobile. Browse the Squarespace forums and you will find users reporting PageSpeed scores in the 40-60 range, regularly told by support that these numbers are “normal.”

If you have decided it is time to move on, Astro is one of the strongest targets for a Squarespace migration. This guide covers why Astro specifically fits the Squarespace use case, every practical approach to making the move, and the gotchas you will run into along the way.

Why Astro is a natural fit for Squarespace sites

Astro was designed for exactly the kind of site most people build on Squarespace: marketing pages, portfolios, blogs, and business homepages. Content-first sites where most pages are the same for every visitor.

The key architectural difference is that Astro ships zero JavaScript by default. Every page is pre-rendered to static HTML at build time. If you need an interactive component — a contact form, an image lightbox, a pricing calculator — you can add React, Vue, Svelte, or Preact components that hydrate only when needed. The rest of the page stays as pure HTML and CSS.

This is the opposite of how Squarespace works. Squarespace renders every page request through its server-side platform, injecting a heavy JavaScript runtime, analytics scripts, and template engine code on every single page load. That is where the 8.79-second LCP comes from.

SquarespaceAstro
Mobile Lighthouse~3195-100
LCP (mobile)8.79s<0.5s
Monthly hosting cost$23-$56/mo$0 (static hosts)
Code ownershipNoFull Git repo
Template constraintsFixed per templateNone
Blog/content systemProprietary editorMarkdown content collections
Framework supportNoneReact, Vue, Svelte, Preact

Astro is used in production by Porsche, Google Firebase, NordVPN, and The Guardian’s engineering blog. It is a mature framework with a large ecosystem of integrations and themes.

How Astro replaces Squarespace’s template system

One of the hardest adjustments when leaving Squarespace is losing the template system. On Squarespace, you pick a template (7.0) or a starting design (7.1), then customize within the editor’s constraints. On Astro, you build layouts from components.

Here is what a typical Squarespace site structure looks like translated to Astro:

my-site/
  src/
    layouts/
      BaseLayout.astro       # Header + footer wrapper (replaces Squarespace template)
      BlogLayout.astro       # Blog post layout with sidebar
    pages/
      index.astro            # Homepage
      about.astro            # About page
      services.astro         # Services page
      blog/
        [...slug].astro      # Dynamic blog post pages
    content/
      blog/
        my-first-post.md     # Blog posts as markdown files
        another-post.md      # With frontmatter for metadata
    components/
      Header.astro           # Navigation
      Footer.astro           # Footer
      Gallery.astro          # Image gallery component
      ContactForm.tsx        # React component for interactivity
  public/
    images/                  # Your images, at full resolution
  astro.config.mjs           # Build configuration

The content/ directory is where Astro’s content collections shine for Squarespace migrants. Each blog post is a markdown file with YAML frontmatter — title, date, tags, featured image. Astro validates this schema at build time, so you get type-safe content without a database or CMS. This directly replaces Squarespace’s blog system, but the files live in your Git repo and can be edited with any text editor or AI agent.

Understanding what Squarespace gives you on export

Before migrating, you need to know what data you can actually extract from Squarespace. Go to Settings → Advanced → Import/Export and Squarespace will generate an XML file.

This XML export uses WordPress’s WXR (WordPress eXtended RSS) format. That is actually helpful, because many tools already know how to parse it. The export includes:

  • Blog posts with full text content, publish dates, categories, and tags
  • Basic page content (text blocks, but not complex layouts)
  • Comments on blog posts
  • Gallery metadata (though not always the full image URLs)

What the XML export does not include:

  • Your design, CSS, or layout configurations
  • Images in a directly downloadable format (you need to extract URLs from the XML or download from your media library)
  • Product/commerce data (that requires a separate CSV export or the Squarespace Commerce API)
  • Custom forms and their submissions
  • Code injection blocks (custom CSS/JS you added)
  • Acuity Scheduling configurations
  • Member area content
  • Navigation structure

The XML export is decent for blogs but incomplete for everything else. That is why most migration approaches involve crawling the live published site in addition to parsing the export.

Six ways to migrate from Squarespace to Astro

There is no single right way to do this. The best approach depends on the size of your site, your technical comfort level, and your budget. Here is every practical option, from most hands-on to most automated.

1. AI coding agents (Claude Code, Cursor, Windsurf, Cline)

This is the approach that has changed the most in the past year, and for many sites it is now the most practical option. AI coding agents can read your Squarespace export, crawl your published site, and scaffold a complete Astro project.

Step-by-step process:

  1. Export your content. In Squarespace, go to Settings → Advanced → Import/Export → Export. Download the XML file.

  2. Save your custom code. If you added anything in Settings → Advanced → Code Injection (header or footer), or custom CSS in Design → Custom CSS, copy those into text files. The export will not include them.

  3. Set up an Astro project. Run npm create astro@latest to scaffold a blank project.

  4. Feed the agent your data. Open the project in Claude Code, Cursor, or Windsurf. Give it the XML export file, your published site URL, and your custom code snippets. A prompt like: “Here is a Squarespace XML export and the live site is at example.com. Parse the XML to extract all blog posts as markdown files in src/content/blog/. Then crawl the published site to capture the page structure, navigation, and any content the XML missed. Build Astro page components that match the current site’s layout and design. Download all images to public/images/.”

  5. Iterate on the design. The agent will produce a working site on the first pass, but you will want to refine the CSS, adjust component structure, and handle edge cases like image galleries or embedded content. This typically takes a few rounds of conversation.

  6. Handle blog content collections. The agent should convert your Squarespace blog posts into Astro content collection files. Each post becomes a .md file with frontmatter. Verify the dates, categories, and featured images transferred correctly.

  7. Deploy. Run npm run build to generate the static output, then deploy to Cloudflare Pages, Vercel, or Netlify. All three have free tiers that handle most sites.

Realistic timeline: 2-8 hours for a typical 10-20 page Squarespace site with a blog. Larger sites with complex galleries or many blog posts may take a full day.

Real-world examples of AI-assisted site migrations: Cursor’s own website (cursor.com) was famously built and iterated with AI assistance. Prefect.io migrated their marketing site using a similar AI-assisted workflow. Sid Bharath has documented using Claude to rebuild client sites from scratch.

2. AI app builders (Bolt.new, v0.dev, Lovable, Replit Agent)

If you are not comfortable working in a code editor, AI app builders provide a more visual workflow. These tools let you describe or show what you want, and they generate a working site.

How it works:

  1. Take screenshots of every page on your Squarespace site.
  2. Go to Bolt.new, v0.dev, or Lovable.
  3. Upload a screenshot and say: “Recreate this page as an Astro component. Match the layout and design as closely as possible.”
  4. The tool generates code you can download, edit, and deploy.
  5. Repeat for each page, then manually add your content.

Pros: No local development environment needed. Visual feedback loop. Good for non-developers.

Cons: You still need to handle content migration separately. The generated code may need cleanup. Works better for design replication than content extraction.

3. The WordPress bridge

Squarespace exports in WordPress XML format for a reason — many people migrate to WordPress first as an intermediate step. This can be useful if you have a large blog archive.

  1. Import the Squarespace XML into a local WordPress installation (or a temporary WordPress.com site).
  2. Use a WordPress-to-Markdown tool like wordpress-export-to-markdown to convert all posts to markdown files.
  3. Drop those markdown files into an Astro content collection.

This extra step sounds roundabout, but the WordPress ecosystem has years of battle-tested import/export tooling. For sites with 100+ blog posts, this pipeline can be more reliable than direct XML-to-markdown conversion.

4. Hire a developer or agency

Not everyone wants to do this themselves, and that is perfectly fine. Squarespace-to-Astro migrations are a growing niche.

  • Freelance developers on Upwork or specialized platforms typically charge $1,000-$5,000 for a full migration, depending on site complexity.
  • Agencies that specialize in Squarespace migrations charge $5,000-$25,000 for larger sites with e-commerce, complex content, or custom functionality.

When hiring, ask specifically about their experience with Squarespace exports and whether they handle image migration, URL redirects for SEO continuity, and blog content transfer. A good developer will also set up your deployment pipeline so you can make updates yourself after the migration.

5. BrowserCat Migrate (automated)

BrowserCat Migrate is an automated migration service that crawls your Squarespace site, extracts content and images, and rebuilds it as an Astro project in a GitHub repo. It handles the extraction and scaffolding steps, which you can then customize. One option among many, starting at $49.

6. Manual DIY migration

The full hands-on approach. This gives you maximum understanding and control, at the cost of time.

  1. Export content as XML from Squarespace.
  2. Run npm create astro@latest and choose the blog starter template.
  3. Parse the XML file to extract blog posts. Tools like sqsp-parser or a custom script can convert posts to markdown.
  4. Create Astro page components for each page type on your site (homepage, about, services, etc.) using screenshots of your Squarespace site as design reference.
  5. Download images from your Squarespace media library (Assets panel in the editor). You may also need to extract image URLs from the XML and download them with a script.
  6. Set up content collections for your blog with proper schemas.
  7. Configure redirects to preserve your URL structure for SEO.
  8. Deploy to a static hosting provider.

Realistic timeline: 1-4 weeks depending on site size and your familiarity with web development.

Migration gotchas specific to Squarespace

Squarespace 7.0 vs 7.1

Squarespace has two fundamentally different template systems. Version 7.0 uses named templates (Brine, Bedford, Pacific, etc.) with template-specific features and layouts. Version 7.1 uses a universal template system with sections and blocks.

This matters for migration because 7.0 sites may have template-specific functionality (like certain gallery layouts or index page behaviors) that does not exist in 7.1, and you will need to understand which template features your site relies on to recreate them in Astro.

To check your version: go to Help → Squarespace Version in your dashboard.

Image handling

Squarespace serves images through its own CDN with automatic resizing. Your exported XML will contain image URLs pointing to Squarespace’s CDN (images.squarespace-cdn.com), but these URLs may stop working if you cancel your Squarespace subscription. Download every image before canceling.

For Astro, place images in public/images/ for static references, or use src/assets/ with Astro’s built-in image optimization (the <Image> component) for automatic format conversion and responsive sizing. The latter is closer to what Squarespace does automatically.

Commerce data

If you are using Squarespace Commerce, the XML export will not include your product catalog. You need to export products separately as CSV, or use the Squarespace Commerce API. If e-commerce is central to your business, consider whether Astro is the right target — Shopify might be a better fit for the commerce layer, with Astro as the marketing frontend using the Shopify Storefront API.

Forms

Squarespace’s built-in forms do not export. You will need to recreate forms using a service like Formspree, Netlify Forms, or a React component with your own backend. Document your form fields and notification settings before migrating.

Custom CSS and code injection

Anything you added in Design → Custom CSS or Settings → Advanced → Code Injection needs to be manually copied before migration. These are the customizations you built on top of the template and they represent real work that should be preserved.

URL structure and redirects

Squarespace uses URL patterns like /blog/post-title for blog posts and /page-name for pages. Map these to your new Astro URL structure and set up redirects (301s) for any URLs that change. This is critical for SEO — losing inbound links hurts rankings.

The performance transformation

The numbers are dramatic because the architectural change is fundamental:

MetricSquarespaceAstro
Mobile Lighthouse~3195-100
LCP (mobile)8.79s<0.5s
TTFB1-2s<50ms (CDN edge)
Page weight2-5MB50-200KB
Core Web VitalsMostly failingPassing

Squarespace renders every page through a server-side platform, injects template JavaScript, analytics, and editor infrastructure code. Every visitor downloads this payload even though the content is the same for everyone.

Astro pre-builds everything to static HTML at build time. A CDN serves the finished files from the edge location nearest each visitor. There is nothing to compute, nothing to wait for. Google’s Core Web Vitals — which directly influence search rankings — improve across the board.

When you should NOT migrate to Astro

Be honest about whether migration makes sense for your situation:

  • You rely heavily on Acuity Scheduling integration. Squarespace owns Acuity and the integration is tight. You can embed Acuity on an Astro site, but it will not be as seamless.
  • You have an active Squarespace Commerce store with inventory management. Migrating e-commerce is significantly more complex than migrating a content site. Consider Shopify instead, or keep Squarespace for commerce and build a separate Astro marketing site.
  • Your team genuinely cannot handle any technical workflow. Editing markdown files or working with Git is not hard to learn, but it is a real change from the Squarespace visual editor. If no one on your team can invest time in learning a new workflow, the migration may cause more problems than it solves.
  • You are happy with your site’s performance and cost. Not every Squarespace site needs to be migrated. If your site loads fast enough for your audience, your traffic does not depend heavily on SEO, and the monthly cost is not a concern, there may be no compelling reason to move.

Life after migration: the editing workflow

One of the biggest adjustments after leaving Squarespace is the daily editing experience. On Squarespace, you log into a visual editor, click on text, and type. On an Astro site, you have several options:

  • Edit markdown files directly. Blog posts and content pages live as .md files. Open in VS Code, make your changes, commit, and your deployment pipeline publishes automatically.
  • Use an AI coding agent. Tell Claude Code or Cursor “update the pricing on the services page” and it edits the file for you. This is faster than the Squarespace editor for many types of changes.
  • Add a headless CMS. If you want a visual editing experience, connect Astro to a headless CMS like Decap CMS (free, Git-based), Sanity, or Contentful. This gives you a web-based editor similar to Squarespace’s, but your site remains fast and code-owned.
  • Edit on GitHub directly. For quick content changes, you can edit markdown files right in GitHub’s web interface and the site auto-deploys.

The tradeoff is real: Squarespace’s visual editor is more intuitive for non-technical users. But the code-based workflow is faster for technical users, and AI agents are rapidly closing the gap for everyone else.

Getting started

The simplest first step is to export your Squarespace content. Go to Settings → Advanced → Import/Export → Export and download the XML file. This is non-destructive — it does not affect your live site. Save your custom CSS and code injection blocks too.

Once you have your data, pick the migration approach that fits your situation. For most sites, an AI coding agent plus a few hours of refinement will produce a working Astro site that is dramatically faster, completely free to host, and yours to own and modify forever.

Automate Everything.

Tired of managing a fleet of fickle browsers? Sick of skipping e2e tests and paying the piper later?

Sign up now for free access to our headless browser fleet…

Get started today!