地域活動やサークル、スポーツ少年団などの運営で、一番苦労するのは「スケジュールの共有」ではないでしょうか?
「ホームページの更新が止まっている」「直前の予定変更が伝わらない」「担当者一人に負担が集中している」……。そんな悩みは、Googleカレンダーの「埋め込み」と「共有設定」で一気に解決できます。
今回は、Web制作の現場でも実際に提案している、「スマホから更新できて、複数人で管理できる公開カレンダー」の作り方を解説します。
なぜ「Googleカレンダー埋め込み」が最強なのか?
ホームページに直接予定を書き込むのではなく、Googleカレンダーを連携させるメリットは3つあります。
- 自動更新: スマホアプリで予定を入れるだけで、HPが即座に更新される。
- 属人化の防止: 複数人に編集権限を与えられるので、一人の負担が減る。
- ユーザーの利便性: 閲覧者が自分のGoogleカレンダーに予定をワンタップで追加できる。
失敗しない設定の流れ

ステップ1:公開専用のカレンダーを作成する
プライベートや仕事のカレンダーをそのまま公開するのはセキュリティ上危険です。
まずは「団体専用」のカレンダーを新規作成しましょう。
- PCのGoogleカレンダー左側、他のカレンダーの隣にある「+」をクリック。
- 「新しいカレンダーを作成」を選択。
- 名前(例:〇〇サークル 行事予定)を入力して作成。
ステップ2:複数人で「共同編集」するための権限設定
「自分しか入力できない」状態を防ぐために、運営メンバーに編集権限を渡します。
- 作成したカレンダーの横にある「︙」から「設定と共有」へ。
- 「特定のユーザーまたはグループとの共有」で、メンバーのメールアドレスを追加。
- 権限を「予定の変更」に設定して送信します。
ログインパスワードを共有するのではなく、各自のアカウントに権限を付与するのが、セキュリティを担保するコツです。
ステップ3:ホームページへ「一般公開」する設定
ここを設定しないと、HPを訪れた人には「予定あり」としか表示されなかったり、カレンダー自体が見えなかったりします。
- 同じ設定画面の「予定のアクセス権」をチェック。
- 「一般公開して誰でも見られるようにする」にチェックを入れます。
- 表示条件が「すべての予定の詳細を表示」になっていることを確認してください。
ステップ4:Webサイトへ埋め込む(デザイン調整)
設定画面の下部にある「カレンダーの統合」から、埋め込みコード(iframe)を取得します。
「カスタマイズ」ボタンを押すと、背景色を団体のイメージカラーに変えたり、不要なボタン(メニューなど)を非表示にしたりできます。
図解 団体向けgoogleカレンダー活用術


【Web担当者向け】スマホ対応のCSSコード
標準の埋め込みコードのままだと、スマホで見た時に表示が崩れることがあります。そんな時は、以下のCSSを適用してレスポンシブ対応させましょう。
.calendar-container {
position: relative;
padding-bottom: 75%; /* 縦横比の調整 */
height: 0;
overflow: hidden;
}
.calendar-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}
まとめ:活動の「見える化」が団体の信頼を作る
最新のスケジュールが常に公開されているホームページは、参加を検討している人やファンに大きな安心感を与えます。
「ITの力で、もっと活動を楽しく、運営を楽に。」
もし設定に不安がある場合や、より高度なカスタマイズ(デザイン変更や独自ドメインでの運用など)が必要な場合は、ぜひ地元のIT専門家に相談してみてくださいね。
