![見出し画像](https://assets.st-note.com/production/uploads/images/65888077/rectangle_large_type_2_6caf394fc18d52bebd6a48e476b9d830.png?width=1200)
【イチからDX】STUDIO問い合わせをSlackに通知させてみた
◆課題背景
ロカリアでは、会社ホームページの制作に【STUDIO】というツールを使用しています。どんなホームページにも『お問い合わせ』となるフォームがあるかと思いますが、ロカリアではホームページ経由でお問い合わせいただいた内容はGmailに届くようになっています。
![画像1](https://assets.st-note.com/production/uploads/images/65888190/picture_pc_f813100a2371eabd403536d83280607c.png?width=1200)
ここで課題となったことが、二点ありました。一つ目は、Gmailに届くメールがホームページ経由の問い合わせだけではないことから大事な問い合わせが埋もれてしまう可能性があることです。二つ目は、営業いただいた案内の不必要はアシスタントでは判断が難しいことです。
![画像2](https://assets.st-note.com/production/uploads/images/65888218/picture_pc_f81b202cb6c710d8d0378c7e5ea8e75c.png?width=1200)
そのため、経営陣でもホームページ経由の問い合わせを容易に確認できるように【STUDIO】と【Slack】の連携をすることにしました。
◆活用するツール
連携とは何かと言うと、ホームページ【STUDIO】経由のお問い合わせを【Slack】へ通知を飛ばすものです。但し、単純に「届きました」という通知を出すのみにならず、Slackの中で内容についても確認することができるものが今回使用する「Email」というアプリです。
![連携図](https://assets.st-note.com/production/uploads/images/65888240/picture_pc_970ca8650fb559194ea1a1f309bd494e.png?width=1200)
◆設定手順
*手順1
まず初めに、Slackのアプリ検索をしましょう。その後の全体手順は以下のようになります。
![slack_設定方法](https://assets.st-note.com/production/uploads/images/65988012/picture_pc_8462b0790ee7024ce3298a5ac029cf89.png?width=1200)
*手順2
メールアプリページに進むと「Slackに追加」画面が表示されます。
![slackアプリ追加画面](https://assets.st-note.com/production/uploads/images/65988027/picture_pc_c5f69523ebfd8bed0a764af84823c991.png?width=1200)
追加すると、次の画面で投稿先となるチャンネルを選択します。この段階で新たにチャンネルを作成することも可能です。
![slackメールアプリ設定②](https://assets.st-note.com/production/uploads/images/65988044/picture_pc_d1888267926e9473eb779253648c213b.png?width=1200)
チャンネルを選び終わるとメールアドレスが自動発行されます。このアドレスがSTUDIOとの連携に必要になりますのでメモしておくなりしましょう。
![slackメールアプリ設定②](https://assets.st-note.com/production/uploads/images/65988089/picture_pc_5f5aa170e278aab90e71a776b96079f8.png?width=1200)
画面をスクロールしていくとSlack上での通知する際の各項目があるので必要箇所を入力していきます。下の画像では『チャンネルへの投稿』欄が空欄となっていますが、本来はここに選択したチャンネル名が表示されています。
![slackメールアプリ設定③](https://assets.st-note.com/production/uploads/images/65988095/picture_pc_5be0158d82181aa57db9e83c7531d769.png?width=1200)
入力が完了したら『インテグレーションの保存』をし、Slack側の準備は以上で完了となります。
*手順3
続いて、STUDIO側の設定となります。
管理サイトにログインをした後に「フォーム」へ行きます。画面右上に「設定」ボタンがあるのでクリックすると下の画像のような画面が開きます。
下の画像は『STUDIO U』からの引用になりますが、左端に「フォーム設定」となる大項目があり、以下に全体通知と個別通知の中項目に分かれています。全体通知は、ロカリアに置き換えるとGmailアドレスを配置する場所になります。
![studio_問い合わせ全体](https://assets.st-note.com/production/uploads/images/65988105/picture_pc_c1cc2abcefa5b4a1a4420ef38a5b1ae8.png?width=1200)
今回のSlackとの連携には、もう一つの個別設定を用いる必要があります。
個別設定を選択すると、お問い合わせが配置されているホームページ内の各ページ(小項目)が並びます。実際にロカリアのフォーム設定画面を見てみましょう!
お問い合わせを選択すると『フォーム通知の送信先』を入力する欄が表示されます。
そこに、先ほどアプリで発行したメールアドレスを入力することになります。
全ての「お問い合わせ」に同じメールアドレスで構いませんが、どこを経由して問い合わせがあったのかをSlack上で分かるようにするために『通知メッセージタイトル』を工夫します。
![studio_個別_ロカリア](https://assets.st-note.com/production/uploads/images/65988119/picture_pc_2bcc572299e1413ef2d3a16fbf69d94c.png?width=1200)
設定の保存ができたら以上で作業は完了となります。
*手順4
最後に、Slackへきちんと連携できているか確認します。ホームページのお問い合わせよりテスト送信し、Slack画面上で見たものが以下になります。
![画像12](https://assets.st-note.com/production/uploads/images/65988260/picture_pc_6b60d77315f23ba52de513edf1532409.png?width=1200)
STUDIO(送信者)よりちゃんと届きました〜!<パチパチ>
◆さいごに
実は、ここに行き着くまでに初めはGASを使いスプレッドシートを経由して通知する方法を考えていました。今思えば面倒なことをしようとしていたわけでして^^;
私のようにコードもなにも知らなかったものからすると、その工程に触れて知ること自体は学びになりますが如何せん時間も労力も必要です。
初学者はついつい難しいことを選びがち、あると思います。
以上、「【イチからDX】STUDIO問い合わせをslackに通知させてみた」をお話しさせていただきました。またお会いしましょ〜う!
◇牡丹からのおすすめキャンペーン
![AIユーザー育成](https://assets.st-note.com/production/uploads/images/65888556/picture_pc_ed04ac20c1c13e70e895202a010e8a9c.png?width=1200)
この記事が気に入ったらサポートをしてみませんか?