Embed a 360° photo on your website
Paste the address of a 360° photo, choose a size, and copy the snippet: an interactive panorama with drag, zoom, gyroscope and VR support, on any page that accepts HTML. No plugin, no account, no hosting fee.
Embed code generator
The photo needs to be at a public web address (your own site, an image host, or a photo uploaded to Orbix360). Photos on your computer are never uploaded by this site, so they need hosting first.
The snippet also comes out of the viewer itself: open a photo from a link on the free 360° viewer, turn to the direction you want visitors to see first, and press Share & embed. That version records the starting view (yaw, pitch and zoom) in the code.
How the embed works
The iframe loads a chrome-less copy of the viewer at free360viewer.com/embed/360-viewer with the photo's URL in the query string. Your visitors' browsers fetch the photo directly from wherever it is hosted; the viewer only reads it. The embed includes the same controls as the full viewer: drag and scroll on desktop, swipe and pinch on mobile, Gyro on phones, VR where a headset or motion sensors are available, plus autorotate, reset and screenshot.
The `allow` attribute in the snippet (`gyroscope; accelerometer; xr-spatial-tracking`) is what lets the embedded page use motion sensors and WebXR. Some page builders strip unknown attributes; if gyro or VR stop working in an embed, check that those permissions survived.
Sizing and responsive layouts
The viewer fills whatever box it is given, so the presets (640×480, 800×600, 1280×720) are just starting points. For a full-width responsive embed, wrap the iframe in a container with a fixed aspect ratio and let the iframe fill it:
- Set the iframe to `width="100%"` and give the wrapper `aspect-ratio: 16 / 9` (or `padding-top: 56.25%` for older browsers) with the iframe positioned absolutely inside it.
- Keep the height at least 300 px on phones; a very short viewer is hard to drag.
- Avoid lazy-loading plugins that replace iframes with placeholders; they sometimes drop the `allow` attribute.
Platform notes
- WordPress: add a Custom HTML block (block editor) or switch the classic editor to the Text tab, and paste the snippet. Some security plugins strip iframes for non-admin authors.
- Squarespace: use a Code block set to HTML. Embeds work on all current plans.
- Webflow: drop in an Embed element and paste the code.
- Wix: use the Embed HTML element; give it enough height in the editor because Wix does not auto-size iframes.
- Notion: paste the URL of the embed page itself (the `src` value from the snippet) as an Embed block rather than the iframe code.
- Shopify: paste into the product description's HTML view or a custom Liquid section.
- Plain HTML or React: paste as-is; in JSX rename `allowfullscreen` to `allowFullScreen` and `frameborder` to `frameBorder`.
When to host on Orbix360 instead
A free iframe is ideal for a single panorama on a page you control. If you need several photos linked as a tour, hotspots that jump between rooms, your own logo on the viewer, or you simply have nowhere to host the image, Orbix360 hosts the photos and provides a tour embed with those features. The free plan covers unlimited tours; paid plans add branding, privacy controls and larger uploads.
Frequently asked questions
Is the 360° photo embed free?
Yes, with no limits on views and no watermark other than a small "Powered by Free360Viewer.com" link in the corner of the embed.
Where does the photo have to be hosted?
Anywhere that serves the image at a direct http(s) link: your website, a CDN, an image host, or an Orbix360 upload. Links from some cloud drives open a preview page rather than the file and will not work.
The embed shows an error loading the image. Why?
The host is probably blocking cross-site reads. The viewer retries through a same-origin proxy that streams the bytes without storing them, but hosts that require sign-in or block hotlinking cannot be embedded.
Does VR work inside an embed?
Yes, as long as the iframe keeps the allow="gyroscope; accelerometer; xr-spatial-tracking" attribute. Headset browsers open an immersive session; phones switch to Cardboard mode.
Try it now
Everything above works in the viewer on this site: pick a 360° photo, look around, step into VR, export a video or grab an embed code. Photos never leave your browser.
