NotionにGoogleCalendar(グーグルカレンダー)をindifyで連携させて埋め込む

Notion初心者がNotionに
googleカレンダーを連携させるまでのあれこれです。
Notionに使えるウィジェットを提供している
indifyを使って設定しました。
本当の初心者あるあるを交えて
画像付きで解説していきます。

Notionとグーグルカレンダーを埋め込む『一般公開』が必要な問題

Notionにグーグルカレンダーを埋め込もうとすると
googleカレンダーを『一般公開』に設定する必要があります。

『Notion グーグルカレンダー 埋め込み』
で検索するとわかるのですが
自分の予定が『一般公開』されてしまうのは
プライバシーの観点からキツイですよね。

そこで設定を一般公開にしないまま
Notionに表示させる方法を探して試したところ
『indify』を使うとプライバシーも守れて
特に費用もかかることなくできました。

indify(インディファイ)とは

indify(インディファイ)とは

indify(インディファイ)とは
Notionのカスタマイズに使える
ウィジェットを提供しているサービスです。
使い方はグーグルカレンダーとの連携を通して
この後説明しますが
Notionを使う上でとても助かるサービス
と認識しておけば良いと思います。

 

NotionにGoogleカレンダーをindifyで連携させて埋め込む方法

ここからは図解つきでNotionに
Googleカレンダーをindifyで連携させて
埋め込む方法を説明します。

Notionの初期設定の仕方は
下の記事からどうぞ

 

まずindifyに登録する

まずはindifyに登録します。

 

Indify - Notion Widgets


emailかGoogleアカウントで登録
するか選びます。
ここではGoogleアカウントで進めていきます。
『Google』をクリックします。

NotionにGoogleカレンダーをindifyで連携させて埋め込む方法

 

使うアカウントを選択してクリックします。

 

NotionにGoogleカレンダーをindifyで連携させて埋め込む方法

 

ログインに成功すると下の画面がでます。

 

 

NotionにGoogleカレンダーをindifyで連携させて埋め込む方法

indifyでGoogleカレンダー連携のための設定

indifyでGoogleカレンダー連携のための設定

 

indifyにログインして画面を下にスクロールすると
『Explore Widgets』のタイトルがあり
その下に『GoogleCalendar』
があるのでカーソルを合わせクリックします。

 

indifyでGoogleカレンダー連携のための設定

 

この時点ではまだグーグルカレンダーと連携されていません。
『Sign in with Google』をクリックします。

 

indifyでGoogleカレンダー連携のための設定


Googleアカウント選択画面になるので

使用するアカウントを選択します。
indify初期設定してすぐだったので
『またか』と思いましたが(笑)
これindifyログインしたアカウントに
自動設定になる仕様にならないかな。

 

indifyでGoogleカレンダー連携のための設定

『許可』をクリックします。

 

indifyでGoogleカレンダー連携のための設定

 

画面が切り替わるので
アカウントが問題ないことを確認したら
『許可』をクリックします。

 

indifyでGoogleカレンダー連携のための設定

 

右側の画面にgooglecalendarが表示されれば
アカウントとの連携成功です。
左側の設定で色合いとか大きさとか調整できます。
それは実際に試して好きにカスタマイズしてください。

その設定の一番下の
『COPY LINK』の下の文字列をコピーします。
アイコンクリックでもコピーできます。

 

indifyでGoogleカレンダー連携のための設定

Notionの設定

ここまできたらNotionのページにいきます。

まず新しいページでの貼り方を説明します。
Notionの『Add a page』をクリックします。

 

indifyでGoogleカレンダー連携のための設定

 

新しいページが表示されるので
タイトルを任意で記入します。
ここでは『GoogleCalendar』にしました。 
記入したらうっすらと
『Type’/’for commands』と
書いてあるあたりをクリックします。

indifyでGoogleカレンダー連携のための設定

『/em』と記入します。

 

indifyでGoogleカレンダー連携のための設定


『EmBed』をクリック
します。

 

indifyでGoogleカレンダー連携のための設定

Indifyでコピーしたリンクを空欄にペーストして

『Embed link』をクリックします。

indifyでGoogleカレンダー連携のための設定

グーグルカレンダー貼り付け完了です。

indifyでGoogleカレンダー連携のための設定

Notionの既存のページにgoogleカレンダー追加する

まっさらなページに追加すると考え方は同じで
埋め込めるは埋め込めるのですが
なぜかリンクが表示されて
グーグルカレンダーそのものがでないのです。
一応画面表示までたどり着けるのですが
ちょっとモヤっとするのです。
(たぶん私がなにかを見落としていて
Notionに詳しい方なら簡単にできるのだと思います。)

順をおって説明させてください。

Notionの既存のページにgoogleカレンダーのリンクを追加する

まず埋め込みたいページの
『+』をクリックします。
(WORKSはnotion初期設定解説記事に書いた
複製したスケジュールのテンプレートです)

 

Notionの既存のページにgoogleカレンダー追加する

 

新規ページと少し画面が変わりますが
赤枠のあたりをクリックします。

 

Notionの既存のページにgoogleカレンダー追加する

あとは新規ページと同じように
タイトルつけて設定します。 

 

Notionの既存のページにgoogleカレンダー追加する

Notionの既存のページにgoogleカレンダー追加する

indifyでGoogleカレンダー連携のための設定

 

するとなぜか
リンク付きのテキスト表示されました・・・
クリックすればグーグルカレンダーがでるんですけどね

実際はページの一番下にでたのですが
わかりやすくするためにタイトル下に持ってきました。

Notionの既存のページにgoogleカレンダー追加する

 

たぶん私がとりあえず
Notionをスケジュール管理で使うため
基本をすっ飛ばしているから
起きている現象な気がします。
ちなみに色々いじくっていたら
ページ下にgoogleカレンダー表記はできました。
とりあえずそのやり方を書いておきます。

Notionの既存ページ一番下にgoogleカレンダーを追加する

まずはNotionの新規ページに
グーグルカレンダー表示させて
カーソルを合わせると右上に浮かび上がる
『・・・』をクリックします。

 

Notionの既存ページ一番下にgoogleカレンダーを追加する

 

 

 

『Move to』をクリックします。

 

 

Notionの既存ページ一番下にgoogleカレンダーを追加する

 

追加したいページ名をクリックします。
(ここでは『WORKS』)

 

追加したいページ名をクリック(ここでは『WORKS』)

ページの一番下に追加されました。

 

追加したいページ名をクリック(ここでは『WORKS』)

 

 

とまぁ、既存のページに追加できたのですが
なんとなくこれじゃない感はあります。
このやり方の注意点として
追加したあとグーグルカレンダーの位置を
移動しようとしたり、消去しようとしましたが
なんかうまくいきません。
なにかやり方があると思うのですが。

答えがわかったらまた追記します。
またわかる方、教えていただけるとありがたいです。

 

最後に

実はこの設定で一番悩んだのは
indifyのリンクをNotionに貼るところでした。

実は最初からページに追加するつもりで
グーグルカレンダーを設定していたのですが
検索して出てくる記事が
『リンクをペーストしたらNotionに貼りつけて完了』
みたいに記載しているのですが
indifyのリンクの貼り所が
本当に見つかりませんでした。

貼り所しっかり書いてくれよー
どこだよー

と悩んで試しにと新規ページで
設定してみたらあっさりできました(笑)
というか一か所しかない。
それを踏まえたら既存のページでも見つかりまして。

ただ既存のページに悩んだ自分を忘れないにも
そこの部分は図解でしっかり書いてみました(笑)

おすすめの記事