動画素材.com/ブログ

VJ 映像素材・4K2K CG ムービー素材・書籍「動画素材123」、PV・MVなどの公開、映像制作関連、Mac・iPhone・iPadとか。動画素材.comの管理人ブログです。

VR 360 WordPress

WordPressでVR画像やVR動画を表示できる【WP-VR-view】を試してみる。

投稿日:2017年1月3日 更新日:


WordPressでVR画像やVR動画を表示できるプラグイン【WP-VR-view】を試してみます。

https://ja.wordpress.org/plugins/wp-vr-view/


ちょっと前にWordPress上で360°の画像を表示できるという記事を見かけたのですが、

VR と 360° コンテンツがすべての WordPress.com サイトで利用可能になりました
https://ja.blog.wordpress.com/2016/12/16/introducing-vr-and-360-content-for-all-wordpress-com-sites/


WordPress.com サイトで利用可能とあるようにWordPress.comドメイン上?でないとこれは利用できないようです。
それとVR動画の方は「https://videopress.com/v/」にアップしたものでないと使えないとの事です。


という事で、WordPressの記事上でVR画像やVR動画の表示はできないものかという事でプラグイン【WP-VR-view】を使ってみます。

WP-VR-view

まずWordPressのプラグインから新規追加で「WP-VR-view」を検索します。

WP-VR-view

今すぐ「インストール」をクリック、その後に「有効化」をクリックします。


適当なVR画像を「メディア」にアップロードします。

アップロードしたらURLアドレスをコピーします。

170103-0005

うちの環境だとWordPressの記事編集画面の「テキスト」では出てこないのですが、「ビジュアル」には出てくるこのアイコンをクリックします。

170103-0006

そうするとウィンドウが出てくるのでそこの1番上と2番目の欄に先ほどコピーしたVR画像のURLをペーストします。

170103-0007

「Insert」ボタンをクリックすると [vrview img= から始まるVR画像が入力されたタグが入力されていますのでそれで保存して公開すればVR画像が公開できます。このように↓


iPhoneなどのiOSのブラウザでVR画像を見るとこんな感じに。

img_2780

画像右下にあるこのマークをタップすると

img_27802

この画面になるので

img_2781

これでiPhoneを横にするとこうなります。Cardboardに対応して2眼になります。

img_2782

ちなみにVR動画を掲載したい場合は

VR画像の時と同じようにWordPressの記事編集画面の「ビジュアル」にして今度は右のこのアイコンをクリック、1番上の欄にMP4ファイルのURLを入力します。

170103-0006d

[vrview video= から始るタグが入力されます。
この状態で公開するとこのようになります。↓


VR動画の場合はimgプレビューは関係ないっぽいと思ったんですが、

170103-0010

iOSとか非対応のブラウザだとimgプレビュー設定しないとエラー画像になりますね。ま、どっちにせよiOSではVR動画の再生はできないっぽいです。

img_2783

PCだと問答無用にVR動画は再生のようです。

以上です。とりあえずWordPress上でVR画像の再生はできる事がわかりました。


あ、あとWordPressの記事編集画面の「ビジュアル」でないと出てこないので、できれば「AddQuicktag」を使って登録した方が「テキスト」では扱いやすいと思います。

https://ja.wordpress.org/plugins/addquicktag/

投稿者プロフィール

ES... ( Molojun )
ES... ( Molojun )
もうだいぶ前からになりますがクラブVJをやっていました。 そこから映像関係のお仕事をやるようになり、コンサートや企業プレゼン、展示会などのムービーを創ったり、時にはプレゼンテーション素材をつくったりするようになりました。
今はPVなども制作したり動画素材を配布・販売したりしています。

■書籍も出しました【動画素材123+45】168本のFHD動画素材を収録しています。

◆もうちょっと詳しいプロフィールはこちらへどうぞ

▼動画素材.com 作者へのサポートをお願いいたします。
Amazonほしいものリスト

-VR 360, WordPress

執筆者:


コメントを残す

関連記事

wordpress%e3%81%ae%e8%a8%98%e4%ba%8b%e7%b7%a8%e9%9b%86%e3%81%a6%e3%82%99%e6%a4%9c%e7%b4%a2%e7%bd%ae%e6%8f%9b%e3%81%97%e3%81%9f%e3%81%84%e6%99%82%e3%81%ab%e4%bd%bf%e3%81%a3%e3%81%a6%e3%81%84%e3%82%8bch

WordPressの記事編集で検索置換したい時に使っているchrome拡張機能【Search and Replace】

WordPressの記事編集中にこの単語をこれに全部置き換えたいといった時に自分が使っているchrome拡張機能【Search and Replace】をご紹介します。 https://chrome. ... 続きを読む

SyntaxHighlighter Evolvedでクリップボードにコピーアイコンが表示されていない時の対処方法(WordPress) Image.3

SyntaxHighlighter Evolvedで「クリップボードにコピー」アイコンが表示されていない時の対処方法(WordPress)

現在WordPressでブログをやっていますが、時々コードなりなんなりを表示させる時がありまして、 その時に使っているのが「SyntaxHighlighter Evolved」です。 SyntaxHi ... 続きを読む

VR360 上半球 動画素材

VR(360°)上半球 動画素材を追加しました

VR(360°)上半球 動画素材を 追加しました。 10本追加しています。 ロイヤリティーフリー(著作権使用料無料)です。 http://動画素材.com/movie79VR.html 投稿者プロフィ ... 続きを読む

【THETA S】360°写真撮影・スライドショーにして360°の4K動画をYouTubeにアップロード9

【THETA S】VR360°撮影時にiPhoneを置く場所をつくる【RICOH】

【THETA S】での撮影時でちょっとした工夫というかiPhoneの置き場をどうするかってのを書いておきます。 RICOH デジタルカメラ RICOH THETA S 360°全天球イメージ撮影デバイ ... 続きを読む

【THETA S】360°写真撮影・スライドショーにして360°の4K動画をYouTubeにアップロード9

【THETA S】VR360°写真撮影・スライドショーにして360°の4K動画をYouTubeにアップロード【RICOH】

今回は【THETA S】で360°の写真撮影をしてスライドショーを作成、4Kサイズの動画にしてYouTubeにアップロードまでという手順を説明していきます。 今回360°の4K動画をつくってアップロー ... 続きを読む

新刊「動画素材123+45 まるごとフリーでつかえるムービー素材集」


・大人気の動画素材集シリーズ第4弾は、過去2作品から選りすぐりの動画がフルハイビジョンで復活! 

新作も加えた〈123+45〉=〈168点〉、2層式DVD-ROM × 2枚組みの大ボリュームでお届けします!!12/17全国書店で発売です。商用利用にも使えます。


FHD動画素材123本収録「動画素材123FULL」 動画素材123FULL

動画素材123FULL
まるごとFREEでつかえるムービー素材集










2017年2月
« 1月  
 1234
567891011
12131415161718
19202122232425
262728 



CLOSE
CLOSE