ノンプログラマーが作る【GASでLINE構築】公式アカウント⑥複合リッチメニューを実装しよう後編

こんにちは！アナログな町内会運営を変えるべく、「GASで機能拡張した町内会公式LINE」を作りました。たくさんの記事を参考にしながら、オープンソースの文化に触れる中で、助け合いの大切さを実感しつつ、ようやく完成させることができました。

Pay forwardの精神で、これから町内会LINEに追加した機能をシリーズで紹介していきます。初心者なので完璧なコードではないかもしれませんが、少しでも役に立てば嬉しいです！

なお、ブログ通りに作業してもうまく動かない方のために、「ココナラ」でサポートを提供しています。良かったらご覧くださいね♪

今回は複合リッチメニューつまり、タブ付きリッチメニューをGASを用いて実装する方法について紹介する後編です。

Googleドライブ内の画像IDを取得しよう

Googleドライブ内に保存した画像のIDを取得します。

リッチメニューAの画像　→　共有　→　リンクをコピー

コピーしたURLを付箋かどこかに貼り付けます。

このURLのうち、//drive.google.com/file/d/　…　/view?usp=drive_link　間の「…」の部分が画像IDになります。

この画像IDを、スクリプト内uploadRichmenuImageA,B,Cの各該当箇所にペーストします。

uploadRichmenuImageAを実行します。

「実行完了」が表示されれば、成功です。

同じようにuploadRichmenuImageB,Cも実行しアップロードします。

ここで一回デプロイ！

createRichMenuArias()　を実行します

setDefaultRichMenu()　を実行します

例：ホーム画面がリッチメニューBとなるように設定するには、リッチメニューBのIDをペーストします。

公式チャネルにリッチメニューが実装されましたね！

ボタンを押すと、事前に設定したメッセージが送信されることも確認しましょう。

このメッセージに対し、bot返信はまだ設定してないので何も返信が無くてOKです。

エラーが出るときは、デプロイを更新（新たにURLを取得し、Webhook URLを更新する）

して再トライみましょう。

また、アップロードする画像サイズは1MB以下でないとエラーになります。

今回は、複合リッチメニューを実装する手順を紹介しました。

リッチメニューが表示されると、だんだんオリジナル感が出てきて嬉しくなりますね。

次回は、bot返信の設定について紹介したいと思います。お楽しみに！