WordPress(WP)

WP(WordPress)

WPのプラグイン「iPanorama 360」で360°パノラマ写真を公開

360°パノラマ写真(全天球画像)の埋め込みを行えるWordPressプラグインの「iPanorama 360」を試してみました。

 

まずは「iPanorama 360」のをインストールを行います。

管理画面左メニューから「iPanorama 360」を選択します。
プラグイン:WP iPanorama 360

プラグイン:WP iPanorama 360 新規追加
「Add New」をクリックします。

プラグイン:WP iPanorama 360 シーンの追加
「+」をクリックして、Scene(シーン)を追加します。

プラグイン:WP iPanorama 360 写真をアップロード
写真をアップロードします。

WP iPanorama 360 ショートタグをコピー
画面右上からショートタグ([ ipanorama id="6800"]または[ ipanorama slug="xxxx"])をコピーして、投稿画面に移動します。

WP iPanorama 360 ショートタグを貼り付け
公開します。

WP iPanorama 360 再生01
公開ページに移動すると上記の様なページが表示されるので、

「CLICK TO LOAD PANORAMA」をクリックすると、以下の様に再生が始まります。
WP iPanorama 360 再生02
基本的な設定はここまでなんですが、

このままだとユーザーの使い勝手はあまり良くないので、

もう少し使い勝手を良くしていきます。

 

まずは、もう一度「iPanorama 360」の設定画面に移動して、

「General」タブの「Actions」メニューを開きます。
WP iPanorama 360 「Actions」メニュー
「Auto load」と「Auto rotate」を「ON]に変更します。

すると、下記のように、ページへアクセスした時点で自動でパノラマの再生が始まります。
WP iPanorama 360 再生03
次は、複数のパノラマ写真を設定する方法について説明します。
WP iPanorama 360 シーン2を追加

まず、「+」をクリックして、2つ目のScene(シーン)を追加して、更新を行います。

公開ページに移動すると、以下の様に、

パノラマの左側に「◀」「▶」が表示されるので、これでパノラマ写真を切り替えられます。
WP iPanorama 360 再生04

さらに、ここからサムネイル写真を表示させて、もう少し見た目を改良します。
WP iPanorama 360 Controls
「Controls」メニューの「Thumbnails slider control」を「ON」にします。

WP iPanorama 360 サムネイルを追加
「Scene thumb image」を「ON]にして、サムネイル用のパノラマ写真をアップロードします。

公開側ページには、サムネイルが表示されていると思います。
WP iPanorama 360 再生05

あと、最後にデザイン(テーマ)を変更してみます。

WP iPanorama 360 テーマの変更

「Theme」メニューの設定を「DEFAULT」から「MODERN」に変更します。

こんな感じになります。
WP iPanorama 360 再生06

弊社では、以下の方に向けて、WordPressの短期学習プログラムを
格安で提供しております。

  • 個人でWordPressを使ったサイト構築をお考えの方
  • 自社でホームページの構築・運用をお考えの方
  • 企業のWEB担当者の方

内容

基本的には、初心者の方を対象にした学習プログラムです。

※ WordPress制作の上級者の方の場合、弊社の学習プログラムはあまり役に立たないと考えています。

  • ・ WordPressのインストールからセッティングの方法
  • ・ WordPressのテーマ選びについて
  • ・ WordPressのプラグイン選びと設定方法について
  • ・ サーバの準備方法
  • ・ ドメインの取得・管理の方法
  • ・ FTPの設定方法
  • など

ご用意頂くもの

  • ・ ノートPC
    ※ 弊社はWindowsを業務で利用しておりますので、できればWindowsのPCをおすすめしています。
  • WordPressでサイトの制作を考えているが、何から始めればいいのか分からない。
  • ドメインやサーバはどうやって準備すればいいの?
  • そもそもホームページの公開には何が必要なの?

などなど、

どのような内容でも構いませんので、お気軽にお問い合わせ下さい。

お客様の目的をお聞きした上で、最適の学習プランを提案致します。

ご興味のある方は、以下の内容を記載の上、一度お問い合わせ下さい。
こちらより、折り返しメールを致します。

  • ① お名前
  • ② 折り返し先のメールアドレス
  • ③ 希望の学習内容

関連記事

  1. WordPress(WP)

    WP(WordPress)

    WP プラグイン「Delete Custom Fields」で不要なカスタムフィールドを削除

    開発当初の設計ミスであったり、後になっての大幅な仕様変更など、…

  2. WordPress(WP)

    WP(WordPress)

    PHP5.4以上だとWordPressの管理画面上でエラーが出る件

    お客さんから、WordPressの管理画面上に、Warning…

  3. PHP

    PHP

    WordPressの記事を特定の文字数で丸める

    ブログのトップページやカテゴリー、アーカイブページなどで、記事の一…

  4. WordPress(WP)

    WP(WordPress)

    WP アイキャッチ機能なんてものが追加されていた!!

    WordPress3.oからアイキャッチなどというものが追加されていま…

  5. WordPress(WP)

    WP(WordPress)

    【WP】ダブルクォーテーション(")が全角に変換されるのを防止

    WordPress 半角の「"」や「'」が、全角に変換されてし…

  6. WordPress(WP)

    WP(WordPress)

    【WP】PHPのバージョンアップでエラー

    運用中のWordPressで構築したサイトがあるのですが、かなり前…

最近の記事

  1. WordPress(WP)
  2. 404 Not Found
  3. WordPress(WP)
  4. WordPress(WP)
  5. PHP
  6. PHP
  7. 風邪予防
  8. WordPress(WP)
  9. PHP
  10. 宅建
PAGE TOP