# イベントをウェブサイトに埋め込む

> 単一イベント用の日程ウィジェット、またはプログラム全体用のウィジェットの埋め込みコードを取得し、ウェブサイトに貼り付ける方法を説明します。

Entaseウィジェットをウェブサイトに埋め込むと、訪問者はページを離れることなくイベント日程を閲覧・予約できます。プラットフォームのダッシュボードで新しい日程を追加すると、コードを変更しなくてもウィジェットに自動的に表示されます。

> Entaseは、開発者向けに高度なAPI連携、プラグイン、コーディングライブラリも提供しています。詳しくは[開発者向けドキュメント](/developers)をご覧ください。

---

## 埋め込めるもの

Entaseでは、次の2種類の埋め込み可能なウィジェットを提供しています。

- **日程ウィジェット** — 単一イベントの今後の日程をすべて表示します。イベント専用ページに最適です。
- **プログラムウィジェット** — すべてのイベントを含むイベントプログラム全体を表示します。ホームページや一覧ページに最適です。

---

## 埋め込みコードを取得する

取得するウィジェットは、共有ボックスを開く場所によって異なります。**イベント**から開くと単一イベント用の日程ウィジェットが、**プログラム**から開くとプログラム全体用のウィジェットが表示されます。

### 日程ウィジェット（単一イベント）

1. メインナビゲーションで**イベント**に移動し、埋め込みたいイベントを見つけます。
2. イベント項目の下にある共有ボタンをクリックします。
3. 共有ポップアップで、**埋め込み**タブを開きます。
4. ウェブサイト用のイベントウィジェット埋め込みコードをコピーします。
ウィジェットには選択したイベントの今後の日程がすべて表示され、スムーズに購入手続きを行えます。

### プログラムウィジェット（すべてのイベント）

1. メインナビゲーションで**プログラム**に移動します。
2. ページ右上の共有ボタンをクリックします。
3. 共有ボックスで、**短縮リンク**の横にある**埋め込み**タブを開きます。
4. ウェブサイト用のプログラム全体のウィジェット埋め込みコードをコピーします。
ウィジェットには今後のイベントを含むプログラム全体が表示され、スムーズに購入手続きを行えます。

---

## コードをウェブサイトに貼り付ける

1. ウェブサイトエディターまたはCMSで、ウィジェットを表示したいページを開きます。
2. そのセクションの**HTML**または**埋め込み**編集モードに切り替えます。
3. コピーした`<iframe>`コードをHTMLに直接貼り付けます。
4. ページを保存または公開します。
これでウィジェットが公開されました。Entaseでイベントの新しい日程を作成すると、ウィジェットに自動的に表示されます。ウェブサイトのコードを再度編集しなくても、訪問者には常に最新の情報が表示されます。

---

## ヒント

- **イベント専用ページ** — 単一のショーやプロダクションを中心に作られたページでは、日程ウィジェットを使用します。新しい公演を追加すると、すぐに表示されます。
- **ホームページまたは一覧ページ** — プログラムウィジェットを使用すると、今後のすべてのイベントを1か所に表示できます。
- **テーマの統一** — サイトの背景がダークカラーの場合は、違和感のある白いボックスを避けるために**ダークテーマ**を選択します。
- **コンテナの幅** — ウィジェットはレスポンシブ対応です。全幅のセクション内に配置し、幅を`100%`に保つと、モバイルデバイスで最適に表示されます。