2024.9.18公開: 顧客接点を増やすチャンス!特別感が顧客の心を掴むバースデーメール

LINEアカウントでログインできるようにする - 他サイトID連携 -
さらに友だち登録しやすくする

1 LINE ID連携と公式アカウント連携の設定をする

下記機能は、2025年1月15日(水)にリリース予定となります。
・会員登録、注文完了画面でのLINE連携促進バナー表示機能
・他サイトIDでログインボタンのデザイン変更
LINEアカウントを利用して、ショップサーブのお店でログインできるようにするには、LINEの開発者ページで チャネル IDチャネルシークレット を取得してショップサーブに設定が必要です。 また、管理画面に表示されているコールバックURLをLINEへ設定する必要があります。
さらに友だち登録できるようにするにもチャネル アクセストークンチャネルシークレット を取得してショップサーブに設定し、管理画面に表示されているWebhook URLをLINEへ設定する必要があります。

1-1 LINEの開発者登録をする

以下の流れは、初めて開発者登録をする方向けの手順です。
すでにLINE公式アカウントをお持ちの場合は「1-3 LINE公式アカウントを作成し連携する」の
「■開発者アカウントのプロバイダーと公式アカウントを連携します」からご確認ください。

■開発者ページにアクセスします

下記URLより、開発者ページを開きます。

https://developers.line.biz/ja/services/line-login/


LINEログイン「 今すぐはじめよう」をクリックします。

■LINEアカウントでログインします

LINEアカウント または、ビジネスアカウントでログインして、
開発者ページにアクセスします。


アカウントをお持ちでない場合、アカウントを作成して下さい。

■開発者アカウントを作成します

LINEアカウントでログインすると開発者ページが開きます。
初回ログイン時のみ開発者登録が必要です。

  1. 開発者名を入力します。
  2. メールアドレスを入力します。
  3. LINE開発者契約の内容に同意してチェックを入れます。
  4. 「アカウントを作成」ボタンをクリックします。

    開発者アカウントの作成が完了します。

1-2 LINEログインのチャネルを作成する

新規プロバイダーを作成し、LINEログインのチャネルを作成します。

■新規プロバイダー作成します

  1. プロバイダー
    プルダウンメニューで 「新規プロバイダー作成」を選択します。
  2. プロバイダー名
    プロバイダーとは、アプリのサービス提供者(店舗さん)のことです。
    ご自分の名前や貴社名を入力してください。
  1. チャネルアイコン(任意)
    お店のアイコンを登録します。
  2. チャネル名
    お店の名前を入力します。
  3. チャネルの説明
    お店の説明を入力します。
  4. アプリタイプ
    「ウェブアプリ」にチェックを入れます。

  5. LINEでログインした時に、お店のアイコン画像や名前はLINEの認証画面に表示されます。

  1. メールアドレス
    お店のメールアドレスを入力します。
  2. プライバシーポリシーURL(任意)
    「個人情報の取り扱いについて」のページURLを入力します。
  3. サービス利用規約URL(任意)
    「特定商取引法の表示」のページURLを入力します。
  4. LINE開発者契約の内容に同意します。
  5. 「作成」ボタンをクリックします。
     
     チャネルの作成が完了します。

■チャネルID と チャネルシークレットを確認します

  1. チャネル ID をコピーして、メモ帳に保存しておきましょう。
  2. チャネルシークレットをコピーして、メモ帳に保存しておきましょう。

    チャネルID と チャネルシークレットは、ショップサーブの管理画面へ設定します。詳しくは、後述する「1-3」を参照してください。

  3. メールアドレス取得権限を申請します。
    詳しくは、後述する「1-4」を参照してください。

■コールバックURLを入力します

  1. 「 LINEログイン設定 」のタブをクリックします
  2. コールバックURLを入力します。
    「編集」ボタンをクリックすると入力欄が表示されます。ショップサーブの管理画面に表示されているコールバックURLをすべて入力します。


    独自ドメインを利用していない店舗さんは、「共通カートドメイン用」のみが表示されます。


    スペースが入らないよう1行づつ、コピーしてURLを貼り付けましょう。

  3. 「更新」ボタンをクリックします。

■アプリを公開します

  1. 「 非公開 」をクリックすると、ポップアップウィンドウが開きます。
  2. 注意事項を読み、「 公開 」をクリックし切り替えます。
  3. ステータスが「 公開済み 」に切り替わります。


