マーターポート3Dモデルを埋め込む

マーターポート3Dモデルを埋め込む

最終更新日：2020年12月09日 07:13

マーターポート3Dモデルのリンクをいつでもシェアでき、リンクをカスタマイズできるだけでなく、

モデルを直接ウェブサイト内に埋め込むこともできます。

 

YouTubeと同じような仕方で、次のような形でマーターポートモデルはウェブページの真ん中に表示されます。

 


  

方法

1．モデルをPublicに設定します。

 

2．モデルを追加したいウェブページを識別します。

 

3．次のHTMLソースコードをウェブページに追加します。

〇<iframe width="853" height="480"

 src="https://my.matterport.com/show/?

m=xxxxxxxxxxx" frameborder="0" allowfullscreen

 allow="xr-spatial-tracking"></iframe>

 

〇的確な命令はウェブサイト独自のコードに応じて異なります。

 

4．src属性内のURLを置き換えます。

〇例：https://my.matterport.com/show/?m=xxxxxxxxxxx

(上で表示したもの)の代わりに、特定のマーターポートモデルへのURLを使用します。


〇さらに、付加的なURLパラメーターを追加することもできます。

 

5．埋め込む際に、「allowfullscreen」をiframeコードに含めます。


〇これにより、聴衆はモデルをフルスクリーンモードか、VRで見ることができます。


サードパーティーのCMC
（ワードプレス、Drupal、Wix、Zendesk、Medium）を使用する



サードパーティー製のコンテンツ管理システムを使ってウェブサイトを管理する場合、

そのページのHTMLソースコードを開き、次の説明にしたがって進めてみましょう。

 

1．CMSバックエンドにログインします。

 

2．編集したい投稿／ページ／記事を見つけます。

 

3．CMSビューを切り替えてソースコードを見つけます。

〇これは大半の場合、CMCの中で＜／＞をクリックすることで可能です。

下記を参照して下さい。

 


 

〇コードを検索して、＜iframe＞を貼り付ける場所をはっきりと見極めるには、基本的な

HTML知識が必要です。


〇特定のCMS(私たちはZendeskを使用)は、iframeが適切に作動する上で、

「Allow unsafe HTML」を選択することが必要な場合があります。

 

Wordpress CMC


Wordpress.comはiframeを許可しません。

つまり、マーターポート3DモデルをWordpress投稿に埋め込むことはできないということを意味します。
しかし、Wordpress CMCを使用するウェブサイトは、iframeを許可しています。
つまり、iframeコードをあらゆるページに直接貼り付けることができるというわけです。
そのために、次のWPプラグインを使用できます：

 

1． Embed.lyプラグイン

 

2．Embed.lyのマーターポートサポートプラグイン

 

3．iframe プラグイン

 

4．WP3Dモデル

 

Wix



次の指示にしたがって、マーターポートモデルをWixページに埋め込んでみましょう。

 

1．コードを埋め込むことを希望するWixページを開きます。

 

2．「Add」→「More」をクリックしてサイトに埋め込みます。

 

3．表示される灰色のボックスをドラッグして、ページ上に埋め込まれた物を再配置します。

 

4．「Enter Website Address」をクリックします。

 

5．URLをフィールド内に貼り付けます。3Dショーケースがボックス内に現れます。

 



Mediumブログ投稿



次の指示にしたがって、マーターポートモデルをMediumブログ投稿に埋め込んでみましょう。

 

1．コードを埋め込むことを希望するMediumページを開きます。


2．「＋」ボタンをクリックして、新しいセクションを追加します。


3．＜＞をクリックして、コードを埋め込みたいということを指定します。


4．3DモデルのURLを貼り付けます。

 


  

Placester


次の指示にしたがって、マーターポートモデルをPlacesterに埋め込んでみましょう。

 

1．コードを埋め込むことを希望するPlacesterのページを開きます。


2．「＜＞」というHTMLアイコンをクリックします。

 


 

3．iframe埋め込みコードを貼り付けます。

 

4．「＜＞」というHTMLアイコンをクリックして、ビジュアルエディターに戻ります。

〇こうしてiframeが直接埋め込まれたことが表示されます。

 

5．変更を保存して、埋め込まれた物がウェブサイト上で作動します。

 

このプロセスに関するさらなる情報は、Placesterのサポートページで見ることができます。


HTMLソースコードに直接アクセスする


もしCMCが変更を許可しない場合には、ウェブサイトのウェブ担当者に問い合わせをして、

アクセス許可を求めることができます。
ウェブサイトのHTMLを編集する権限がある場合には、
​HTMLソースコードに、直接＜iframe＞コードを追加してみましょう。



    • Related Articles

    • マーターポート3Ｄモデルを開く

      最終更新日：2020年5月14日 16:38 Emailからモデルを開く   マーターポート・キャプチャからモデルをアップロードした後、処理が完了したらemailが送信されます。 次の件名のものを見つけましょう：   「Example Model」is ready to view   「Example model」とはキャプチャappにて入力してモデル名です     リンクをクリックすれば、スペース詳細ページへ直接飛ぶことができます。 モデルへログインして開く  ...

    • マーターポート3Ｄモデル用のティーザー動画

      最終更新日：2020年8月19日 04:02 ティーザーとは、マーターポートモデルの最高の部分を紹介する映像クリップのことです。    Emailを通じた販売キャンペーンや、FacebookやTwitterといったソーシャルメディアに投稿する上で 効果的な手段です。 ダウンロードとシェア  1．my.matterport.comに行き、マーターポートモデルを開きます。   2．Mediaタブの中にあるVideosをクリックします。   ...

    • マーターポートクラウド、ワークショップ、３Dショーケースとは？

      最終更新日：2020年11月21日 03:18 空間をスキャンした後に、３Dモデルを管理、編集および視聴する上で、 マーターポートは3つのツールを提供します。 マーターポートクラウド マーターポートクラウド（my.matteport.com）は、マーターポートによる３Dモデルをホストして 管理するためのウェブポータルです。 マーターポートクラウド上から、3Dモデルの名前の変更やフォルダー内での管理、 また詳細な統計値を取得したり、コラボレータを招待することに加え、 ...

    • マーターポート3DモデルをVimeoやYouTube上にアップロードできますか？

      申し訳ありません。 マーターポートモデルはインタラクティブな3D空間であり、固定された動画ではありません。 そのため、マーターポート3DモデルをVimeoやYouTubeに直接アップロードすることはできません。 しかし… 自分がマーターポートモデルを探索している映像を作成することはできます。 この映像フッテージを編集して、VimeoやYouTubeにアップロードすることは可能です。

    • マーターポートクラウドに必要な動作環境（MY.MATTERPORT .COM）

      最終更新日：2020年6月25日 13:10 概要 マーターポートクラウド（my.matterport.com）を使用する上で下記の物が必要です：   ウェブブラウザー 最新のコンピューターとウェブブラウザーがあれば十分に作動します。 ノートパソコンやデスクトップパソコンが望ましいものの、スマートフォンでも機能します。 インターネット 一般的なブロードバンドかケーブル式の物が必要です。 強力で安定したインターネット接続が必要です。   ブラウザー  次のブラウザーがサポートされています：     ...