モジュール · Meeton Chat · 埋め込みモード

埋め込みモード

隅のランチャーではなく、ページの一部としてのチャットです。常に開いていて、ページの流れの中にあり、お問い合わせ・サポート・「相談する」専用ページ向けです。貼り付けるのは iframe を1つだけで、その中の DynaMeet 自身のページがローダーを埋め込みモードで動かします。このページでは、それで何が変わり、御社のページに何ができて何ができないかを説明します。

左: 通常のページ上のタグ。右: 埋め込みモード。チャットがインラインで開いたまま、ランチャーも広告もありません。

スニペット

設定 → Meeton AI → セットアップ → 設置、またはセットアップガイドのインラインに埋め込むからコピーします。teamId は入力済みです。チャットを表示したい場所に貼り付けます。

HTML · チャットを表示したい場所

<!-- DynaMeet inline chat -->
<iframe
  src="https://app.dynameet.ai/iframe-embed.html?teamId=YOUR_TEAM_ID"
  title="DynaMeet"
  style="width: 100%; height: 600px; border: 0;"
  allow="fullscreen; camera; microphone; autoplay"
></iframe>

サイズ

iframe がチャットの枠です。レイアウトに合わせて style の幅と高さを調整してください。自動リサイズはないので、会話に持たせたい高さを与えます。600 px が無理のない既定で、チャットは与えられた枠いっぱいに広がります。

動く場所

iframe の中、app.dynameet.ai 上です。ホストされたページが URL から teamId を読み、mode: "embed" をセットして meeton.js を自分で読み込みます。御社のスニペットで mode を指定することはありません。

許可リスト

埋め込みはブラウザのリファラーから設置先のページを報告し、そのホスト名は他と同じくドメイン許可リストにある必要があります。サイトがリファラーを送らない、または検出できないページから埋め込む場合は、セットアップのホストページを検出できないときも埋め込みを許可をオンにします。

タグは残す

埋め込みはサイトの他のページの meeton.js を置き換えません。埋め込みページでも訪問者を認識し、フォームを監視し、ページビューを数えたいなら、そのページにもタグを置いてください。

埋め込みモードで変わること

通常	埋め込みモード
隅にランチャー。チャットはページの上に開く	ランチャーなし。チャットは最初から開いていて iframe いっぱいに広がり、閉じるボタンもありません。
マーケティングポップアップと Meeton Ads が表示されうる	抑止されます。訪問者はすでに会話の中にいるので、何も割り込みません。
カレンダー、Library、フォームはページの上にポップアップで開く	iframe の枠の中に開きます。小さい iframe では予約フォームが窮屈になるので、エージェントが枠を提案するなら高さ 600 px 以上が妥当です。
スマートフォンではチャットが画面いっぱいになる	ページがレイアウトしたとおり、枠の中に収まります。
`Meeton.openChat()` がウィンドウを開く	何もしません。開くものがないからです。

それ以外は同じ設定の同じエージェントです: アイデンティティ、ウェルカムメッセージ、返信ボタン、会話スターター、ナレッジ、ツール、自動翻訳、フォームを描く特別なトークン。埋め込みで始めた会話は、訪問者を共有していれば同じサイトの他のページの隅のウィジェットに続きます（下記参照）。

御社のページにできること、できないこと

ページ側に JavaScript API はありません。window.Meeton は iframe の中にあり、御社のドキュメントにはないので、setHiddenValues() や openCalendar() などは埋め込みに届きません。リードフォームに隠し値が必要、カレンダーを開くボタンが必要なら、そのページには通常のタグを使い、チャットはランチャーとして開かせてください。
御社のフォームは埋め込みには監視されません。フォームウォッチャーはローダーが動く場所で動きます。自前のフォームを取り込みたいなら、ページに meeton.js を置いてください。
ページの文脈は埋め込みページです。エージェントが見るのは iframe が報告するページで、周囲のシングルページアプリの各ルートではありません。リロードなしで URL が変わるページでは、通常のタグはルートを追いますが、埋め込みは追いません。
訪問者の識別は別になることがあります。埋め込みは訪問者 ID をサードパーティフレーム内の app.dynameet.ai のストレージに保持します。サードパーティストレージを分離するブラウザでは、埋め込み先サイトごとの識別になり、御社ドメインで meeton.js が保持するものとは別になります。訪問者がメールで名乗れば、1つのコンタクトになります。

向いている場面、通常のタグを使う場面

向いている	代わりに通常のタグを
会話そのものがコンテンツである、お問い合わせ・サポート・「相談する」ページ	それ以外のすべてのページ。訪問者が閲覧しながら、好きなときにチャットを開けるべき場所
iframe しか貼れないヘルプセンターや Notion 風のページ	隠し値、自前のボタン、広告が必要なページ
チャット領域が固定されたキオスクやアプリ内画面	エージェントにルートを追わせたいシングルページアプリ

トラブルシューティング

症状	考えられる原因	対処
空の枠で、何も読み込まれない	埋め込み先ページのホスト名が許可リストにない、またはリファラーが送られず DynaMeet が設置先を判別できない	セットアップ → ドメインに正確なホスト名を追加。ページが `Referrer-Policy: no-referrer` を送る、または iframe が `allow-same-origin` なしでサンドボックス化されているなら、ホストページを検出できないときも埋め込みを許可をオンにする。
チャットは動くのにドメインが未検出のまま	管理外のページ上の埋め込みは、設置先ページを常には報告できない	想定どおり。チャットを使うか、セットアップガイドの確認ステップから手動で設置済みにする。
チャットが切れる、予約フォームが窮屈	iframe が小さすぎる。ウィジェットは与えられた枠に収まり、ページをリサイズしない	スニペットの `style` の高さを 600 px 以上に。
1ページにチャットが2つ	iframe と通常のタグの両方があり、タグのランチャーが見えている	セットアップ → Meeton の表示場所でそのページのランチャーを隠し、計測のためにタグは残す。
ページで `window.Meeton` が undefined	ローダーは御社のドキュメントではなく iframe の中で動く	想定どおり。API が必要なページには通常のタグを使う。
ブラウザのコンソールに teamId is required in query parameters	iframe の `src` から `?teamId=` が落ちた。CMS が URL を書き換えたときによく起きる	設定 → セットアップからスニペットを貼り直す。

よくある質問

自分のスニペットに mode: "embed" を書くべきですか?

いいえ。ホストされた iframe ページがセットします。通常の meeton.js スニペットに書くと、すべてのページがフルサイズのチャットコンテナになり、トラフィックが埋め込みとして記録されてしまいます。インラインチャットには上の iframe スニペット、それ以外には2行のタグを使ってください。

埋め込みと隅のウィジェットを同じサイトで両方使えますか?

はい。お問い合わせページに iframe を置き、そのページを含むすべてのページに通常のタグを置きます。お問い合わせページではページルールでランチャーを隠し、チャットが1つだけ見えるようにします。

埋め込んだチャットのスタイルは変えられますか?

色、ランチャー、ショートカットは 設定 → Meeton AI → テーマ で決まり、ウィジェットと同じです。ページ側でスタイルできるのは iframe の枠で、中身ではありません。

インライン予約カレンダーも同じ仕組みですか?

別の iframe、iframe-calendar.html で、1つの予約カレンダーをページ全体に開きます。設置方法 → インライン埋め込みを参照。チャットの埋め込みモードとは別物です。