「Google カレンダー」をホームページへ埋め込む方法
予定表など、Google カレンダーをホームページに埋め込む方法を説明します。
実際にページに埋め込んだカレンダーです
上記のおまじない（設定）です
前提条件及び処理概要
埋め込みコード取得までの手順
カレンダーのカスタマイズ
実際にページに埋め込んだカレンダーです
元々の大きさ横 800px、縦 600px を 700x500px に縮小して当ページに埋め込んでいます。
上記のおまじない（設定）です
#html{{
<iframe
src="https://www.google.com/calendar/embed?title=%E8%97%A4%E5 %BF%83QHM%E3%82%AF%E3%83%
A9%E3%83%96%E3%81%AE%E4%BA%88%E5%AE%9A%E8%A1%A8&showPrint=0&showCalendars=0&
;showTz=0&height=500&wkst=2&bgcolor=%2366ff99&src=mo.ri.sa.ki.hi.to.shi
%40gmail.com&color=%235C1158&src=ja.japanese%23holiday%40group.v.calendar.googl
e.com&color=%232952A3&ctz=Asia%2FTokyo" style=" border:solid 1px #777 "
width="700" height="500" frameborder="0" scrolling="no"></iframe>
}}
-1-
前提条件及び処理概要
1.
2.
3.
4.
5.
6.
Google アカウントを取得していること。（Google カレンダーには必須です）
カレンダーの更新は、Google カレンダー側で行うこと。
カレンダーの詳細編集は熟知しているという前提で、ここでは編集方法は割愛します。
Google カレンダーのページより埋め込みコードを取得する。
取得された埋め込みコードを QHM の該当ページに HTML タグとして貼り付ける。
当然のことながら Google カレンダー側の更新結果は QHM のページに反映されます。
前記のおまじないの一般形
コピー & 貼り付け
#html{{
(ここに Google カレンダーで取得した埋め込みコードを挿入する)
}}
埋め込みコード取得までの手順
1.Google カレンダーのページで「マイカレンダー」～「設定」をクリックする。
-2-
２．該当のカレンダー名称をクリックする。
３．「色やサイズなどをカスタマイズします」をクリックする。
-3-
４．埋め込み支援ツールの画面で埋め込みコードが取得できます。
上記の埋め込みコード（丸印）を全選択～コピーして QHM の該当ページで貼り付けてあげれば、Google
カレンダーを埋め込むことができるようになります。
カレンダーのカスタマイズ
前記３．の「色やサイズなどをカスタマイズします」をクリックする。
-4-
カスタマイズ項目にはいろいろありますが、幅と高さを QHM 側のページサイズに合わせて調整して下さ
い。
-5-
カレンダーのカスタマイズ処理が終わったら「HTML を更新する」を必ず押して下さい。
このボタンを押し忘れると QHM 側のカレンダーにカスタマイズ結果が反映されません。
-6-
© Copyright 2024 Paperzz
