How to add Virtual Reality, Photo Spheres and 360° Videos to WordPress

Two days ago, WordPress.com introduced VR and 360° content for all of their users. From now on, bloggers just have to upload photos and videos and decide how they want to display the media. Whether you’re using a desktop or a mobile browser to view the images and videos or you are a proud owner of Cardboard, Gear, Daydream, Rift or Vive, it’s easier than ever to enjoy VR and 360° content on personal sites.

But what if you have made a step forward and started your own WordPress website?

Even if you have the best hosting package, the new feature won’t magically appear on self-hosted blogs, but thanks to resourceful developers, VR technology for WordPress already exists in the form of a free plugin.

WP-VR-view – Add Photo Sphere, 360 video to WordPress

PRICE: Free
DEMO 1
DEMO 2

The days of presenting panoramas as plain flat images are behind us. Facebook introduced this Virtual Reality feature months ago. If you have a panorama that is at least 100 degrees wide, you just need to upload it to the social network and its users will be able to see it as the interactive content. Now, you get to implement the same feature on your WordPress blogs.

Whether you have the joy to capture images and videos via a spherical camera or you simply like to snap panoramas with your smartphone, why not show the media interactively?

How to display a photosphere or 360° video

The only hard part of embedding VR images and videos to your WordPress site will be capturing the good ones. If you have ever tried capturing a nice panorama, you know that the result often doesn’t come up the way you wanted. Hopefully, you’ve mastered your photography skills, but we still suggest that you go through the eight guidelines to taking panoramic photos with any camera. If you want even more control over photospheres, we suggest that you take a look at Google Street View app which comes both in iOS and Android versions. Although Google has seven ways of capturing Street View images, you can still enjoy taking simple photo spheres for your blog.

Now, let’s add that amazing image/video to WordPress:

  1. Install and activate WP-VR-view plugin
  2. Navigate to any post or page and make sure you are in Visual Editor
  3. Find the VR image and VR video buttons on top
  4. After you click the button, add the URL for your media
  5. Add extra parameters if needed
  6. Click the Insert button

Now you get to preview or publish your post which will now have a photosphere or 360° video nicely embedded to it. If you’re familiar with shortcodes, you can still add some extra parameters to the media manually. For example, you change URL, width and height, preview image link, and stereo options for videos. The shortcode will look something like this:

[vrview img=”URL for photosphere/video” width=”600″ height=”400″]

If you are not sure how all of this will look like on your blog, we suggest that you take a peek at the video and the demo sites we linked above.

How to view the new Virtual Reality content

If you thought adding Virtual Reality content is easy and fun, you should take a role of your visitor who gets to see the enjoyable images and videos on your site. While desktop users get to see the content by dragging pictures and videos by mouse, users who load your site via mobile phones and tablets will have even more options. Since portable devices have gyroscopes, you just have to tilt and move the device and the VR content will move accordingly.

All images and videos embedded by WP-VR-view plugin will have the fullscreen option, and if you’re a lucky owner of Google Cardboard, you can even see the content in this special view.

So, how do you like Virtual Reality?

START YOUR OWN BLOG

This guide is an introduction to mastering the art of blogging. It provides easy to follow steps to start, maintain, and grow your blog.

Read the guide

3 thoughts on “How to add Virtual Reality, Photo Spheres and 360° Videos to WordPress

Leave a Reply

Your email address will not be published. Required fields are marked *