Simple Virtual TourVisit Website →
← Back to blog

How to Embed a Virtual Tour in Squarespace

October 21, 2026
How to Embed a Virtual Tour in Squarespace

The most dependable way to embed a virtual tour in Squarespace is a Code block: you publish the tour with your tour provider, copy its HTML or iframe embed code, paste it into a Code block in HTML mode, save, and check the published page in a private window. The whole job takes a few minutes once the tour is live. Most of the problems people hit come from three things: the wrong block type, a Squarespace plan that will not render iframes or JavaScript, and testing while logged in to the editor.

This guide walks through each step, explains when an Embed block is the better choice, and covers sizing, troubleshooting and accessibility, so the tour works for every visitor on every device.

Simple Virtual Tour
simplevirtualtour.com
Create Tours Ready to Embed
Build interactive virtual tours with customizable software, then use the generated embed HTML to bring your presentation to Squarespace.
View the live demo

TL;DR

  • Use a Code block (not Code Injection) and paste the provider's embed code in HTML mode. Leave the source-display option off.
  • Rendering an iframe or JavaScript in a Code block requires a Squarespace Core, Plus or Advanced plan, or certain legacy plans. Plain HTML works on all plans.
  • Test the published page in an incognito window. Embedded scripts can be hidden from you while you are logged in.
  • Keep the original embed code unchanged until it works, then adjust only the dimensions.
  • Add a heading, a short text description and a contact button around the tour so the page works for everyone.

Table of Contents

What you need before you start

Three things have to be in place before you open Squarespace:

  1. A finished, published tour. Squarespace does not host or build 360° tours. It only displays what another service hosts. The tour needs a public address of its own, whether it lives in a cloud account or on your own server.
  2. Embed code, not a dashboard link. Copy the HTML or iframe code your tour provider generates. A private editing URL will not display for visitors.
  3. A suitable Squarespace plan. Squarespace says plain HTML works in Code blocks on all plans, but JavaScript or iframe rendering requires the Core, Plus or Advanced plan, or certain legacy plans. Almost every virtual tour embed is an iframe or script, so check your plan first. It saves an hour of confusion.

If you use Simple Virtual Tour, the workflow is the same: publish the tour, copy its generated share and embed HTML, and bring it to Squarespace. Check the embed settings in your Simple Virtual Tour dashboard or current documentation for the exact snippet, since that is the source of truth for the code you paste.

Step by step: add a virtual tour with a Code block

This is the method we recommend for nearly every tour.

  1. Open the page. In Squarespace, go to Pages, select the page where the tour should appear, and click Edit.
  2. Pick the spot. Hover over the content area and click an insertion point. A good position is just below your page heading and a sentence or two of introduction.
  3. Add the block. Choose Code from the block menu.
  4. Set the mode to HTML. Paste the embed code from your tour provider. Make sure the option that displays code as plain text is switched off. If it is on, visitors will see raw code instead of a tour.
  5. Save and exit editing. Squarespace may show a blank area or a placeholder in the editor. That is not necessarily a failure.
  6. Preview the live page. Open the published URL in an incognito or private window, not in the logged-in editor.

A typical iframe embed looks like a single line starting with an iframe tag, a source URL pointing to your tour, width and height values, and a fullscreen permission. Do not retype it. Copy it exactly from the provider and paste it unchanged.

Why a Code block and not an Embed block

Squarespace has two blocks that look similar. Embed blocks are designed for external services that support oEmbed, such as video hosts and social posts, where you often only paste a link. A virtual tour player is usually a custom widget rather than a standardized oEmbed item, so the Embed block may reject it or show nothing.

Here is a quick way to decide:

SituationBlock to use
Provider gives you an iframe or script snippetCode block
Provider explicitly supports oEmbed links for SquarespaceEmbed block
Embed block shows an error or an empty boxSwitch to a Code block
You only have a private dashboard URLNeither: get the public embed code first

Why not Code Injection

Code Injection is tempting because it feels more powerful, but it is the wrong default for a single tour. Squarespace positions Code Injection for HTML and scripts at the site or page level, and it is available only on Core, Plus, Advanced and some legacy plans. It also does not apply to checkout pages. A Code block keeps the tour on the page where it belongs, and removing it later is as simple as deleting the block.

Code Injection and Code block differences

Sizing the tour for desktop and mobile

A tour that looks perfect on a laptop can be cramped on a phone. Squarespace also warns that custom code can change appearance or behavior, especially on mobile, so check both.

Start with these habits:

  • Change one thing at a time. Paste the original code, confirm it works, then adjust the height or width.
  • Prefer a percentage width. Setting the width to 100% lets the tour fill the content column instead of overflowing it.
  • Give it real height. A tour needs room to breathe. Many sites pick a height that suits a landscape view on desktop, then raise it slightly for narrow screens.
  • Allow fullscreen. Panoramas feel far more immersive in fullscreen, so keep the fullscreen permission in the iframe code if your provider includes it.
  • Use a full-width section. Place the Code block in a wide section rather than a narrow column.

For a deeper look at responsive behavior across any website builder, our guide on how to embed a virtual tour on a website covers sizing patterns in more detail.

If you publish through Google Street View

Some businesses add a tour through Google rather than their own player. Google's developer documentation explains that the Maps Embed API and the Maps JavaScript API can show interactive 360-degree Street View photo spheres on any website. A static Street View image is an alternative when you do not need interactivity.

This route suits a business whose interior is already on Google Maps, such as a restaurant or a shop. The trade-off is control: you work within Google's viewer and cannot add your own branding, hotspots or product links inside the scene. If you want a branded experience with custom hotspots, a dedicated tour player is the better fit. Simple Virtual Tour also offers a Google Street View publishing plugin, so you can publish to Street View and embed your own branded tour as well.

