The following article will guide you step by step on how to upload your 360 animation project to your personal Squarespace Website.
The very first step is to upload your 360 animation project on a hosting website
First of all, your 360 project should be uploaded already on a hosting server. We will use https://stream.iconasys.com in this tutorial
Fig. 1 - The iFrame URL is located in the same block of the uploaded 360 animation project. Click 'Copy iFrame URL' to copy your link.
In this step we need to login on https://www.wix.com:
Fig. 3 - Creating a new website. You will be prompted to set a website description and to give it a final name
After creating your new website, you will be redirected to your personal dashboard. On the left side of your dashboard you have a List panel with all of your websites.
Click on Manage & Edit Site blue button (see Fig. 4):
Fig. 4 - Manage & Edit your website by clicking on it
The last part of the tutorial is how to insert your iFrame code to your personal website page.
After clicking the Manage & Edit Site button, you will be redirected to your Administration page of that selected website (see Fig. 5):
Click Edit SIte to start editing your website
Fig. 5 - Your personal website dashboard
Now you have entered your website. You can choose a template, personalize, add images, etc.
The first thing you need to do before inserting your iFrame animation is to search for the <iframe> plugin from Wix -> Add Apps (see Fig. 6):
Fig. 6 - Your website editing panel is located on the left side of the main website window
Start searching by typing iframe in the search field:
Fig. 7 - Searching the iframe plugin. Click on it when it appears in the search dropdown
The second thing is to Add to site the iframe plugin. Click on the blue button (Fig. 8):
Fig. 8 - Click on the '+Add to site' button to install your plugin and to start embed your iframe animation
Now the iframe canvas has been added to your website page. You can move it around, resize and place it anywhere you want.
Click on Enter Website Address:
Then click on Code to Add your html iframe animation and check(Fig. 9):
Fig. 9 - Here we insert our <iframe> html tag
<iframe allowFullscreen='allowFullScreen' src="https://stream.iconasys.com/viewer.php?application=360&type=iframe&id=c5d9636719c7764f35104aa7814b2b2e9012fcda" width="700" height="500"> </iframe>
Reference for the iFrame tag can be found here: https://www.w3schools.com/tags/tag_iframe.asp