「Pannellum」Panorama Viewer for the Web

wordpress で360度panorama写真を表示する

Pannellum は、軽量で無料のオープンソースの Web 用パノラマ ビューアです。
HTML5、CSS3、JavaScript、WebGL を使用して構築されており、プラグインは不要です。

DocumentationページのA simple exampleから3種類のやり方で表示してみました
　　　　　　　１-<iframe>を使う
　　　　　　　２-Standalone
　　　　　　　３-API

<iframe>を使う

Standalone

https://hosizorahananosita.net/wp-content/themes/pannellum/pannellum.htm#panorama=https://hosizorahananosita.net/wp-content/uploads/2023/05/R0011481_20230517130602-scaled.jpg

API

１、ダウンロードしたファイルをwordpressのテーマファイルディレクトリにアップロードしておきます。

２、pannellum.htm、pannellum.css、pannellum.jsのurlを自身のファイルのありかに置き換える

３、表示する画像ファイルのurlを置き換える

　　　　　　　　　それだけです。

　　　　　　　　　その他様々なオプションも付け加えることができます
　　　　　　　　　画像サイズ／自動でロードするなど