LINE Official Account ManagerでLINEBOTのリッチメニューを設定してみた

#はじめに
LINE@がLINE Official Account Managerに統合された。
それに伴い、リッチメニューの設定画面が変わった。
脱出系謎解きと一緒で、
設定できれば大したことはないのだけど、
私は豪快に躓いたので、同じく躓いた人の助けとなればと思い、
設定手順を記録に残す。


#リッチメニューの設定手順
##LINE Official Account Managerを開く。
ホーム＞リッチメニューと押下し、下図の画面を出す。
そして、「作成」押下。

![リッチメニュー](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/54cd268c-7381-0fea-c86f-099a41a0b287.jpeg)

この画面に到達するまでに戸惑う人もいるかもしれないが、
LINE Developersから辿るには、チャネル基本設定のあちこちにある「変更はこちら」から来れる。

##表示設定
開くと「保存」が非活性なのがわかるだろうか。
正しく設定できれば、活性化（濃い緑になる）する。

![表示設定1](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/5ce41b8a-a8d8-738f-5f61-572f60a55113.jpeg)

###タイトル
必須項目。
リッチメニューのタイトル。
非公開なので自分で分かりやすい命名をすればよい。

###ステータス
必須項目。
使用可否の制御。
一度設定したものを外したいが設定を消したいわけじゃないときに、オフにする。

###表示期間
必須項目。
適当に昨日から10年後くらいでいいかと。
TOでも時刻の初期値は00:00なので設定する人は失敗しないように。

###メニューバーのテキスト
ボットの下部に表示される。デフォルトは「メニュー」。

###メニューのデフォルト表示
ボットを開いたときメニューを自動的に出してあげるか、
閉まった状態で開くかの設定。
デフォルト表示してると、毎回メニューが出てきてうっとうしい感もあるものの、
出さないとあるのに気付いてもらえないということもあるかも。
サイズ小なら表示しない、サイズ大なら表示するとかがいいかも？

ヤマト運輸とかは表示しないパターン。

![表示設定2](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/14a77176-2a88-ecb5-438c-d76b643bdb1c.jpeg)

まだ、「保存」は押せない。

##コンテンツ設定

![コンテンツ設定1](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/5e02f057-9b10-2a4f-4631-109e55b414c4.jpeg)

###テンプレートを選択
必須。
これを選択しないと、背景画像のアップロードができない。
大を選ぶか、小を選ぶかで、アップロードすべきサイズが変わる。
あとはどう領域を区切ってるかの違い。

とりあえず、上段１下段３の4分割された大のテンプレートを選択。

###背景画像をアップロード
必須。
LINE@ではアイコン選択で自動的に画像用意してくれた部分。
LINE Official Account Managerでは自分で用意しなくてはダメ。

画像はこちらから拝借した。サイズは大。
[リッチメニューを使う。https://developers.line.biz/ja/docs/messaging-api/using-rich-menus/](https://developers.line.biz/ja/docs/messaging-api/using-rich-menus/)

なお、上記サイトでのやり方で挫折中な話は後述。

###アクション
必須。
選んだテンプレートに応じてアクションの項目が出現する。
テキストを選択して内容を入力すると、押せばそのテキストを送るボタンとなる。
とりあえず、1か所テキストを設定し、残りは全部「設定しない」を選択して、
まず、リッチメニューが出せるかどうか試してみよう。

![コンテンツ設定2](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/c4600786-091e-5b01-f62e-928e717c709a.jpeg)

##保存
背景画像をアップロードした頃には保存が押せるようになってたと思う。
（アクション未設定だとエラーが出るが）

ここまで入力を終えていると、無事保存できる。
![完成](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/2763e2d0-1a31-72b2-8dcc-c87f35c685ca.jpeg)

オンでアクティブというタグが出てくる。

#確認
できた。
<img width="375" alt="確認" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/b3ca1706-4cc1-705a-72c1-90c10adda483.jpeg">

画像が適当すぎるのでとても分かりにくいけど、
設定した自分ならどの辺に当たり判定あるかわかるよね。

あとは、適切な画像を作って、それっぽいメニューに変えていくだけだ。


#おわりに
ちょうど、LINE@が統合される直前のタイミングでBOTを作り始めていたのだが、
最初のころに作ったLINEBOTは、LINE@の画面で作成していたので、
詰まるところなく作成できた。

しかし、LINE Official Account Managerに変わってから、
リッチメニューがうまく設定できなかった。

公式に2度問い合わせを行い、その中で自己解決した。
1度目の回答要約
「正しく設定できれば保存ボタンは押せる」
2度目の回答要約
「状況を確認したいので、設定のキャプチャと対話画面のキャプチャが欲しい」
公式の姿勢から、なんか独自の盲点があるんだろうなぁと脱出ゲームの謎解きアプリを触るように、
片っ端からポチポチして、ようやく画像アップロードしていないのが原因か！と気づいた。

![画像未設定時.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401158/e4c93744-bda4-3b5f-169f-1f12664e74d3.jpeg)

画像未設定時はこうなるのだが、後ろのメッセージが隠れてしまって、
これが未設定を示すメッセージとは気付かなくなってしまった。
この状態なら「保存」ボタンは押せないので、公式の回答通り、正しく設定できていないということになるのだけど、
ボタンが押せる＝正しく設定できたと思っていいと認識した私は、
ステータスの項目で、「オフ」に変更することで、
「あー、ボットステータス未設定の人はここをオフにすべきだったのか！」
という解釈をして、はまってしまった。
（ボットステータスというのが課金プランではある）

そして、LINE Official Account Managerでのリッチメニュー作成をあきらめた私は、
APIでの実装を試すのだが、Windowsでのcurlコマンドの実行で挫折して、今に至るのであった。
APIでの実装を記事にする日は、いつになるのだろうか。