LINEログインは「公開済み」から「非公開」にできません。
チャネルとプロバイダーは削除できます。

1-3 LINE公式アカウントを作成し連携する

LINE公式アカウントを作成し、連携する設定を行ないます。

■新規チャネルを作成します

  1. プロバイダー名をクリックします。
  2. 「チャネル設定」をクリックします。
  3. 「新規チャネル作成」をクリックします。
  1. 「Messaging API」をクリックします。
  1. 「LINE公式アカウントを作成する」をクリックします。
  1. 「LINE Business ID」でログインします。
  1. 「SMS認証を行なう」をクリックします。
  2. ご自身の携帯電話番号を入力し、「SMSを送信」をクリックします。
    画面が遷移し、認証コードを入力する画面になるので、携帯電話に届いた認証コードを入力し、認証します。

■公式アカウントの設定をします

  1. アカウント名
    お店の名前を入力します。


    「メールアドレス」「会社・事業者の所在国・地域」はあらかじめ入力されています。

  2. 会社・事業者名
    ご自分の名前や貴社名を入力します。
  3. 業種
    貴社の事業の種類を選択します。
    「大業種」を選択し、その後で「小業種」を選択します。
  4. 運用目的を選択します。複数選択可能です。
  5. 「主な使い方」を選択します。こちらは1つだけです。
  6. 「確認」をクリックします。
    確認画面へ遷移します。
  7. 「完了」をクリックします。
  8. 「あとで認証を行なう」をクリックします。


    アカウント認証の申請は別途行なってください。
    なお、マイページの「LINE 友だち追加」メニューからWEB版プロフィールページに遷移できるようにするには認証済みである必要があります。
    プロフィールページの設定はLINE公式アカウントの管理画面から行なってください。

  9. 「情報利用に関する同意について」を確認し、「同意」をクリックします。
  10. 「LINEヤフーグループへの情報提供に関する個別規約への同意について」を確認し、「同意」をクリックします。
  11. メッセージを確認のうえ「閉じる」をクリックします。
    この後「運用を始める前に」という案内が2つ出ますので、確認のうえ「次へ」で進めます。

■開発者アカウントのプロバイダーと公式アカウントを連携します

  1. 画面右上の「設定」をクリックします。
  2. 左サイドメニューの「Messaging API」をクリックします。
  3. 「Messaging APIを利用する」をクリックします。
  4. 開発者ページで自分で作成したプロバイダ名を選択します。
  5. 「同意する」をクリックします。
  6. プライバシーポリシーと利用規約は空欄のママでも構わないので「OK」をクリックします。
  7. 確認画面で「OK」をクリックします。
  8. ショップサーブの管理画面に表示されているWebhook URLを入力します。

■チャネルシークレット と チャネルアクセストークンを確認します

  1. 左サイドメニューから「プロバイダー名」をクリックします。
  2. 「Messaging API」と書かれている方のチャネルをクリックします。
  3. 「チャネル基本設定」をクリックします。
  4. 「チャネルシークレット」を確認し、メモ帳などにコピーして保存しておきます。
  5. 「Messaging API設定」をクリックします。
  6. 「Webhookの利用」をONにします。
  7. 「Webhookの再送」をONにします。
  8. 「エラーの統計情報」ONにします。
    こちらは必須ではありませんが、推奨です。
  9. 「チャネルアクセストークン」を確認し、メモ帳などにコピーして保存しておきます。表示されていない場合は「発行」ボタンを押して発行してください。

1-4 LINEで取得した情報をショップサーブに設定する

開発者ページで確認した、チャネル IDチャネルシークレットチャネルアクセストークン をショップサーブの管理画面に設定します。

■ショップサーブの管理画面を開きます

■チャネル ID とチャネルシークレット、チャネルアクセストークンを設定します

  1. LINEの「利用設定」をクリックします。
  2. LINEの開発者ページでコピーして保存しておいた情報をショップサーブの管理画面に貼り付けます。
  3. 「設定を保存する」ボタンをクリックします。
  4. 「閉じる」ボタンをクリックします。

■利用するに切り替えます

5. LINEを「利用する」に切り替えます。

6.  画面最下部の「設定を保存する」ボタンをクリックします。

■LINE友だち登録の特典付与について

LINE公式アカウントを連携していると、初回友だち登録時にお得なクーポンやポイントを付与する事ができます。
設定については他のページでご案内していますので、そちらをご覧ください。

