サードパーティのWebサイトにイベントの登録ページを埋め込む方法

  • 更新

All_plans_.png

登録ウィジェットを利用すれば、自社のWebサイト上でイベントの登録プロセスを完結させることができます。 埋め込み可能なJavascriptウィジェットを利用すれば、オーガナイザーはJavascriptのスニペットをコピー&ペーストするだけで、サードパーティのWebサイトに登録機能とユーザーフローを埋め込むことができます。

参加者はhopin.comにアクセスすることなく、複数のチケットの購入・支払い、招待状の送信、登録手続きを行うことができます。

登録ウィジェットの作成

ウィジェットを作成する前に、ウィジェット認証を有効にする必要があります。 ウィジェット認証が無効になっている場合、既存のユーザーアカウントにログインできず、参加者はゲストとしてのみチケットを購入できます。 ただし、公開チケットが1枚しかない場合は、アカウントにログイン済みの任意のユーザーがそのままイベントに参加することになります。

ウィジェット認証が有効になっている場合、参加者はアカウントにログインしたり、新規アカウントを作成したり、ゲストとしてチケットを購入したりすることができます。 この機能を有効にするには、「イベントダッシュボード」 > 「登録」 > 「詳細」を開き、ページの一番下にある「ウィジェット認証」までスクロールダウンして、ボタンを切り替えます忘れずに「保存」をクリックします。

Screenshot_2021-10-17_at_15.36.50.png

次に、以下の手順でウィジェットを作成します。

  • 「イベントダッシュボード」 > 「登録」 > 「埋め込み可能なウィジェット」を開きます。
  • ページ上部の「ウィジェットを作成」ボタンをクリックすると、必要情報を入力するためのフォームが開きます。

Screenshot_2021-07-05_at_16.20.17.png

  • ウィジェット名を入力します。
  • 対象となるチケットを指定します。 このオプションは、自社のWebサイトに特定のチケットのみを反映した登録ページを埋め込む必要がある場合に特に便利です。
注: 「すべてのチケットを含める」ボックスにチェックを入れると、作成した非公開チケットも表示されます。
  • 有効」 にチェックを入れて有効にし、「ウィジェットを作成」を選択することで、画面から話し手または共有画面を削除できます。

Screenshot_2021-07-05_at_16.22.30.png

  • これでウィジェット一覧にウィジェットが表示されます。

登録ウィジェットの埋め込み

サイトにウィジェットを埋め込む準備ができたら、対象となるウィジェットの編集アイコンをクリックします。 フォームが再び開き、下の方にコードスニペットがいくつか表示されます。

embeddable_widget.png

最初のコードスニペットはCSSです。 このコードをコピーして、Webサイトの<head />内に貼り付けます。 コードのこの部分は必ずしも必要ではありませんが、サイト上でウィジェットのレイアウトがきれいに表示されるよう使用することを強くお勧めします。

Screenshot_2021-07-05_at_16.26.41.png

最後のコードスニペットはHTMLマークアップです。 これは必ず必要で、Webサイトの<body />内の表示したい場所に貼り付ける必要があります。

埋め込まれると、次の画像のように表示されます。

image__10_.png

ご質問やサポートのお問い合わせは、support@hopin.comまでお気軽にお寄せください。

この記事は役に立ちましたか?