オリジナルフォーム(LIFF)のアップロード方法
(1)対象フォームの選択
 ↓
(2)ZIPファイルをアップ
ZIPファイルの構造はルートフォルダ(一番上)の配下にindex.htmlがある状態にしてください。
>ZIPファイルの構造説明


※1.アップロードファイルは圧縮されている必要があります。
>フォームの圧縮方法について

※2.圧縮する場合はindex.htmlが存在する階層を全選択して圧縮してください。
>全選択可能な圧縮ツール(推奨)ダウンロード

※3.ファイル内に文字化けがないかご確認ください。


 ↓
(3) プレビューを確認して保存

正常にファイルを読み込めない場合は下記ガイドをご確認ください。
>フォームの圧縮方法について

プレビューが正常に表示されない場合は、一旦保存してから再度編集画面より確認してください。

 ↓
(4) ⑥一覧ページ、LIFF管理名のしたにある呼び出しURLを利用しLINEアプリより表示を確認

※⑦表示内容の下にあるURLはwebでデザインをチェックするときに使用するものです。
こちらで表示されるデザインは保証されるものではありません。確認の際は必ず呼び出しURLを利用しLINEアプリより確認をお願いします。

【フォーム】ZIPファイルの構造説明

・cssフォルダ   :各種スタイルファイルが入っています
・imagesフォルダ :画像ファイルが入っています。

・jsフォルダ    :jsファイルが入っています。
・complete.html  :送信完了ページ(サンクス画面)
・index.html    :フォーム入力ページ
・liff-starter.js   :Liff画面を立ち上げるためのjsファイル(削除禁止)



※テンプレートフォルダよりダウンロードしたzipファイルを解凍しますと上記のような構造となります。

編集する際はこちらの構造を保持したまま編集をお願い致します。
テンプレートダウンロード


※ファイル内に文字化けがないかご確認ください。
解凍ツール(推奨)https://www.ponsoftware.com/archiver/download.htm

※フォームを表示する「index.html」とサンクス画面を表示する「complete.html」は必ずセットで作成する必要があります。「complete.html」だけ未作成・アップロードされていない場合、送信後の画面が表示されない状態となりますので、ご注意ください。

ZIPファイルを解凍せず編集する方法
■目的
オリジナルフォームをアップロードするにはZIPファイルにする必要があるのですが、解凍を行わないことで再度圧縮する手間が省けます。

■セット所要時間
5分

■セットの流れ
※説明はWindowsになります。Macで行う場合はファイルを解凍してから編集を行なってください。
解凍後のファイルをアップロードするには圧縮が必要です。

(1)
①ZIPファイル上で右クリック
②プログラムから開く
③エクスプローラー
(2)
編集したいファイルをドラック&ドロップで、デスクトップなどにコピーします。
(3)
コピーしたファイルをメモ帳などで開きます。
※Macの場合はデフォルトで使用できる「テキストエディット」を使用してください。
編集後、ファイルを保存します。(保存しないと変更されません)
(4)
デスクトップの編集したファイルを、ZIPファイルの中へドラック&ドロップで戻します。
その際にアラートが出ますが上書きを選択してください。
(※元ファイルが必要な場合はバックアップを別に保管しておいてください)
(5)
ECAIのLIFFへアップロードして編集内容が反映されているかご確認ください。


お使いの端末、環境によってできないこともありますので、その場合は一度解凍してから編集をお願いします。
オリジナルフォームの編集方法>

動作確認済み:Windows10

LIFFのZIPファイルが20MBを上回っていてアップロードできない時の回避方法
■目的
アップロードしたいZIPファイルが20MBを超えているとアップロードできないので、その時の回避方法の説明します。

アップロードの方法はこちら>

■セット所要時間
5分

■セットの流れ
まず方法ですが、ZIPファイルが20MBを超えない重さにする必要があります。

LIFFをアップロードする際の仕様の話ですが、アップロードする際に古いファイルは削除されず新しいファイルが上書きされる仕様となります。
そのためすでにアップロードがされている画像ファイルをに関してはアップロードしなくても問題ありません。
LIFFファイルをZIPにする前に、既存の画像データに関しては一旦削除いただき、ZIPファイル全体が20MB以下になるように調整をお願いします。

アップロード後は画像がちゃんと表示されているかのご確認をお願いします。



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