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

Publish2014/04/07(月)

今日はたまに聞かれる事がある「Googleカレンダーをサイトに埋め込む場合の手順」を説明します。
サイトに埋め込む場合のメリットとしては、以下の2つがあげられます。

  1. 作業の手間を減らす(個別の設定やHTMLでの記述等の実質の作業時間)
  2. 管理を簡易にする(変更はGoogleカレンダーで行うだけ)

普段Googleカレンダーを使用している人は個人的なスケジュールの確認にも便利ですが、そうでない場合も利用が簡単なのでおすすめです。
他の考え方については以前記事を書いているので、そちらを参考ください。
Googleカレンダーで予約管理はどうでしょう?
では実際の手順を説明します。

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

Googleカレンダーをサイトに埋め込む場合は、以下の手順で対応する形になります。
このうち、最初にするカレンダーの作成とページへの埋め込み完了後は、サイトを変更する必要はなく、Googleカレンダーを変更して運用する形になります。
そのため、PCからはもちろんのこと、外出先からモバイルで更新する事も可能になり、非常に便利です。

公開用の新しいカレンダーを作成する

まずは、公開用に新しいカレンダーをGoogleカレンダー上に作成しましょう。
既存のカレンダーを公開して対応する場合は、設定部分を変更する箇所からになります。
まずはGoogleカレンダーの横部分にあるマイカレンダーから「新しいカレンダーを作成」を選択します。
画面サイドから新規カレンダーを作成する
すると以下のような画面になりますので、「カレンダー名」「説明」を入力し、「このカレンダーを公開する」にチェックを入れてください。
共有するユーザーがいる場合(複数アカウントで管理する場合)は、ユーザー部分に対象アカウントのアドレスを追加する事で共有する事も可能です。
全ての項目を確認後に、「カレンダーを作成」を選択します。
新しいカレンダーを作成する
作成に問題がない場合は、Googleカレンダーで公開確認の項目が表示されますので、「はい」を選択して作業が完了します。
公開の確認画面

作成したカレンダーをサイトに埋め込む

次の行程は、作成したカレンダーをサイトに埋め込むためのコードの生成です。
マイカレンダーから、先ほど作成したカレンダーを選択し、「カレンダー設定」を選択します。
設定変更の画面
すると、設定項目の中に「このカレンダーを埋め込む」という項目が追加されています。
ここにあるコードを利用することでも問題ありませんが、「色やサイズなどをカスタマイズします」というリンクを選択すると、より細かく埋め込み状態を設定できます。
埋め込みコードを確認
以下の画面がカスタマイズ画面ですが、タイトルやボタン類の表示/非表示やサイズの設定など、色々と設定ができるので埋め込むサイトに合わせてカスタムされるとサイトのデザインにあった形で埋め込む事ができます。
設定完了後は、画面上部のコードを対象ページに貼付けるだけでサイトにカレンダーを埋め込む事が可能です。
埋め込みコードのカスタマイズ

公開したカレンダーを運用する

サイトにカレンダーを埋め込んだ後は、基本的に全ての事をGoogleカレンダー側で運用する形になります。
新しい予定をカレンダーに表示させたい場合は、カレンダーの任意の箇所で予定を作成し、以下のように対象となるカレンダーを作成したカレンダーに設定することで、カレンダー上に表示され、公開されます。
その他の操作方法なども、Googleカレンダーの通常の使用方法と同じです。
運用は対象カレンダーを選択するだけ

複数のカレンダーを埋め込んで使用する場合は「Google カレンダー埋め込み支援ツール」を利用する

上記に補足として追記します。
上記手順で通常使用する形での埋め込みは完了しますが、例えば複数のカレンダーを一括で表示させるというようなことはできません。
かといって、ページ内の複数のカレンダーを埋め込むのもあまりよい対応方法とはいえません。
そこで利用するのが、Googleが提供している「Google カレンダー埋め込み支援ツール」です。
使い方は簡単で、Google カレンダー埋め込み支援ツールで表示させたいカレンダーを選択するとコードが表示されますので、そのコードを上記手順と同様にサイトに貼り付ければ複数のカレンダーを一つにまとめてサイト内に埋め込むことができます。

あとがき

Googleカレンダーを普段使っていない場合は、最初は使い方に戸惑う事もあるかもしれませんが、難しいものではないので、何度か使用するうちに慣れてくるかと思います。
慣れていただいた後は、非常にスムーズに対応いただけるようになりますので、ぜひチャレンジしていただければと思います。

記事の著者:ふにすでぐち

ふにすでぐち

1978年生まれ。企業のWeb活用をテーマに、Webサイトの運用を中心とした戦略的な企画立案、サポートやWebサイトの構築などを行っています。
5年間のWeb制作会社勤務後、2年間のフリーランスで「フニス」として活動後に法人化し、2012年7月「ふにす株式会社」を設立。
Web活用の情報や考え方などを発信するブログ「ふにろぐ」を不定期で更新しています。
2015年11月より大阪府高槻市に「ふにすWeb相談所」を開設。
地域の方々に気軽にWebのことを相談できる場所として、より多くのWeb運用の問題解決をするために活動しています。
また、不定期で大阪を中心にWeb運用やブログなどをテーマにしたイベント「ふにセミWS」を開催しています。
サイトの運用や活用にお困りの方はお気軽にご相談ください。
お問い合わせはこちら

LINEでWebに関する質問にお答えしています。

ふにすでは、LINEでWebに関するご質問にお答えしています。Webに関するあんなことやこんなこと、今さら聞けない疑問などなんでもご相談ください。LINEアプリでQRコードを読み取ると友達登録のリンクが表示されますので、試しに登録してみてください。

ふにろぐとは?

でぐち

ふにろぐは「ふにす株式会社」の「でぐち」が書いているブログです。
このブログでは主にサイトの運営をしている企業のご担当者様向けに、「サイトの運営に役立つTips」や「今更人に聞けないような初歩的なこと」を中心に情報を配信しています。
その他には僕自身の考え方なども書いています。

このブログについて

ふにす株式会社

ふにす株式会社は大阪の高槻にある「Webを起点に会社の成長を応援するパートナー」をモットーに、Webにまつわるいろいろな問題を解決する、サポートをする会社です。
ホームページでお問い合わせを増やしたい、もっとたくさんの人に見てもらいたいなど、ホームページ/Webサイトを活用したい方向けの活動を行っています。
また、ホームページの作成や、外部パートナーとしての運用サポートなど、幅広くWebにまつわる諸々のことをおこなっております。

ブログ内検索

サービス

ふにすWeb相談所

ホームページの運用お得情報

ホームページ/Webサイトの運用に関する記事のまとめです。ツールや運用ノウハウなど、知っていると便利になる情報ですので、まずはこちらをご覧ください。

Webサイトの運用に関する情報

お問い合わせ

ホームページを成功させたいとお考えの方はお気軽にご相談ください。
ご相談は、下記の中からお好きなものを選んでいただければ大丈夫です。

  • メールで問い合わせる
  • チャットワークで問い合わせる
  • Facebookで問い合わせる
  • Twitterで問い合わせる

LINE@でも相談を受け付けています。
QRコードから友達登録を行って、メッセージを送ってください。

LINE@

最新記事

カテゴリ別記事一覧

月別記事一覧