Googleカレンダーの利用

Googleカレンダーをホームページ上で利用する方法をご案内します。(上級者向け)

Googleカレンダーの作成・編集について

ホームページに入れるGoogleカレンダーの作成・予定の登録は、Google社のGoogleカレンダーの管理画面で行います。

Googleカレンダー管理画面で予定を修正すると、ホームページ上のカレンダーもあわせて更新されます。
(ホームページの更新画面では、カレンダーの内容修正を行うことができません。)

 

操作手順1.Googleカレンダーを作成する

Googleカレンダーは、他社が運営するサービスです。そのため、予告なく仕様や操作手順が変更となる場合があります。ご利用の際には、Google社が提供している最新情報ページやヘルプページなどをご確認ください。

以下の情報は、2016年8月現在の情報です。

誤って、プライベート用カレンダーの予定がホームページで表示されないよう、利用には注意が必要です。
1つのGoogleアカウントで、複数のカレンダーを作成することができます。

ビジネス用に、プライベートとは別のカレンダーを作成する
予定登録時に、表示させるカレンダーを正しく選択する
ことで、トラブルを防ぎましょう。

 

操作手順1.Googleカレンダーを作成する

Googleアカウントにログインしておきます

1)以下のURLをクリックして、googleカレンダーのサイトを開きます

https://calendar.google.com
(2016年7月現在の情報です。)
※埋め込み用のコードは、パソコンのウェブサイトからのみ取得できます

2)マイカレンダーの右にある▼マーク > [新しいカレンダーの作成] をクリックします

3)[カレンダー名]に名前を入力します(カレンダー名は、ホームページに表示されます)
[このカレンダーを一般公開する] にチェックを入れて、[このカレンダーを作成]をクリックします 

4)マイカレンダーに、作成されたカレンダーが表示されます

Googleカレンダーの管理画面では、複数のカレンダーの予定が表示されますが、
ホームページには、1つのカレンダーの予定のみ掲載することができます。

操作手順2.Googleカレンダーに予定を登録する

Googleアカウントにログインしておきます

1)以下のURLをクリックして、googleカレンダーのサイトを開きます

https://calendar.google.com
(2016年7月現在の情報です。)

2)予定編集画面で、表示したいカレンダーを選択します

ホームページに登録したカレンダー名を選択します。
誤って、プライベート用カレンダーが選択されていないが、十分ご注意ください。

3)予定のタイトルを記入し、[作成]ボタンを押します

タイトル欄に時刻をいれると、Googleの判断で表示文言が改変されます

4)カレンダーの表示文言を確認します

操作手順3.ホームページ上のGoogleカレンダーを確認する

Googleカレンダー画面で予定を登録したら、ホームページのGoogleカレンダーを入れたページを開いて表示を確認します。

HTML部品を入れる

カレンダーの表示を確認します

<トラブル1>更新が反映されないときは

お使いになっているパソコンのブラウザが古い情報を表示している場合があります。
この場合、正しく変更作業が完了されているにもかかわらず、見た目が変わりません。

<対策>
1.公開中のページを画面に表示させます。
(更新作業をする画面ではなく、「公開中のページを見る」をクリックした後に開くページを表示させます。)


2.キーボードで、左下にある「ctrl(コントロール)キー」を長押ししながら、「F5キー」を押して、ページ情報の再読み込みを行います。

<トラブル2>登録した予定が表示されない

カレンダーの右にある▼マーク > [このカレンダーを共有] をクリックします

[このカレンダーは一般公開する] のチェックが入っていることを確認します

手順は以上です。

  • 更新した内容をホームページに反映させるには、左パネルで、更新したページの[更新]ボタンをクリックします。

編集エリアでは、カレンダーの表示が確認できません。プレビュー、または公開中のページでカレンダーの表示をご確認ください。

 

マニュアル更新情報

2018年8月30日

新機能の追加に伴い、下記のページを追加いたしました。
・書体を変更する

2018年7月2日

新機能の追加に伴い、下記のページを追加いたしました。
共通部品を一部のページのみ非表示にする

2018年7月2日

よくあるご質問ページの「部品・要素の編集について」を更新いたしました。

各種ダウンロード資料

ホームページ更新画面の
基本操作(印刷版PDF資料)

A4カラー印刷用

印刷版PDFはこちらをクリック