goldsounds

This plugin provides a [vrview] shortcode that embeds 360′ mono-and-stereoscopic images and videos into your WordPress website using Google’s “<a href="https://developers.google.com/cardboard/vrview" rel="nofollow ugc">VR Views</a>” library. On devices supporting VR (such as Google Cardboard devices), a link appears that will display the content in full-screen VR mode.
As per the VR Views spec:
<blockquote>
VR Views allow you to embed 360 degree VR media into websites on desktop and mobile, and native apps on Android and iOS. This technology is designed for developers of traditional apps to enhance them with immersive content. For example, VR Views make it easy for a travel app to provide viewers with an underwater scuba diving tour as they plan vacation or for a home builder to take prospective buyers on virtual walkthrough before the home is built.
VR Views also address a common developer concern, namely the limited availability of VR hardware amongst the general public. Although VR Views support true stereoscopic VR playback through compatibility with Google Cardboard, they default to a simple “magic window” mode that works on everything from desktop browsers to mobile apps without any special hardware.
</blockquote>
This plugin allows you to embed VR Views in the recommended way – by self-hosting the vrview.js file. This enables you to embed any content uploaded to your site without needing to perform CORS hackery.
The shortcode syntax follows exactly the parameter spec of VR Views themselves:
<ul>
<li>image or video: {String} URL of image or video to load. (required)</li>
<li>is_stereo: {Boolean} true if content is in stacked stereo format. (optional, default false)</li>
<li>preview: {String} URL of still preview to load first. (optional, default none)</li>
<li>start_yaw: {Number} Initial yaw of viewer, in degrees. (optional, default 0)</li>
<li>is_yaw_only: {Boolean} true if motion is restricted to yaw only. (optional, default false)</li>
</ul>
e.g. [vrview image=”//photovrse.com/examples/coral.jpg” is_stereo=”true”]
The content itself could be captured on any device which supports capturing 360 images or video. My preferred app is the <a href="https://play.google.com/store/apps/details?id=com.google.vr.cyclops&hl=en" rel="nofollow ugc">Google Cardboard Camera</a> (Android-only)
You can see the shortcode above in action here: http://goldsounds.com/vrview-test/
For tips on converting Cardboard Camera images, check out these resources:
<ul>
<li>http://vectorcult.com/2015/12/extracting-the-audio-stereo-pair-from-cardboard-camera-3d-panoramic-images/</li>
<li>http://edward.io/blog/extracting-google-cardboard-photos.html</li>
</ul>
<h3>Credits</h3>
Virtual Reality Goggles icon by Felisberto Piazza from the Noun Project

VR Views

Embed photospheres and 360 degree videos in mono or stereoscopic formats, and view in "VR Mode" using Google Cardboard.

darteweb

DImage 360 is a plugin to embed a 360 view on your WordPress website. It is a user friendly and feature rich plugin to add a responsive 360deg view or 180deg panorama on website.
It is a simple and easy to customize plugin to embed single or multiple images on website. To embed multiple image, you currently need to add multiple instance of shortcode on the post or page of website.
<h3>Features</h3>
<ol>
<li>No Flash Needed</li>
<li>Compatible with chrome, Firefox, IE8, IE9, Safari</li>
<li>You can zoom to the image.</li>
<li>Support JPG.</li>
<li>Support both mouse and touch.</li>
<li>You can full screen the panorama for detail view.</li>
<li>Multiple Image can be loaded on single page, by using multiple shortcode.</li>
</ol>
<h3>How to use</h3>
<h4>Shortcode</h4>
<ol>
<li>
If you are using Gutenberg then follow the following instructions otherwise step 2 instructions:-
<ol>
<li>
Click on the + icon showing on the top left corner of the page and select Common Blocks and then select Dimage 360.
</li>
<li>
Now a block appears on the page with the following options:-
<ul>
<li>
Select Image :- Select an image from media.
</li>
<li>
Auto-Rotate :- It is the feature to auto rotate of image. Default it setup as true.
</li>
<li>
Control :- It is the feature to show control on the image or not. Default it setup as true.
</li>
<li>
Allow Scroll to Zoom :- It is the feature to zoom in or zoom out by just scrolling. Default it setup as true.
</li>
<li>
Zoom Level :- You can set zoom level from 0 to 100. Default it setup as 0.
</li>
<li>
Animation Speed :- You can set animation speed from 0 to 100. Default it setup as 2.
</li>
<li>
Position :- Defines the default position, the first point seen by the user. Default it setup as 0.
</li>
</ul>
</li>
</ol>
</li>
<li>
<code>[dimage attachment_id="56" control=true auto-rotate=true]</code> 
 (Recommended) 
attachment_id: you will get from media manager, you only need to add attachment id.
control{true/false}: It is the feature to show control on the image or not. Default it setup as true.
auto-rotate{true/false}: It is the feature to auto rotate of image. Default it setup as true.
zoom_level: You can set zoom level from 0 to 100. Default it setup as 0.
anim_speed: You can set animation speed from 0 to 100. Default it setup as 2.
default_position: Defines the default position, the first point seen by the user. Default it setup as 0.
Example<code>[dimage attachment_id="56" zoom_level="10" anim_speed="10"]</code>
</li>
<li>
<code>[dimage url="please enter here image url" control=true]</code> 
 url: The url of the image, this will be the complete path of the image, which you will get from media manager itself. 
For Example: <code>[dimage url="http://domain-name.com/wp-content/uploads/10/image-name.jpg" control=true]</code> 
Here replace [domain-name.com] with your domain name. Also rename the image name too. 
control{true/false}: It is the feature to show control on the image or not. Default it setup as true.
</li>
</ol>

DImage 360

DImage 360 is a plugin to embed a 360 view on your WordPress website. It is a user friendly and feature rich plugin to add a responsive 360deg view or …

VR Views vs DImage 360