Now that your Google Street View virtual tour is live, you can embed the interactive content onto your existing website. Adding the virtual tour to your website is a great way to showcase your venue online and have any site visitors virtually walk inside your business. To do this simply follow the steps below.
Step 1:
You will be adding an ifame code snippet to your website from Google. To get the code, open a browser window and go to the Google virtual tour link we provided to you in the “How to Embed Your Google Tour” email.
You will be adding an ifame code snippet to your website from Google. To get the code, open a browser window and go to the Google virtual tour link we provided to you in the “How to Embed Your Google Tour” email.
Step 2:
Navigate to a starting position within the virtual tour; the point at which you want the tour to begin on your website. It will embed exactly as shown. Click on the icon with 3 vertical dots in top-left corner, located to the right of the business name.
Navigate to a starting position within the virtual tour; the point at which you want the tour to begin on your website. It will embed exactly as shown. Click on the icon with 3 vertical dots in top-left corner, located to the right of the business name.
After clicking, select "Share or embed image." Click "Embed image" tab in the window that opens.
Choose the size you want the virtual tour to display in. You can select this from the drop down list on the left. The default size is set to "Medium" however you can change this to "Small" or "Large". You can also create a custom size of your choosing. Click and copy (CTRL + C) the embed code to the right of the size drop down. It should be highlighted and start with “<iframe src="https”.
Step 3:
Navigate to the page you want to embed the virtual tour on and paste (CTRL + V) the code to your website editor. Depending on how your website was built this may vary.
● If your page was built using an online website builder like Squarespace, Weebly or GoDaddy, you will need to navigate to the page you want to embed the virtual tour on and add a section that allows you to write custom code.
● If your page was built using HTML/CSS, you will need to navigate to the section of the code where you want the virtual tour to display.
Once pasted, save the edits and re-publish or update your website.
Navigate to the page you want to embed the virtual tour on and paste (CTRL + V) the code to your website editor. Depending on how your website was built this may vary.
● If your page was built using an online website builder like Squarespace, Weebly or GoDaddy, you will need to navigate to the page you want to embed the virtual tour on and add a section that allows you to write custom code.
● If your page was built using HTML/CSS, you will need to navigate to the section of the code where you want the virtual tour to display.
Once pasted, save the edits and re-publish or update your website.
Step 3:
Embedding is complete! The virtual tour should now show up on your website and be viewable to all your visitors.
Embedding is complete! The virtual tour should now show up on your website and be viewable to all your visitors.
