モバイルで複数のGoogle Calendarまとめて表示する
モバイルサイト制作時、複数カレンダーをひとつのURLにまとめたい事ってありますよね。調べるとこんな方法が…。知りませんでした。
Googleカレンダー携帯で複数のマイカレンダーを見る方法!
自分用に少し整理したのでメモ。
1.Googleにログイン
カレンダー > 設定 > カレンダー設定 > カレンダーのタブ > 任意のカレンダーを選択
2.この部分のコードをコピペ
3.必要なカレンダーの分だけ、2を繰り返す。
4.以下のような感じでURLをくっつけます
■2で取得したカレンダーURLたち
[html]/* カレンダーA */ http://www.google.com/calendar/embed?src=カレンダーA%40gmail.com&ctz=Asia/Tokyo
/* カレンダーB */ http://www.google.com/calendar/embed?src=カレンダーB%40group.calendar.google.com&ctz=Asia/Tokyo
/* カレンダーC */ http://www.google.com/calendar/embed?src=カレンダーC%40group.calendar.google.com&ctz=Asia/Tokyo
/* カレンダーD */ http://www.google.com/calendar/embed?src=カレンダーD%40group.calendar.google.com&ctz=Asia/Tokyo[/html]
■結合処理
/* モバイル読み込みベースURL */[html]http://www.google.com/calendar/htmlembed?src=カレンダーA%40gmail.com&ctz=Asia/Tokyo&mode=AGENDA[/html]
/* URL結合前の状態 */[html]http://www.google.com/calendar/htmlembed
?src=カレンダーA%40gmail.com
&src=カレンダーB%40group.calendar.google.com
&src=カレンダーC%40group.calendar.google.com
&src=カレンダーD%40group.calendar.google.com
&ctz=Asia/Tokyo&mode=AGENDA
&mode=AGENDA[/html]
/* 結合URL */
[html]http://www.google.com/calendar/htmlembed?src=カレンダーA%40gmail.com&src=カレンダーB%40group.calendar.google.com&src=カレンダーC%40group.calendar.google.com&src=カレンダーD%40group.calendar.google.com&ctz=Asia/Tokyo&mode=AGENDA[/html]
※&mode=AGENDAはモバイル環境で見やすい一覧表示形式の指定
あとはコレを
[html]<a href="http://www.google.com/calendar/htmlembed?src=カレンダーA%40gmail.com&src=カレンダーB%40group.calendar.google.com&src=カレンダーC%40group.calendar.google.com&src=カレンダーD%40group.calendar.google.com&ctz=Asia/Tokyo&mode=AGENDA" accesskey="1">カレンダー</a>[/html]
みたいな。
しかしこのブログ、めんどくて放置してるけど、段落の上下アキとかやばいよな。きたない。いっそリニューアルしたい。