>>詳しくは、オンラインサポートで検索「クーポン」
>>詳しくは、オンラインサポートで検索「ポイント」


すでにLINE公式アカウントと友だちの場合、対象となりません。

1-5 メールアドレス取得権限の申請をする

LINEに登録しているメールアドレスを取得するためには、お客さんにメールアドレスを取得してログインしている旨を同意いただく必要があります。そのため、お店ページにメールアドレスの取得と利用目的の説明を追加してください。また、掲載画面のスクリーンショットをLINEにアップロードし、メールアドレスの取得権限の申請をしてください。


ご利用案内ページ以外の他のページに掲載しても構いません。

■ご利用案内に追加します

  1. 「 自由設定欄の追加 」に見出しを入力します。
  2. 「 欄を追加する 」ボタンをクリックすると説明の入力欄が表示されます。
  3. LINEに登録してあるメールアドレスの取得・利用目的について説明を入力します。
  4. 画面最下部にある「設定を保存する」をクリックします。

  5. 以下は、サンプルの文面です。店舗さんが利用する他サイトID連携に合わせて編集してください。

    LINE、Facebook、TwitterおよびYahoo!JAPANに登録している情報と当店の会員登録情報を連携することにより、 各サイトIDを使ってログインすることができます。 ログイン画面にある、【他サイトIDでログイン】ボタンより手続きを行ってください。 なお、ログイン時の認証画面にて許可をいただいた場合のみ、各サイトの登録情報を取得し連携します。 取得情報は以下の項目となります。

    ■LINE               名前・メールアドレス
    ■Facebook         姓名・姓名の読み仮名・メールアドレス
    ■Twitter            メールアドレス
    ■Yahoo! JAPAN   姓名・性別・郵便番号・メールアドレス
    ■Amazon            姓名・メールアドレス

    また、各サイトID連携を解除したい場合は、マイページ内にある「他サイトとのID連携」にて【解除する】ボタンをクリックしてください。

■お店ページ更新します

5. 管理画面左上の「お店ページの更新へ」ボタンをクリックします。

6. 「利用中のテーマでお店を更新」をクリックします。
ベーシックテンプレートを利用の場合は「更新を開始」ボタンをクリックします。

■スクリーンショットを撮ります

  1. お店ページを開き、追加した説明文を確認します。
  2. 説明が掲載されている箇所のスクリーンショットを撮ります。

■スクリーンショットを登録します

  1. OpenID Connectの「申請」ボタンをクリックします。
  2. 内容を読み、2箇所にチェックを入れます。
  3. スクリーンショットした画像を登録します。


    ファイルサイズ:3MB以内
    形式:JPEG、PNG、GIF、またはBMP

  4. 「保存」ボタンをクリックします。
    元の画面の戻ると、ステータスが「未申請」→「申請済」になります。
LINEのチャネル基本設定画面

2 カートの流れ

他サイトID連携を「利用する」に設定をすると、お客さんはカート画面やマイページで、他サイトIDで新規会員登録、および他サイトIDでログインができます。ここでは、LINEアカウントで新規会員登録、およびログインするときのカートの流れを確認します。


他サイトID連携機能は、お気に入り登録時やLPカートでは利用できません。

2-1 LINEアカウントで新規会員登録する

LINEアカウントで新規会員登録を行うと、ショップサーブの会員IDとLINE IDが連携されます。
次回以降は、ショップサーブのお店に、LINEアカウントを利用して簡単にログインができるようになります。

■商品をカートに入れる

商品をカートに入れて「会員登録して購入手続きへ進む」ボタンをクリックします。新規会員登録する画面を開きます。

■LINEアカウントで新規会員登録する

LINEでログインを行ってから新規会員登録をします。

  1. 「他サイトIDで新規会員登録」ボタンをクリックします。
  2. 「LINEでログイン」ボタンをクリックします。

■LINEでログインする

LINEのログイン画面が開きますのでLINEアカウントでログインします。 ログイン済みであれば、アカウント名を確認して「ログイン」ボタンをクリックします。
LINEのログイン認証画面が表示されたら認証を許可してください。


Googleアナリティクスをご利用の場合、参照元除外リストに LINEログイン認証画面のドメイン(access.line.me)を追加してください。


 

■会員登録を完了する

