Googleカレンダーをウェブに埋め込み、表示する方法

Googleカレンダーをサイトに埋め込む手順content_copycheck_circle

STEP-1:カレンダー設定を開くcontent_copycheck_circle

Googleカレンダーを開き → [マイカレンダー]で埋め込みたいカレンダーの右にある三点メニューをクリック → [設定と共有]を選択します。

STEP-2:カレンダーを一般公開に設定content_copycheck_circle

[設定]画面で対象カレンダーを選択し、
[予定のアクセス権限]で[一般公開して誰でも利用できるようにする]にチェックを入れます。

一般公開にしないと、ウェブに埋め込んでもカレンダーが表示されません。
複数のカレンダーを埋め込む場合(例:PhamDocs Calendar, Job Calendar, Meeting Calendar)、全てのカレンダーで一般公開を有効にしてください。

STEP-3:埋め込みコードの取得と表示設定content_copycheck_circle

[設定]画面 → [カレンダーの統合]で以下の方法があります:

1つのカレンダーのみ埋め込む場合

→[埋め込みコード]のHTMLをコピーし、サイトの表示したい場所に貼り付けます。

複数カレンダーを同時に埋め込む場合

[カスタマイズ]をクリックし、表示設定画面を開きます:

[カレンダーのタイトル] タイトルを自由に設定。
[表示] イベント時間、カレンダーサイズ、タイムゾーン、言語などを設定。
[表示するカレンダー] 表示したいカレンダーを選択。(STEP-2でカレンダーが公開設定に変更されていることを必ず確認してください)
[埋め込みコード] 設定が完了した後に取得できる最終的なコードで、ウェブに埋め込みたいHTMLに直接貼り付けて使用するか、開発者に渡して実装してもらうことができます。

カレンダー変更時の更新方法content_copycheck_circle

新しいカレンダーを追加、色変更、または設定を変更した場合、

→ 再度STEP-3で新しい埋め込みコードを取得し、

→ サイトのHTMLで古いコードを新しいコードに差し替えます。

コードは必ずiframeタグで始まり、iframeタグで終了することに注意してください。