Studioで運用サイトの公開、更新、非公開をSlackに通知する方法を紹介

公開:

2024年04月01日

sync

2024年10月08日 

ノーコードWeb制作ツール「Studio」を企業やチームで使用していて、意図せず誰かがサイトを公開してしまった経験がある方も多いかと思います。

Studioの仕様上、更新ボタンを押したらサイト全体が公開されてしまうので、このような事故が起こってしまうことがあります。

そんな中なかでStudioより「2024年3月28日より、Business・EnterpriseプランでWebhook機能をご利用いただけるようになりました」とのリリースがありました。

本機能を用いて、意図せずに公開してしまう問題を根本的に解決することは難しいですが、気づくことは可能です!

今回はStudioのWebhook機能を利用することでできることや、Slackで通知を受け取る設定するまでの手順を紹介します。

Webhook(ウェブフック)とは

Webhookは、簡単にいうとウェブアプリケーション間で自動的にデータを送受信する仕組みです。何かのイベント発生時にデータを送信して、受け取り手側のアプリケーションで通知を受け取るようなイメージです。

今回のSlack通知する流れを例にすると、Studioで公開/非公開を行ったというイベント発生時に、Studioからデータを送ります。それをSlack側が受信してメッセージをSlack上に送ってくれるような流れです。

Studioの公開・非公開通知をSlack通知する方法

早速Slack通知をやりながら機能のイメージをしていきます。

前提:ビジネス、エンタープライズプラン限定の機能

前提条件としてこのWebhookは執筆時点ではビジネスプラン、もしくはエンタープライズプラン限定の機能となっています。

そのためCMS以下のプランを使っている方は事前にアップグレードが必要です。

1. StudioでWebhook設定項目が表示されている確認

Studioのプランが適正であればホーム画面の一番下にWebhookという項目が表示されています。この表示がされていれば無事に使用することができます。表示されていない場合は、Studioのプランを再度確認してみましょう。

2. Slackに受信用アプリを追加する

Slackの画面のサイドバーより ツールと設定 > アプリを管理する と進み、アプリ管理画面を開きます。

Slackのアプリ管理画面が開けたらヘッダーに「webhook」と入力して、上記の画面と同じ「Incoming Webhook」というアプリ画面に遷移します。このアプリはWebhookを受信するためのSlackのアプリになります。

「Slackに追加」をクリックして、追加したいワークスペースにアプリを追加します。権限によっては新しく追加できない可能性があります。その場合は、自社内のSlackのワークスペースの管理者にお問い合わせください。

3. Slackの受信設定をする

Incoming Webhookが無事追加できたら、次は通知したいSlackのチャンネルを選択します。選択が完了したら「インテグレーションの追加」ボタンをクリックします。

4. 発行されたWebhook URLをStudioに設定する

無事にインテグレーションが追加されると、「Webhook URL」が発行されます。このURLをコピーして、①で確認したStudioのホーム画面の「Webhook」欄に入力しましょう。

これで連携は完了したので、続いて送信テストと、実際の通知を見ていきます。

5. StudioからSlackへのテスト送信

Studioの画面から「テスト送信」をクリックします。そうするとSlack上でこのように通知がされたらテスト成功です。

プロジェクト名にはStudioのプロジェクトの名前が、ユーザー名にはテスト送信を行なったユーザーのStudioのアカウント名が表示されます。

実際のSlack通知を確認してみる

ここまでできたらあとはStudioでWebサイトを公開したり、非公開にしたりしてみてください。

上記のようにSlack通知がされるはずです。緑のラインが公開/更新で、赤いラインが非公開です。

活用方法はいろいろあります

今回はStudioのWebhook機能でSlack通知する方法を解説しましたが、実はサイトの公開/非公開のWebhookを利用すると他にも色々活用が可能です。

Studioの公式ヘルプページを見ると、Studioから送られてくるデータの形式が掲載されています。もしプログラミングができる方やZapierなどのツールを使える方であれば、このデータを用いてサイト公開されたらメール送信する、SNSに投稿するなどの連携が可能になります。

今後はサイトの公開/非公開だけでなく、CMSやフォームなどさまざまなイベントのWebhookが公開されると幅が広がるので、アップデートを期待したいです。

  • STUDIOをもっと学びたい方

    STUDIOのゴールドエキスパートの「caroa」では、ノーコード(STUDIO)でWeb制作を学ぶオンラインスクール「caroa camp」をやっています!

    現場で実践している知識や小話が入ったオリジナルの動画教材に加えて、講師による充実の1on1(フィードバック)、1日みんなで学ぶブートキャンプ方式など色々なコンテンツを用意しています。

    STUDIO基礎クラス、ノーコードでWeb制作を学びたい方

\ 限定セミナー情報 /

  • 犬飼さんが深掘る、いま気になるデザイナー『 工藤 駿 』とは?のセミナー

    開催終了しました

  • はじめてのFramer体験|まずは知る編のセミナー

    開催終了しました

  • はじめてのFramer体験|触ってみる編のセミナー

    開催終了しました

  • はじめてのFramer体験|中級者向け 応用編のセミナー

    開催終了しました

ビジネス成長のためのデザインなら、カロアに

ビジネス向けのデザインパートナーとして、企画や戦略からアウトプットまでトータルでサポートいたします。社内にデザイナーがいない、もしくは少なくてお困りの方、もっとデザインの価値を上げたい方はぜひご検討ください。

関わったプロジェクトを見る

資料をダウンロードする

相談する

Studioでのサイト制作、相談はご相談ください

カロアは国産最大級のノーコードツールWeb制作プラットフォーム「Studio」のゴールドエキスパート。そのため、他社と比べて圧倒的な経験と実績をもとに、「自社内で運用しやすい」コーポレートサイト、採用サイト、BtoBサイトを制作いたします。

StudioでのWebサイト、ホームページ制作の理想の形は、立ち上げを「カロア」にお任せいただき、運用は自分達でおこなっていただくことです。

制作のご依頼、WordPressからStudioへの移行などありましたらご検討ください。

Studioでのサイト制作実績を見る

Studioでのサイト制作、移行を依頼する

資料をダウンロードする

STUDIOの使い方を体系的に学びたい方は

カロアでは豊富な実績をもとにした、実践型STUDIO実装スクールを運営しています。
現場で活躍している講師がオンラインで直接講義し、課題に対してフィードバックを1対1で行い習得していくプログラムになっています。
ノーコードツールのSTUDIOを使ってWebサイトを作ってみたいデザイナー、ディレクター、営業、人事、広報のみなさまをお待ちしています。

カロアキャンプを見る

現在、限定クーポンを配布中

Recruit

デザイナーやプロジェクトマネージャーなどを中心に積極採用中です。
ご興味のある方は以下をご覧ください

募集ページ

WRITER

ハグリ

株式会社caroa 代表取締役。新卒で広告プロモーションデザイン事務所に入社し、展示会やプライベートショーのディスプレイデザインを担当。2017年スマートキャンプ株式会社に入社し、プロダクトの開発/デザイン/PMなどを担当。また、同社に横断的なデザインチームを立ち上げる。2020年に株式会社caroaを設立し、代表取締役に就任。caroaは、STUDIO公認制度の「STUDIO Experts」にて、ゴールドエキスパートとして認定中。

KEYWORD

\ Let's share /