SmaPanoクラウドの埋め込み機能「Webボックス」に、画像をアップロードする方法をご紹介します。
▼参考例のツアーを見てみる。
https://smapano.com/pano?flag=3&projectid=1721&locale=ja&code=13188,13285,13286,13287&start_scene=13188
SmaPano埋め込み機能「Webボックス」
Webボックスに画像をアップロードする方法
1. 「埋め込み」ボタンをクリックして、埋め込み設定画面に入ります。
2. 「＋新規作成」ボタンをクリックして、埋め込み新規作成画面で設定していきます。
 |
ここでは、レイヤー選択は「パノラマ内」を選択しました。
– テンプレートアイコン – よりお好みのアイコンを選択し、プレビューに表示されたアイコンを、ドラッグし、埋め込みを設置したいところにアイコンを移動させます。
3. 埋め込みで「Webボックス」を選択します。
4. HTMLファイル編集にある「イメージアイコン」をクリックします。
 |
5. 画像のプロパティ画面が表示されるので、「サーバブラウザ」をクリックします。
 |
6. アップロードをクリックし、アップしたい画像を選択します。
 |
7. アップロードが終わるとサムネイルが表示されるので、そちらを選択します。
 |
8. 画像のプロパティ画面が表示されるので、「OK」をクリックします。
 |
9. 表示サイズやアイコン名（任意）を設定することができます。
アイコン表示「表示する」を選択し、「保存」をクリックします。
 |
「プレビュー」をクリックし、確認してみましょう。
設置したアイコンをクリックすると、
 |
Webボックス内にアップロードした画像が表示されました。
 |
Webボックス外をクリックすると、Webボックスは閉じます。
画像を差し替える方法
1. 「埋め込み」ボタンをクリックして、埋め込み設定画面に入ります。
2. アイコン一覧より、差し替えたい埋め込みの「編集」の文字をクリックします。
 |
3. 埋め込み編集画面になりますので、HTMLファイル編集に表示されている差し替えたい画像をクリックして選択状態にし、「イメージアイコン」をクリックします。
 |
4. 画像のプロパティ画面が表示されるので、「サーバブラウザ」をクリックします。
 |
5. アップロードをクリックし、差し替えたい画像を選択します。
 |
6. アップロードが終わるとサムネイルが表示されるので、そちらを選択します。
 |
7. 画像のプロパティ画面が表示されるので、「OK」をクリックします。
 |
8. 埋め込み編集画面になり、表示サイズやアイコン名（任意）も再び設定することができます。
アイコン表示「表示する」を選択し、「保存」をクリックします。
 |
「プレビュー」をクリックし、確認してみましょう。
設置したアイコンをクリックすると、
|
Webボックス内に差し替えアップロードした画像が表示されました。
 |
Webボックスは、よりイメージに合うように編集が可能です
埋め込み編集画面のHTMLファイル編集で文字を入れたり、表示サイズをお好みの数値に変更して入力することも可能です。
 |
上記の設定で、このような表示になりました。
 |
よりイメージにあった見せ方や、さまざまな情報を盛り込むことが可能な「Webボックス」です。
ぜひご活用ください！