Troubleshooting a blank or broken tour

If the tour does not appear, work through this list in order.

  1. Test while logged out. Squarespace notes that embedded JavaScript may be hidden from the logged-in editor. Open the live URL in an incognito window before you change anything. This one fix solves most "it is blank" reports.
  2. Check your plan. If you are on a plan that does not render iframes or scripts, the block will stay empty no matter what you paste.
  3. Confirm the mode. The Code block must be in HTML mode with plain-text display off.
  4. Look at where the block lives. Squarespace says Ajax loading and pages inside an index can interfere with custom code. If the tour sits in an index page, move it to a standalone page and test again.
  5. Re-copy the code. Smart quotes or missing characters from a word processor can corrupt the snippet. Copy it again straight from the provider.
  6. Confirm the tour is public. Open the tour's own URL in a private window. If it does not load there, the problem is on the hosting side, not in Squarespace.

One caution: Squarespace says its support team does not troubleshoot third-party code. Your tour provider is the right contact for problems with the player itself, and Squarespace is the right contact for plan and block questions.

After the tour renders, run a quick technical check of the whole page: load speed, headings and indexing. An SEO automation tool for Squarespace sites can help audit that the page with your embed is crawlable and structured well.

Make the page work for every visitor

An immersive viewer should never be the only place where important information lives. Squarespace's accessibility guidance recommends a logical heading structure, descriptive alt text, captions or transcripts for media, and controllable motion. Apply that to a tour page like this:

  • A descriptive heading above the tour, such as the name of the property or venue.
  • A short text summary, or a room-by-room list with the key facts: size, features, capacity or price range.
  • Captions or transcripts for any narration or video inside the tour.
  • A visible call to action below the tour: schedule a showing, request a quote or book a table.
  • A keyboard test. Tab through the page and confirm that visitors can move past the tour without getting stuck inside it.

If your team needs help building custom, accessible web experiences beyond what a no-code builder offers, a virtual reality development company can handle that engineering work. For styling the viewer itself in a way that stays readable, see our article on custom CSS for virtual tours that survive updates and stay WCAG safe.

Our perspective: own the tour, rent the page

We build Simple Virtual Tour, and the question we hear most is not how to paste code. It is where the tour should live. Squarespace is an excellent place to present a tour, but it is a display surface. The tour itself is an asset you will reuse on listings, in emails, on social channels and maybe on a second website next year.

Our perspective: own the tour, rent the page — overview diagram

That is why we offer two deployment models. You can use the cloud-hosted plans, where we host everything, or buy the software once and self-host it with full source code ownership. In both cases the embed process on Squarespace is identical: a Code block and a snippet. The difference is control. Self-hosting means your tours sit on your own server, with no recurring software fee, and it suits agencies, photographers and organizations that care about where client data lives.

Our advice for a first embed: keep it boring. Use one Code block, leave the generated code untouched, test in a private window, and only then style it. Add the text around the tour before you add any clever design. A tour that loads quickly, sits next to clear information and ends with a button will outperform an elaborate page every time.

— Andrea

Create your tour with Simple Virtual Tour

If you do not have a tour yet, Simple Virtual Tour lets you create unlimited interactive tours from 360° panoramas, photos and video, with custom branding, statistics, live sessions and e-commerce integration. There is a Free Forever plan to try it. Paid cloud plans run from €2.99 per month for XS (Starter) and €5.99 per month for S (Creator), through €9.99 per month for M (Professional) and €19.99 per month for L (Business), up to €49.99 per month for XL (Enterprise).

Prefer to own the software? CORE is a $79 one-off purchase, with optional plugins: PLUGIN SAAS at $269 one-off, GSV PLUGIN at $59 one-off and A.I. TOOLS PLUGIN at $39 one-off. You can compare everything on our plans and pricing page or go straight to buy now.

Simple Virtual Tour

Working on a different builder? We have a matching walkthrough for how to embed a virtual tour in Wix, and a broader read on the embedded property tour website approach for real estate.

A pre-launch checklist

Before you share the page, run through this list:

  1. The tour opens in an incognito window on desktop.
  2. The tour opens on a real phone, in both portrait and landscape.
  3. Fullscreen works.
  4. The page has a heading, a text description and a call to action.
  5. The surrounding page loads quickly and nothing overlaps the viewer.
  6. You have saved a copy of the original embed code somewhere safe, so you can restore it if an edit goes wrong.

FAQ

Can I embed a virtual tour on any Squarespace plan?

Not always. Plain HTML works in Code blocks on all plans, but rendering JavaScript or iframes requires the Core, Plus or Advanced plan, or certain legacy plans. Since most tour embeds use an iframe or a script, check your plan before you start.

Why is my tour blank in the Squarespace editor?

Embedded scripts can be hidden from you while you are logged in. Open the published page in an incognito window to see what visitors see. If it is still blank, check your plan, the HTML mode setting and whether the tour is public.

Should I use an Embed block or a Code block?

Use a Code block for most virtual tours. Embed blocks are built for services that support oEmbed, and a tour player is usually a custom widget. If your provider gives you an iframe or script snippet, a Code block is the dependable choice.

Can I change the size of the embedded tour?

Yes, but do it after the original code works. Change only the width and height values in the iframe, then check the page on desktop and on a phone. Avoid editing other parts of the snippet unless your provider documents them.

Does Squarespace host my virtual tour?

No. Squarespace only displays the tour. The tour is hosted by your tour provider, or on your own server if you self-host, and the embed code points visitors to it.

Sources