はじめに
前回は「24 日目に LINE ミニアプリが完成する初心者 ── Day11. プッシュメッセージの送信」と題して、資料請求完了時に LINE にプッシュメッセージを送信する機能を実装しました。
今回からは、新機能として問い合わせ機能の実装を行っていきます。
具体的には、 LINE 公式アカウントにリッチメニューとしてお問い合わせを設置し、種別を選択して問い合わせができる機能を実装します。
また最終的にはその内容を Google スプレッドシートに出力することをゴールとして進めていきたいと思います。
リッチメニューの作成
今回は問い合わせ機能の実装を行う前準備として、リッチメニューの作成を行いたいと思います。
LINE 公式アカウントの左メニューから「リッチメニュー」を選択し、「リッチメニューを作成」ボタンをクリックします。
基本設定
基本設定として、タイトルと表示期間を設定します。
今回はテストアカウントでの利用のため今月中で設定しておきます。
コンテンツ設定
テンプレートの選択でリッチメニューの表示形式を選択していきます。
今回作る予定の機能としては以下の3つです。
- 資料請求
- お問い合わせ
- 来店予約
そのため、小の３つ区切りのものを選択します。
次に画像作成のためにテンプレートのダウンロードを行います。
コンテンツ設定右上の「デザインガイド」をクリックしましょう。
ここから「テンプレートのダウンロード」をクリックすることでダウンロードを行うことができます。
ダウンロードしたテンプレートを参考に画像の作成を行いましょう。
画像の作成
画像の作成方法は自由で構いませんが、私の作成方法も簡単に紹介しておきます。
私はが使ったテンプレートはRichMenu_DesignTemplate/Compact/Large/richmenu-template-guide-01.pngです。
これを元に私は Google スライドで画像の作成を行いました。
画像の作成が完了したら「背景全体の画像をアップロード」からアップロードを行いましょう。
アクションの設定
画像の設定が完了したらそれぞれのアクションを設定していきます。
なお、来店予約についてはまだ実装が完了していないため、一旦「設定しない」を選択しています。
「保存」を押したらリッチメニューの設定は完了です。
動作確認
LINE で動作確認を行ってみます。
公式アカウントのトーク画面を見てみると、リッチメニューが反映されているのが確認できると思います。
お問い合わせを押すと、「お問い合わせ」というメッセージが投稿されました！
まとめ
今回は、LINE 公式アカウントからのリッチメニューを設置を行いました。
次回は、「>お問い合わせ」というメッセージをフックに、種別を選択させるチャットが投稿されるように実装していきます。
残りは 12 日！
気になる方は是非フォローやカレンダー購読をお願いします