You can embed 360° photos and videos using the VR Viewer plugin.

Once you’ve activated the VR Viewer plugin in Plugins > All you embed your 360° content in posts and pages using the following shortcode:

[vrview url="{URL}" stereo="false" width="100%" height="400px"]

This embeds the 360° photo in a viewer where your readers can explore the image in their browser, via Google Cardboard or using VR headsets like Oculus Rift, HTC Vive, or Google Daydream.

Here is an example of a 360° photo:

In addition to embedding 360° photos, you can embed your panorama photos in the same viewer.  To do this you need to use the following shortcode:

[vrview url="{URL}" 360="false" stereo="false" width="100%" height="400px"]

Here is an example of a panorama:

You explore these images on your:

  • Computer – using click and drag.
  • Phone – titling to change angles.
  • Cardboard Viewer – for virtual reality experience.

Take 360° photos

There are numerous ways to take your own 360° photos.  You don’t need an expensive 360 camera to take 360° photos and the easiest way to get started is using Google Street View (available for Android and iOS) on your smartphone.  You can also use photo sphere mode in the stock Android camera or surround shot mode on Samsung phones (open your camera app then tap on Mode > Download > and download surround shot).

The apps on the smartphones all work the same.  Pick an interesting spot where you want to capture a 360° photo, open the app on your smartphone and move your smartphone around to pass over the circles until all images are taken.

Important tips:

  • How you hold your smartphone and move it affects the quality of your 360° photo.  Watch how to create a photo sphere video to learn how to hold and move when taking 360° photos on smartphones.
  • Start with shooting outdoor nature scenes as there is less chance of stitching errors compared to shooting architecture or areas with geometrical lines.

Embed 360° photo

Once you’ve activated the VR Viewer plugin in Plugins > All you embed your 360° content in posts and pages as follows:

1. Go to Media > Add New.

Add New Media

2.  Click on Select Files and upload your 360° photo (or video).

3.  Click on Edit once the photo has uploaded.

Edit media

4. Scroll down the Edit Image screen and copy the File URL.

Copy File URL

5.  Go to Posts > Add New.

Add New Post

6.  Write your post.

7.  Place your cursor where you want the 360° photo to appear.

8.  Add the VR Viewer shortcode.

[vrview url="{URL}" stereo="false" width="100%" height="400px"]  

The URL is replaced with your file URL.

If you are using the block editor you need to add a shortcode block.

To add a shortcode block, you click on the + icon at the left of any empty block or at the top left of the editor then search for shortcode and click on the shortcode block.

This is what the shortcode block looks like:

Now add the code into the shortcode block.

Shortcode added to block

If you are using the classic editor you add the code into the post/page where you want to see your embedded 360° photo.

9.  When you view the post you should see your embedded 360° photo.