360度画像はそのままアップロードしたのではこのようになってしまいます。
360度を動かして見られるようにするには、専用のソースコードが必要です。
jsを使用したHTMLソースで360度画像をホームページに埋め込む
<script src=”https://rawcdn.githack.com/MozillaReality/immersive-custom-elements/v0.1.0/build/immersive-custom-elements.js”></script>
<img-360 src=”https://in-ranch.com/360/nico.JPG” width=”700″ height=”550″></img-360>
この記述で試したところ、なんと写真が反転してしまいました。
文字が反転しているのがわかりますか？
js配布サービスを利用する
次にjsソースの配布サービスを利用してみました。
https://www.aizulab.com/blog/javascript-library-immersive-custom-elements/
反転は解消されましたが、全面表示になってしまいました！
プラグイン「WP VR」をインストール
https://hyakuyattsu.com/create/360-wordpress-2019
まず360度画像をライブラリにアップします。
タイトルを入力して、画像なので「SCENES」を選択。
UPLOADをクリックして該当画像を選びます。
うまくいきました
こちらのサイトにさらに詳しく書いてありましたので参考に。
https://wp-customize.net/wordpress/8393.html
飯田市でホームページ制作・広告運用をサポート｜デザインスタジオiR
牧内理恵
まきうちりえ
飯田市在住、広告制作歴20年以上。これまで200名以上のクライアント様と向き合い、100件以上のサイト制作を手掛けてきたデザイナー兼エンジニアの牧内理恵です。御社の強みを引き出し、業績アップに繋がるWebサイト・ネットショップ・販促ツールをご提案します。拠点とする長野県内はもちろん、全国各地からのご依頼にも柔軟に対応しております。
「相談してよかった」と言っていただける、飯田下伊那地域のパートナーとして。
長野県飯田市を拠点に、ホームページ制作やECサイト構築、Web運用のトラブル解決を承っています。20年以上のキャリアで培った「伝わるデザイン」と「確かな技術」で、御社の業績アップを支えます。飯田・下伊那エリアはもちろん、全国からのオンライン相談も大歓迎です。
「ホームページを作りたい」「ホームページをリニューアルしたい」といったご依頼もお気軽にお声がけください。
※強引な勧誘は一切ありませんので、安心してお悩みをお聞かせください。
