Back to Support Content and Media Embedding 360° Photos and Virtual Reality (VR) Content

Embedding 360° Photos and Virtual Reality (VR) Content supports embedding 360° photos. This will show the 360° photo in a viewer that lets users explore the image in the browser, via Google Cardboard, or using VR headsets like Oculus Rift, HTC Vive, or Google Daydream.

Real Examples

Here’s an example of an embedded 360° photo:

In addition to embedding 360° photos, you can embed your panorama photos in the same viewer. This will allow a more cinematic experience where you can explore your panoramas big in a VR headset. Here’s how that looks:

How to Take 360° Photos

You can take your own 360° photos in a number of ways. The easiest method is to download the right camera app for your smartphone if your phone does not already have this feature built-in. The Google Street View app, for example (available for Android and iOS), lets you point your camera all around you to stitch together a “photosphere”, which is the same as a 360° photo. Other popular 360 apps include Panorama 360.

You can also use dedicated hardware such as the Ricoh Theta to take 360° photos with a single click.

How to Embed 360° Photos supports embedding 360° photos using a shortcode. You can take the following steps:

  1. Go to My Site → Media and upload your 360° photo.
  2. Click on the photo once, then click Edit.
  3. Copy the URL:
  1. Assemble your shortcode in the format below. The path-to-photo.jpg is the URL you copied in Step 3.

[vr url=path-to-photo.jpg view=360]

  1. Add the shortcode to any page or post using a Shortcode block.

For panorama photos as shown in the second example above, the shortcode requires a slightly different format:

[vr url=path-to-photo.jpg view=cinema]

360° Video (Beta)

These instructions are referring to the WP Admin interface. To view this interface, click the View tab in the upper right corner and select Classic view.

We currently support embedding of 360° videos as an experimental beta feature. Uploading of 360° video content requires VideoPress. Playback of 360° videos is supported in all browsers except iOS Safari and experimental Chrome.

To embed 360° video, follow these steps:

  1. Go to Media and click on the 360° video you want. If the video is not in your Media library yet, you can upload it now.
  2. View the shortcode as shown in the image below. You only want the videopressguid which is the string of characters that follows wpvideo just before the closing ] symbol.
View the video shortcode from WP Admin → Media
  1. In the post or page that you want to show this 360° video on, add a Shortcode block.
  2. Insert your shortcode in the format below, replacing videopressguid with your videopressguid from Step 3.

[vr guid=q739qW9b view=360]

Was this guide helpful for you?

Not quite what you're looking for? Get Help!

Copied to clipboard!