ブログSlidoをWebサイトやイベントアプリに埋め込む方法と注意点
Webサイト内にSlidoを表示する場合はiframe、イベントアプリから開く場合は参加者用リンクを使います。どちらも参加画面への入口を用意できますが、設定場所と必要条件は異なります。
Webページとイベントアプリで表示方法を選ぶ
動画と投票・Q&Aを同じWebページに置くならiframe、イベントアプリのメニューからSlidoを開くならリンク登録が向いています。ここではSlidoを外部ページに表示する方法を扱い、Slidoの参加画面に動画を埋め込む手順とは分けます。
WebサイトにSlidoのiframeを設置する
イベント設定の「Settings」→「Integrations」→「Embed Slido」を開き、「Copy embed code」を押してiframeコードを取得し、Webページに貼り付けます。イベント全体のコードのURL末尾に/questionsまたは/pollsを加えると、Q&Aまたは投票だけに絞れます。
単一の投票またはSurveyだけを載せる場合は、対象コンテンツの三点メニューから「Direct link」を開き、「Embed poll」→「Copy code」と進んで専用iframeコードを取得し、ページに貼り付けます。イベント全体の埋め込みとはコードの取得経路が異なります。
Slidoの公式埋め込みガイドはWebサイトへの埋め込みをProfessional以上向けとしているため、実装前に現在の契約条件を確認します。iframeの幅と高さはページに合わせ、スマートフォンでも回答欄が隠れないように調整します。
イベントアプリには参加者用リンクを登録する
Slidoのイベント画面で「Share」から参加者モードの共有リンクをコピーし、イベントアプリの「Web link」などに登録します。編集用URLではなく、参加者が投票やQ&Aを開けるリンクを使います。
アプリによってリンクをアプリ内ブラウザーで開くか、外部ブラウザーへ移動するかが異なるため、登録後は参加者画面で遷移を試します。手順の例はイベントアプリ連携ガイドで確認できます。
イベントアプリのリンク登録はWebページへのiframe設置とは別の方法です。アプリ内での表示範囲やリンクの扱いは、利用するアプリの仕様に沿って決めます。
表示と公開範囲を参加者の画面で確かめる
iframeが空白になる場合は、第三者Cookieの制限やサイト側のiframe許可設定を切り分けます。サイトのセキュリティ設定が外部iframeを制限している場合は、必要な接続先が許可されているかサイト担当者と確認します。
iframeのsrcと共有リンクは同じURLとは限らないため、同じイベントの参加者用リンクを別タブで開き、イベントへ参加できるかを比べます。参加リンクでは開けるのにiframeでは表示されない場合は、イベントの参加条件より先にCookieやサイト設定を調べられます。
公開前に、PCとスマートフォンの両方で質問投稿や投票回答まで進み、ページ内で操作を完了できることを試します。動画を含むSlidoをiframeで全画面表示する場合は、公式ガイドに沿ってallowfullscreen属性も設定します。
