フォローする

【LINEミニアプリ】ShopアプリでLINEのトーク画面にオリジナルメニューを表示させる

対象プラン

  • スタンダード
  • プレミアム
  • プレミアム
    プラス
  • フード
    ビジネス
  • リテール
    ビジネス

Shopアプリ対象プラン

  • ネイティブアプリ
  • LINEスタート
  • LINE配信販促
linemenu_mv.png

LINEリッチメニューは、LINEのトーク画面下部(キー入力エリア)に固定で表示されるメニュー機能です。
リッチメニューを活用することで、スマレジ・Shopアプリの会員証や、外部のECサイトや予約サイトへワンタップで移動させることができます。
その他、クーポン情報など様々な活用方法がございます。

このページでは、LINEリッチメニューの作成/設定方法をご案内いたします。

LINEリッチメニューを利用するには、事前にLINEミニアプリの設定が必要です。
詳細につきましては、こちらのページをご確認ください。

LINEリッチメニューでできること


会員証やクーポンがすぐに表示できます

会員証やクーポン、予約サイトへの誘導がワンタップで表示できるようになります。

shopapp_instal_02.png
スマレジ・Shopアプリの会員証表示や、販促に繋がるクーポンの表示などがワンタップで表示できます。
LINEリッチメニューを利用することで、ユーザーがより便利にお使いいただける環境を整えることができます。
画像はイメージです


オリジナルメニューが作成できます

無料で利用できるLINE Creative Labを使って、オリジナルメニューが作成できます。

shopapp_instal_02.png
多数のテンプレートからメニューとして表示させたい枠やデザインを決め、自由に作成することができます。
画像はイメージです

メニュー画像を作成する

ご案内する『LINE Creative Lab』は『Adobe Express』を使用しますので、Adobeのアカウントが必要です。
すでにアカウントをお持ちの場合はこのまま操作手順をご覧ください。

アカウントは無料で作成できます

①ログイン〜作成準備

本文中の画像はクリックすると大きなサイズで表示されます
  1. LINE Businessへログインします
    shop_coupon_001.png

    LINE Businessのログイン画面を表示し、ログイン方法を選択します。


    shop_coupon_001.png

    ログイン情報を入力し【ログイン】をクリックします。

  2. 利用するアカウントを選択します
    shop_coupon_004.png

    LINE リッチメニューを利用するアカウントを選択します。

  3. LINEリッチメニューの設定画面を開きます
    shop_coupon_003.png

    画面左側の『トークルーム項目』にある【リッチメニュー】をクリックします。

    【作成】をクリックします。

  4. LINE Creative Labを開きます
    shop_coupon_003.png

    『コンテンツ設定』項目にある【LINE Creative Labを開く】をクリックします。

    次は、メニュー画像を作成していきます。


②メニュー画像の作成〜保存

本文中の画像はクリックすると大きなサイズで表示されます
  1. テンプレートを選択します
    shop_coupon_003.png

    Adobe Express画面が表示されます。

    画面左手から、作成したいメニューに近いテンプレートを選択します。

    リッチメニュー枠が変更できます

    テンプレートに表示される初期値はメニューが2段表示する枠ですが、1段で表示するメニュー枠に変更することができます。

    shop_coupon_003.png

    Adobe Expressの画面右上の【×】アイコンをクリックすると、トークルーム管理項目が表示されます。
    【リッチメニュー(小)】をクリックすると、1段で表示するメニュー枠のテンプレートが選択できます。

  2. テンプレートを編集します
    shop_coupon_003.png

    選択したテンプレートに表示された『文字』や『画像』を編集します。
    編集できる内容について、詳しくは画像下の一覧をご確認ください。


    テンプレートの基本編集

    操作 説明
    文字の編集 文字をクリックすると、フォントや文字サイズ、カラーやアウトラインなどが編集できます。
    画像の編集 画像をクリックすると、画像が編集できます。
    テンプレートの画像を選択した状態で『deleteキー』をクリックすると、画像が削除できます。
    メニュー枠の編集 メニューのボタンとなる枠をクリックすると、枠線のスタイルや、太さ、カラーなどが編集できます。
    レイヤーの編集 画面右手のレイヤーで、文字や画像などの表示順が変更できます。
    クリックしながら表示したい箇所へ移動することができます。

    その他編集機能

    一部、Adobe Expressプレミアムプラン契約で利用できる機能がございます
    項目 検索
    検索 様々な素材を検索し、テンプレートに素材として追加することができます。
    検索した内容に沿った画像や動画が生成されます。
    その他にも、アイコンやグラフなどもテンプレートに追加可能です。
    マイファイル Adobe Expressで過去に作成したファイルがある場合は、こちらからテンプレートに追加することができます。
    また【デバイスからアップロード】をクリックすると、編集操作を行なうデバイスに保存されたファイルやパソコンのファイルに保存された画像などを追加することができます。
    ブランド LINE リッチメニュー複数人で作成することがある場合、ロゴやフォント、カラーなどをブランドとして登録することができます。
    編集時に登録したブランドを選択すると、設定されたロゴやフォントで編集できる状態となります。
    アップロード 編集操作を行なうデバイスに保存された画像を追加することができます。
    テンプレート LINE リッチメニューとして利用できるテンプレートが選択できます。
    一度選択したテンプレートを再度選択し直したい場合にご利用ください。
    メディア 写真や動画、オーディオなどを検索/選択することができます。
    テキスト テキストを追加することができます。
    用途に合わせたテキストを選択し、文字や日付、価格など自由に編集可能です。
    素材 デザイン性のある様々な素材を選択することができます。
    LINEリッチメニューの背景だけを変更したい場合や、吹き出しを追加したい場合などにご活用いただけます。
    グラフとグリッド 簡単なグラフを作成し、追加することができます。
    生成AI 欲しい画像イメージを入力することで、生成AIが最適な画像を作成できます。
    イメージ画像は『海の中にあるクーポン券』で生成しました。
    アドオン Adobe Expressと連携できるアドオン機能を確認することができます。
    プレミアムメンバー Adobe Expressプレミアムプランでご契約中の場合に利用できる機能が確認、利用することができます。
    ひらく
  3. LINEリッチメニューを保存します
    shop_coupon_003.png

    作成したLINEリッチメニューを保存します。
    画面右上の【Creative Labに送信】をクリックします。

  4. Creative Labに送信します
    alt

    『ファイル形式』を選択し『おすすめ』にチェックが入った状態にします。

    【Creative Labに送信】をクリックします。

  5. LINE公式アカウントに送信します
    shop_coupon_003.png

    作成したLINEリッチメニュー(キャンバス)を選択します。

    【OK】をクリックします。

  6. PCにダウンロードします
    shop_coupon_003.png

    【ダウンロード】をクリックし、LINEリッチメニューの設定時に使用できる状態にします。


    shop_coupon_003.png

    『正常に送信』と表示されれば、作成/ダウンロード完了です。
    【LINE公式アカウントに移動】をクリックします。

    次は、作成したLINEリッチメニューの画像がトーク画面に表示されるよう設定します。

