How to embed a virtual tour in WordPress
So there you have it, you built a beautiful virtual tour of a property, you added it to your Facebook page, shared it with your friends and now you want to embed a virtual tour in WordPress…. but how exactly is that done??
Today we will explain in detail: How to embed a virtual tour in WordPress
- Get the embed code of your virtual tour
- Open your wordpress installation
- Choose the page / property where you want to show your virtual tour
- Click on “text” (html)
- Add the embed code where you want to show it
Sounds easy right? … no? Ok then follow the detailed instructions below and you will soon display your virtual tours on wordpress!
1. Get the embed code of your virtual tour. (for My360 users)
- When in “overview” click on the property you want to embed
- Click on the tab “virtual tours
- Click on the word “iframe” behind your chosen virtual tour
- Copy the embed code that now shows at the top of your tour
2. Open your WordPress installation
- go to www.yourwebsite.com/wp-admin/ (replacing “yourwebsite.com”with your url name)
- Click on the page / property where you would like to add your virtual tour
3. Click on “text” and paste your code where you would like to see the tour.
And you’re done!
Sometimes, if you have a theme that has been created for real estate, you will already have a built in option for virtual tours, like the theme we are working with “Houzez”
So in this theme you see a button called “360º virtual tour”:
And adding the iframe code in this box, the tour will also show on the site:
Some themes don’t have a “Virtual Tour” features, but they do have a video link feature. Sometimes you can add the URL for the virtual tour in this box and it will show the virtual tour on your site. Mind you, this does not always work, but it is worth a try if the above does not work for you.
You can find the URL of your tour by clicking on “Preview” on the “Iframe” page. Then simply copy the URL to the page.
We hope this has helped!
Oh and as last note, you can change the size of your iframe by changing the width and the height of your frame in the embed code.
So if it is too big (or too small), in the code below you could change 650 to maybe 525 and the 450 to maybe 250. You can play with it until it suits your site.
If you have any doubts about the above, you can of course always contact us, or leave your comments below! Perhaps you have a better way to embed a virtual tour in WordPress? Please share with our readers, we would be interested to know what your way is!