This article covers the quick and easy steps needed to embed a Google Street View virtual tour on your own website. You might want to embed the outside view of the street taken by the Google cars, or you might want to embed the inside virtual tour of your business taken by a Google certified photographer. Either way it’s easy to do. Since 360° imagery offers so much visual information people tend to engage with it for longer on your website than normal still photos, this added time spent on your page improves your website metrics and can contribute to stronger rankings on Google.

Finding the HTML code

To embed Google Street View on your website you need to find the code:

  1. Navigate to the view you want to embed.
  2. Up the top left click the 3 buttons
  3. Select ‘share or embed image’
  4. Select ‘Embed image’ up the top left
  5. Copy code

Add the HTML code to your website

Once you have copied the Google Street View code you want to embed, it is simply a matter of additing it to your website. Depending on what content management system you are using this is done in various ways.

  • Typically navigate to the page you want to embed it on and look for an option to add HTML code
  • Paste in the HTML code you copied
  • Publish your updated website

An example

To embed this Google Street View tour of Bruce Wayne’s residence (secret bat cave) below I followed these steps.

First I navigated to the Street View tour of Bruce Wayne’s residence on Google Maps then I selected the three dots up the top left and ‘share or embed’.

Note: If you are looking for 360° Street View imagery for inspiration, take a look at the Google Street View gallery here. Or if you know what you want but need a professional photographer, then look at hiring a Google certified professional to take 360° imagery for you and/or to build a Google Street View tour.

Second, I made sure I had the right size and starting view by moving the image to the view I wanted and I updated the size by clicking on ‘Medium’ for more options. Once happy,  I copied the HTML code.

On this website we’re using WordPress as the content management system (CMS), so adding the virtual tour was as simple as selecting ‘HTML’ up the top right of the content box and pasting in the HTML code.

Tags: , , , , ,

Post a Comment