LIFFとは?


■LIFFとは?

LIFFの正式名称は、「LINE Front-end Framework」です。
「LIFFとは何か」をひとことで表すと「ウェブページをLINE上に表示できる仕組み」です。

ECAIでLIFFを使用する場合、「オリジナルフォーム」と「外部サイトを埋め込む」の2種類の使用方法があります。



■LIFFを使用するケース
下記ケースに当てはまらない場合はLIFFを使用する必要はありません。

・オリジナルフォームを使用してアンケートの回答を取得(ECAIに保存)する場合
・オリジナルフォームを使用してアンケートの回答ごとにタグを付ける場合
・オリジナルのURLをユーザーに表示したくないなどの理由から「外部サイトのURL」をLIFFの呼び出しURLで表示したい場合
・サイトを開いた際の画面サイズをTall(8割)、Compact(5割)で表示したい場合




■「オリジナルフォーム」を使用するメリット

・オリジナルフォームの送信データをECAIで使用したり、タグ付与ができます。
・htmlを使用したサイトを表示できる。
 ┗ファイル形式/ZIP(html, css, js, png, jpg)
 ┗ファイルサイズ/20MB以下
 ┗ファイルの構造について>
・Full(全画面)、Tall(8割)、Compact(5割)から画面サイズを選択できる。

オリジナルフォーム(LIFF)の新規作成>


■「外部サイトを埋め込む」を使用するメリット

・Full(全画面)、Tall(8割)、Compact(5割)から画面サイズを選択できる。
・LIFFアプリで開くため、ブラウザ内で操作できるメニューが限定される。
・URLがLIFFの呼び出しURLになる。
(例)line://app/1655906054-Xwlz4Lxo
※LINE内でWEBページを表示させるだけでしたら、「外部サイトを埋め込む」を使用する必要はありません。

外部サイトの設定方法>

LIFFの設定方法、LIFFとは

LINE Front-end Framework(LIFF)とは

「LIFFとは何か」をひとことで表すと「ウェブページをLINE上に表示できる仕組み」です。ユーザー体験として外部リンクでもLINE内で表示されるので心地よく外部サイトを表示させることが可能になります。


LIFFの設定方法

① 左サイドメニュー>コンテンツ>②作成

③ LIFF管理名を入れる。お客様には表示されません。社内管理用です。

④ 画面サイズを設定 LINE内で何パーセントで見せるかです。視認性が良いのはFull(全画面)になるのでECAIでは全画面を推奨しています。作成後に後から編集可能です。

⑤ 外部サイトにチェックを入れて表示させたいURLを挿入

⑥ 保存を押して完了

LIFFの設定方法

LINE Front-end Framework(LIFF)とは

「LIFFとは何か」をひとことで表すと「ウェブページをLINE上に表示できる仕組み」です。ユーザー体験として外部リンクでもLINE内で表示されるので心地よく外部サイトを表示させることが可能になります。


LIFFの設定方法

① 左サイドメニュー>コンテンツ>②作成

③ LIFF管理名を入れる。お客様には表示されません。社内管理用です。

④ 画面サイズを設定 LINE内で何パーセントで見せるかです。視認性が良いのはFull(全画面)になるのでECAIでは全画面を推奨しています。作成後に後から編集可能です。

⑤ 外部サイトにチェックを入れて表示させたいURLを挿入

⑥ 保存を押して完了

LIFFに外部サイトを設定する方法

■目的
ウェブページをLINE上に表示したいときはLIFFの外部サイトを使用します。
LIFFとは?

■セット所要時間
3分

■セットの流れ

① 左サイドメニュー>コンテンツ>②作成

③ LIFF管理名を入れる。お客様には表示されません。社内管理用です。

④ 画面サイズを設定 LINE内で何パーセントで見せるかです。視認性が良いのはFull(全画面)になるのでECAIでは全画面を推奨しています。作成後に後から編集可能です。

⑤ 外部サイトにチェックを入れて表示させたいURLを挿入

⑥ 保存を押して完了

LIFF設定で外部サイトの埋め込みを使うメリット

LIFF設定にて外部サイトの埋め込みを使うメリットは2つあります。



 ① 画面表示を3段階(全画面、8割、5割)に分けられる。

 ② どんな外部サイトでもLINEブラウザで表示できる。
 (端末によってsafari、Cromeなどブラウザを分けたくない場合に有効) 
オリジナルフォーム(LIFF)を入力のないLPのように使う方法
■目的
オリジナルフォーム(LIFF)を入力のないLPのように使う方法

■セット所要時間
5分

■セットの流れ

パターン1】
LIFFを外部サイトに設定することで、外部のサイトをLIFFで開くことができます。

外部サイトの設定方法>


【パターン2】
LIFFファイルのindex.htmlで静的ページを生成する。
index.htmlを編集し、コンテンツを作成してください。
オリジナルフォームの編集方法>

LIFFファイル内には「index.html」と「complete.html」を必ずセットで作成する必要があります。
LIFFファイルの構造についてはこちら>




ガイドの内容はあくまでもサンプルになります。  そのまま使用できない場合は対応するフォームにあわせての編集をお願いします。   表示設定が正常にできない場合、ソースチェックの有償サポートも行っております。  ご希望の場合は設定代行バナー、もしくはお問い合わせLINE、チャットワークよりご依頼をお願いします。