ショップサーブの画面に戻り、新規会員登録をします。

  1. 必須項目を入力します。
    会員ID、パスワードなどの必須項目をすべて入力します。

    「メールアドレス」「お名前」の入力欄に、LINEアカウントの登録情報が自動で反映されています。反映された情報の編集もできます。

  2. 会員規約に同意します。
  3. 「会員登録する」ボタンをクリックします。
    次の確認画面で、会員登録を完了してください。


    カート画面で購入手続き時に会員登録が完了すると、ショップサーブのお店の会員IDとLINEIDが自動連携されます。マイページで改めて連携する必要はありません。

 

2-2 LINEアカウントで会員ログインする

ショップサーブのお店の会員IDとLINEIDを連携済のお客さんは、LINEアカウントで会員ログインができます。ショップサーブのお店の会員ID・パスワードが入力不要なため、パスワードを忘れた場合でも仮パスワード発行手続きの手間がなくなります。

■商品をカートに入れる

カート画面で購入手続きする時にLINEでログインします。
  1. 「他サイトIDでログイン」ボタンをクリックします。
  2. 「LINEでログイン」ボタンをクリックします。


「他サイトIDでログイン」ボタンは、すでにID連携済のお客さんがクリックするボタンです。ID未連携のお客さんがクリックすると、エラーになりログインできません。マイページでID連携が必要です。

詳しくは、「3-1 マイページでID連携する」を参照してください。


カート画面の「他サイトIDでログイン」ボタンは、管理画面メニュー「 お店設定 > ショッピングカート > メッセージの編集 」で画像の変更もできます。

■LINEでログインする

LINEのログイン画面が開きますのでLINEアカウントでログインします。 ログイン済みであれば、アカウント名を確認して「ログイン」ボタンをクリックします。
LINEのログイン認証画面が表示されたら認証を許可してください。

■カート画面に戻る

会員ログインした状態でカート画面に戻ります。

3 LINEとID連携する

普段利用しているアカウントでログインができれば、お店に来店しやすくなりリピート購入につながります。
店舗さんは、すでにお店で会員登録しているお客さんに、会員IDと他サイトIDとの連携を促しましょう。


他サイトIDで連携する方法は、2通りあります。
1、他サイトIDで新規会員登録する    2、マイページでID連携する

3-1マイページでID連携する

会員のお客さんが購入手続きする時に、LINEアカウントでログインできるようにするには、マイページでID連携が必要です。

■マイページでログインをする

  1. お店の会員IDとパスワードを入力してマイページでログインします。
  2. ログイン後、マイページトップ画面下部に移動し「 他サイトID連携 」のリンクをクリックします。

■LINE IDと連携する

3. 「連携する」ボタンをクリックするとLINEのログイン画面が開きます。

4. LINEアカウントでログインします。

LINEでログイン済みであれば、アカウント名を確認して「ログイン」ボタンをクリックします。LINEのログイン認証画面が表示されたら認証を許可してください。
5. マイページの画面に戻ると連携されています。
  ID連携は、いつでも解除できます。


公式アカウントの連携をした状態で、会員がLINE ID連携すると、マイページから友だち登録ができるようになります。
なお、ここからWEB版プロフィールページに遷移できるようにするにはLINE公式アカウントが認証済みである必要があります。

3-2 注文完了後にID連携する

注文完了したお客さんは、「他サイトID連携へ」ボタンからマイページでID連携ができます。

■会員が注文完了後にID連携する

  1. 注文完了画面で「他サイトID連携へ」ボタンをクリックします。
    マイページの他サイトID連携する画面が開きます。
  2. 「連携する」ボタンをクリックし、LINEIDと連携完了します。

■注文完了後に 新規会員登録してID連携する

注文完了画面で会員登録したお客さんも、 会員登録後マイページでID連携ができます。
  1. 会員ID、パスワードなどの必須項目を入力後、会員規約に同意して「会員登録する」ボタンをクリックします。
  2. 会員登録完了画面で「他サイトID連携へ」ボタンをクリックします。
    マイページの他サイトID連携する画面が開きます。
  3. 「連携する」ボタンをクリックし、LINE IDと連携完了します。
※2021年2月時点の開発者ページの操作マニュアルを掲載してます。サービス提供元が予告なく仕様変更する場合がございます。
  詳しくは、サービス提供元にご確認ください。なお、当社ではアプリの設定代行は行っておりません。