チャべログ

今回は、Make を使った Notion と外部サービスの連携について、初心者向けに紹介します。以下のような「いいねボタン」を Notion のページに設置し、「いいねボタン」を押すとNotion のデータベース内のプロパティの数字を +1 する操作を自動化しています。

このいいねボタンを作成するためには、「Make」と「Widgets」というサービスを使用しています。今回はいいねボタンを例として作成しますが、今回の方法を応用することで、上記のいいねボタンの他にもさまざまな自動化（Notion のデータベースに新規ページ作成やプロパティの更新）や、外部サービスとの連携（LINE や Google カレンダー）をノーコードで実現することができます。

今回の記事は Make や Widgets を使うための入門的な記事となっているので、ノーコードでの自動化や Notion とさまざまなサービスの連携について興味のある方はぜひ参考にしてみて下さい。

以下のページでインテグレーションを作成します。

Notion – The all-in-one workspace for your notes, tasks, wikis, and databases.

A new tool that blends your everyday work apps into one. It’s the all-in-one workspace for you and your team

https://www.notion.so

今回は、以下のように設定しています。

Notion のデータベースを用意します。今回はいいね数を記録するために、

• 名前：なんでもOK（今回は「いいねボタン」）
• いいね：数値プロパティ（いいね数がわかりやすいように 0 を入力）

としておきます。

はじめに作成したインテグレーション（今回は「Make Integration」）を 上記の Notion のデータベースにコネクトします。

Widgets は Notion に埋め込めるボタンなどのウィジェットを作成できるサービスです。（2022/12 時点では、10個まで無料で作成できます。）

Widgets

Supercharge Notion with custom Widgets

https://widgets.so

まずは、「Create Widget 」をクリックし、アカウントを作成します。

アカウントの登録が完了すると、管理画面に移動します。右上の「New widget」で一からウィジェットを作成することもできますが、今回は 「Templates」を使用します。

右上の「Notion-style Feedback」テンプレートの「Duplicate」をクリックします。

ウィジェットの作成画面に移動します。今回は、👎 は使用しないので、削除します。

以下のように設定して下さい。

• 「Widget title」は任意の名前（Widgets 上でのみ使う管理用の名前です）
• 「Action」は「Trigger a webhook」
• 「Methed」は「POST」

「POST」の横のボックスは、後で設定するので空白にしておきます。

一番下の「Advanced」を開くと、ウィジェットの上の文字が変更できたり、ボタンを押した後に表示する文字を設定できます。

これで一旦 Widgets での設定は完了です（後で1箇所だけ追加で設定するので、画面は開いたままにしておいてください）。右のプレビュー画面でボタンを押してみると、動作を確認できます。

Make は Notion と外部サービスを連携して、さまざまな操作を自動化することができます。今回は上記で作成した Widgets のボタンと Notion を連携し、Notion のページに埋め込んだいいねボタンを押すと、Notion のデータベースの「いいね」プロパティの数字を +1 するという操作を自動化します。

Just a moment...

https://www.make.com

Make のアカウント登録は簡単にできるので、登録しておいてください。

無料プランでは月に実行できる自動化フローの回数に制限がありますが、今回の使い方ではいいねボタンを押されるが 333回押されるまでは無料で使うことができます。

📝

Make の無料プランについて
無料プランでは 月に1000回まで操作を実行することができます。今回のいいねボタンでは、1回の自動化フローで以下の 3回の操作を実行するので、333 × 3 = 999回 まで無料で使うことができます。

1. いいねボタンが押されたことを検知して Make で自動化フロー開始
2. Notion のデータベースからいいね数を取得
3. 取得したいいね数 +1 して Notion のデータベースに書き込み

Make のダッシュボードに入ったら、「Create a new scenario」をクリックしてシナリオ（自動化フロー）を作成していきます。

今回作成するシナリオの全体像は以下です。

Widgets で作成したいいねボタンが押されたことをトリガーとして、シナリオを動作するように設定します。そのためには、「Webhooks」を使用します。ページ中央のプラスボタンを押して、「webhooks」と検索し、「Webhooks」→「Custom webhook」をクリックします。

「Add」をクリックすると、以下のような画面になるので、「Webhook name」に任意の名前（何でもいい）を入力し、「Save」をクリックします。すると、「Copy address to clipboard」というボタンが出てくるのでクリックします。

ブラウザで先ほどコピーした URL を貼り付けて移動すると、真っ黒なページの左上に「Accepted」と表示されています。Make のページに戻り、「Successfuly determined」と表示されていれば成功です。「OK」をクリックします（上記の黒いページは閉じてOKです）。

ここで一旦、Widgets に戻ります。先程コピーした URL を、以下の場所に貼り付けます。これで Widgets の設定は完了です。

先ほど作った「Webhooks」の横にあるプラスボタンをクリックします。「Notion」と検索し、出てきた 「Notion」をクリックすると、「Get a Database Item」という項目があるのでクリックします。

「Add」をクリックします。

• Connection type：Notion Internal
• Connection name：任意の名前（何でもいい）
• Internal Integration Token：取得しておいた Notion のインテグレーション

を入力して「Save」をクリックします。

• Get a Database Item：Select from the list
• Database ID：データベース名を選択
• Database Item ID：Notion DB のいいね数を更新するページ名

を選択し、OKをクリックします。

これで Notion のデータベースの情報を取得する準備ができました。

試しに、Notion のモジュール（今作ったもの）を右クリックし、「Run this module only」をクリックしてみると、右上に「1」と現れるのでクリックしてみると、Notion のデータベースの情報が取得できていることがわかります。いいね数も取得できています。

上記で取得したいいね数に +1 してデータベースの値を更新します。先ほど作った Notion のモジュール右のプラスボタンをクリックし、「Notion」→「Updata a Database Item」をクリックします。

以下を選択します。

• Enter a Database Item：Select from the list
• Database ID：データベース名を選択
• Database Item ID：Notion DB のいいね数を更新したい行名
• いいね：後述

いいねの部分には、以下のようにデータベースの情報をクリックして選択できるので、「いいね」をクリックします。

引き続き、「+」マークをクリックし、半角で「1」を入力します。

これで完成です。

保存して、このシナリオを「ON」にします。

作成したいいねボタンを Notion のページに埋め込みます。

Widgets のページで「Copy Embed」をクリックして URL をコピーします。

任意のNotionのページに貼り付けて「埋め込みを作成する」をクリックします。いいねボタンをクリックすると、データベースのいいね数が増えることが確認できます。以下のツイートでは完成版の動画で確認できます。

今回は、Notion × Make × Widgets を連携し、いいねボタンを作成してみました。Make や Widgets を使えば、さまざまな外部サービスと連携して自動化を実現することができると思うので、興味のある方はぜひチャレンジしてみて下さい。