360-Photosphere-Embed-on-Squarespace

Simple code to make use of a 360º photosphere on a Squarespace page.

Big thanks for A-Frame for making it all happen with great examples! https://aframe.io/examples/showcase/sky/

Read more on the blog post: https://www.caseyjscalf.com/blog/2022/3/21/360-photosphere-embed-on-squarespace-9dfhr

1. Find yourself a 360º photosphere image that is “flat”. Like the one below.

2. Right click and “Open Image in New Tab”.

3. Grab the URL from the image.

4. Remove any arguments for low res at the end so the URL ends in .jpg.

5. Create an “Embed Block” on your page. This works for free sites. You can also use a “Code Block”.

6. Paste in the code from the GitHub and replace the URL with the one you grabbed above.

7. Paste it all in the block and view the page from a normal browser window.

8. Good to go you should be able to click and drag your way around the 360º scene!