How To Add Your Google Virtual Tour To Your Website

How To Add Your Google Virtual Tour To Your Website

Basic Instructions

To add your Google Virtual Tour to your website, you can use Google Maps on a desktop computer to create an iframe that can be easily embedded. Follow the instructions below to embed your virtual tour on your website:

  1. Open Google Maps on your desktop computer
  2. Search for your business or location in Google Maps
  3. Select the virtual tour from the image gallery
  4. Navigate through the tour and choose the view you wish to share
  5. Click on the three dots in the upper left-hand corner of the page to open the menu
  6. Click on “Share or embed image”
  7. Click on “Embed map”
  8. Choose the size of the iframe that you want to embed on your website
  9. Copy the code that is generated
  10. Paste the code into the HTML or code editor of your website where you want to embed your virtual tour.

Detailed Step By Step Instructions With Images

Step 1.

Open Google Maps on your desktop computer.

Step 2.

Search for your business or location in Google Maps.

Step 3.

Select the virtual tour from the image gallery. The virtual tour can be found in the image gallery by selecting the Street View & 360° category in your Google Business Profile or by selecting a photo in your gallery with the 360° symbol in the bottom left hand corner of the image.

Step 4.

Navigate through the tour and choose the view you wish to share.

Use the arrow buttons on your keyboard or click and drag with your mouse to change your viewpoint. As you move through the virtual tour, you can also use the navigation controls in the lower right corner of the screen to zoom in and out, rotate the view.

Bonus Tip:

The view you choose in (Step 4.) will be represented exactly as it was chosen when you add the virtual tour to your website. Choosing Here are a few bonus tips to make your tour look amazing on your website.

  • Center the most important content in the center of the view.
  • When possible, drag the viewpoint to allow all of your vertical lines to appear straight up and down.
  • Keep an eye on the navigation arrows. It is a best practice to share a view in the tour that allows the viewer to step forward, when possible.

Good

Not so good

Step 5.

Click on the three dots in the upper left-hand corner of the page to open the menu.

Step 6.

Click on “Share or embed image”

Step 7.

Click on “Embed map”

Step 8.

Choose the size of the iframe that you want to embed on your website

Step 9.

Copy the code that is generated

Step 10.

Paste the code into the HTML or code editor of your website where you want to embed your virtual tour.

Results

iframe Code Example

<iframe src="https://www.google.com/maps/embed?pb=!4v1683739547169!6m8!1m7!1sCAoSLEFGMVFpcE9Ndmo0YzIxSTZCX2lFUlVkNkpPcXJGd01Ld0R3N3luSVJLRDlV!2m2!1d39.51256662991792!2d-84.3851453430326!3f312.6033372298786!4f-0.8417707417209215!5f0.833588273487803" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>

Embedded Virtual Tour Example

Conclusion

“How do I add my virtual tour to my website?”, is by far, the most common question we receive from our clients. If you have any questions or issues adding your virtual tour to your website feel free to reach out to us anytime. We are always happy to help.

To learn about even more ways you can share your virtual tour online or for more in-depth information about best practices, check out our, Ultimate Guide to Sharing Your Virtual Tour.

Scroll to Top