My Clinicヘルプ

Googleカレンダーとホームページのカレンダーを連携させたい

WordPressでホームページを制作している場合、Googleカレンダーをホームページ上に表示することが可能です。
その場合、お客様側でGoogleアカウントの作成・Googleカレンダーの作成および設定をお願いしております。
下記手順を確認の上、弊社に連携URLをご教示ください。
※ご自身のホームページがWordPressかどうかわからない方はこちらをご確認ください。

<実際の表示イメージ>

1.Googleアカウントの作成

Googleアカウントをお持ちでない場合は、下記URLを参考にGoogleアカウントを作成してください。Gmailをお持ちの場合はGoogleアカウントの作成は不要です。

Googleアカウントの作成

2.カレンダーの設定

続いて、Googleカレンダーの設定を行います。

①Googleカレンダーにアクセスし、ログインします。

https://workspace.google.com/intl/ja/products/calendar

②画面左下「他のカレンダー」の横にある+ボタンをクリックします。

「新しいカレンダーを作成」をクリックします。

③ホームページ上に表示するカレンダーの作成を行います。

わかりやすい任意(例:診療カレンダー など)の名前を入力し、他の箇所は編集せずに「カレンダーを作成」をクリックします。

3.休診日などの予定を設定する

ここまで設定できたら、実際に休診日などの予定を追加していきましょう。
カレンダーの入力画面にアクセスします。

https://calendar.google.com/calendar/u/0/r?pli=1

予定を追加したい日の赤枠内(図①)をクリックし、予定を作成します。

タイトルの入力や繰り返し設定を行います。
タイトル(図②)は、ホームページのカレンダー上に表示されるので「休診日」「午後休診」などのわかりやすい文言を入力しましょう。
赤枠③の日付が表示されている個所をクリックし、「終日」「繰り返し」などの設定を行います。土曜や日曜の休診などは毎週繰り返しの設定が可能です。

<注意点>
・すべての予定は「終日」にチェックを入れて下さい。
午後の予定や開始時間を示したい予定であっても、カレンダー上で日時を設定するとホームページ上に表示したときに見づらくなります。
開始時刻などをカレンダー上に表示したい場合は、下記のようにタイトルに開始時間を入力するようにしてください。
・休診など、毎週固定で設定したい予定は「繰り返さない」をクリックし、繰り返し設定を選んでください。毎週日曜日に設定したい場合は、下記画像のように表示されていれば問題ありません。


必要項目を入力し、「保存」をクリックします。これで日曜休診が設定できました。

4. カレンダーの表示色を変える

カレンダーの表示色を変える場合は、別のカレンダーを新規作成する必要があります。
③ホームページ上に表示するカレンダーの作成を行います。を参照して、新しいカレンダーを追加してください。

カレンダーが登録できたら、左側のメニュー「マイカレンダー」より新規登録したカレンダーの三点リーダーをクリックし、表示色を選択してください。

5. 埋め込みコードを取得する

ホームページに埋め込むコードを取得します。
画面左側の「マイカレンダー」より新規登録したカレンダーの三点リーダーをクリックし、「設定と共有」をクリックしてください。

①カレンダーの共有設定

休診日の更新などのカレンダー設定を院内の他の方にお任せしたい場合は、カレンダーの共有を行います。
画面をスクロールすると「共有する相手」が表示されますので、「ユーザーやグループを表示」にて共有相手のGmailアドレスを入力してください。

②カレンダーの公開設定

画面をスクロールし「予定のアクセス権限」にチェックを入れます。
右側のプルダウンは「予定の表示(すべての予定の詳細)」を選択してください。
この設定にしないと、作成した予定が患者様に表示されません。

③カレンダーのカスタマイズ

続いて、ホームページ上に表示するカレンダーのカスタマイズを行います。
画面をスクロールし、「カレンダーの統合」にある「カスタマイズ」をクリックします。


まずは左メニューのチェックボックスを、下記画像と同じ状態にしてください。

<チェックあり>
ナビゲーションボタン
日付
メニューを表示

<チェックなし>
タイトル
印刷アイコン
カレンダーリスト
タイムゾーン
枠線

続いて、カレンダーの始まりの曜日を設定します。
月曜始まりがわかりやすいと思いますので、左下の「週の開始日」を「月」に設定します。(もちろん日曜始まりがよければ「日」で設定いただいても構いません。

④埋め込みコードの取得

画面を一番下までスクロールし、左下の「表示するカレンダー」にて、ホームページ上に表示したいカレンダーだけにチェックを入れます。

画面を一番上までスクロールし、「埋め込みコード」に表示されているコードをコピーしてください。
コードを弊社で受領後、ホームページへの埋め込み作業を行います。

このようにカレンダーを設定していくと、ホームページ上には下記のような形でカレンダーが表示されます。

これで、Googleカレンダーで設定をするだけでホームページ上のカレンダーが編集できるようになりました。

Googleカレンダーについてもっとよく知りたい場合は下記公式ヘルプをご確認ください。https://support.google.com/calendar/?hl=ja#topic=10509740