作成したメニュー画像を設定する

本文中の画像はクリックすると大きなサイズで表示されます
  1. LINEリッチメニューの設定画面を開きます
    shop_coupon_003.png

    画面左側の『トークルーム項目』にある【リッチメニュー】をクリックします。

    【作成】をクリックします。

  2. 基本情報を設定します
    shop_coupon_003.png

    作成するLINEリッチメニューのタイトルを入力します。
    入力したタイトルはユーザーには表示されません。

    LINEトーク画面に表示する期間を設定します。
    他に作成したLINEリッチメニューの表示期間が被った場合は保存できません。

  3. テンプレートを設定します
    shop_coupon_003.png

    テンプレートの【選択】をクリックします。


    shop_coupon_003.png

    LINEリッチメニューとして表示したいコンテンツを選択します。

    【選択】をクリックします。

  4. メニュー画像の設定画面を開きます
    shop_coupon_003.png

    画像項目の【設定】をクリックします。

  5. メニュー画像をアップロードします
    shop_coupon_003.png

    【背景全体の画像をアップロード】をクリックし、作成した画像をアップロードします。


    shop_coupon_003.png

    アップロードした画像に問題がないことを確認し【適用】をクリックします。


    shop_coupon_003.png

    ファイルへの保存確認画面が表示されます。
    すでにLINE Creative Labで保存しているため【適用】をクリックします。

  6. 各メニューの詳細を設定します
    shop_coupon_003.png

    適用した画像に対し、テンプレートのコンテンツが適用されます。

    コンテンツのボタン枠ごとにアクションを設定します。
    各種アクションタイプの内容については、画像下の一覧をご確認ください。

    項目 説明
    リンク スマレジ・Shopアプリの会員証や、予約サイトへ移動させるためのURLを入力します。
    クーポン LINEミニアプリでクーポンを設定している場合、クーポン画面へ移動させることができます。
    テキスト ボタンをタップすると、LINEのトーク画面に表示されるテキストを設定できます。
    ショップカード LINEミニアプリでショップカードを設定している場合、ショップカード画面へ移動させることができます。
  7. メニューバーを設定します
    shop_coupon_003.png

    画面下部に表示される『メニュー』のテキスト表示を設定します。

    このLINEトークを開いた際に、設定したメニュー画像がデフォルトで表示されるかどうかを設定します。

  8. 設定を保存します
    shop_coupon_003.png

    【保存】をクリックします。

  9. LINEのトーク画面に反映されます
    miniapp_03.png

     

この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています
他にご質問がございましたら、リクエストを送信してください
このページの先頭へ
AIチャットを利用する
スマレジ サポート
※ヘルプ内の最新情報がチャットの回答に反映されるまで、時間がかることがあります(24時間周期でヘルプ内を学習)
※AIによる自動生成のため、内容に誤りが含まれる場合があります