お使いのメルマガ配信サービスを選んでフォームのHTMLを貼り、デザインを選ぶと、LPに貼るHTMLとCSSが自動で出力されます。
① 基本設定
うまくいかないときは、開発者に知らせる
読み込めないときや、フォームを設置しても登録できないときは、ここから知らせてください。選んだ配信サービスと貼り付けたHTMLは自動で送られるので、メールアドレスを入れて送るだけです。確認して対応したら、メールでお知らせします。
※ 送信ボタンを押すと別のタブで確認画面が開きます。内容を確認して送信を完了してください。
同じLPにデザイン違いのフォームを2つ置くときは、接頭辞とアンカーIDを変えてください（例：fmk2 / section_form2）。アンカーIDを空にするとアンカーは出力されません。
② 色
③ 形
④ ボタンアニメーション
マウスを乗せたときの「ふわっと浮く」動きは、どのアニメーションでも効きます。
⑤ 文言
⑥ 入力項目（お名前）
⑦ 設定の保存・読み込み
作業内容はこのブラウザに自動で保存され、再読み込みしても続きから始められます。別のブラウザやパソコンで使うときや、デザインを保管しておきたいときは「テキストでダウンロード」で設定データをファイルに保存してください（ファイル名：FM_サービス名_日付.txt）。保存したファイルは「ファイルを選択して読み込む」で復元できます。
コピー＆ペーストで受け渡ししたいときは、下の「設定コード」欄を使ってください。
🔓 FORMAKE PROなら、もっと自由に
色を10か所まで自由に指定、角丸や影などの形の調整、7種類のボタンアニメーション、1つのLPに複数フォーム、設定の保存と読み込みが使えます。
PRO版のご登録はこちら（無料）CSSとHTMLをまとめた版（1ブロックに貼るとき用）
FORMAKE（フォーメイク）とは
FORMAKEは、メルマガ配信サービスで発行した登録フォームを、LPやブログになじむデザインに作り変える無料ツールです。配信サービスのHTMLを貼り付けて、色やボタンの動きを選ぶだけ。プログラミングの知識がなくても、そのまま貼れるHTMLとCSSが完成します。
貼るだけで読み込み
配信サービスのHTMLを貼ると、送信先や必要な隠し項目を自動で読み取ります。どのサービスのフォームかも自動で判定します。
5つのサービスに対応
マイスピー、アスメル、エキスパ、オレンジメール、ジェイシティに対応。サービスごとの細かい違いは、ツールが吸収します。
押されるボタンに
8色のカラープリセットと、目を引くボタンアニメーション。画面で確かめながら、LPの雰囲気に合うフォームに整えられます。
使うとどうなる？
配信サービスが発行するフォームは、表組みに「確定」ボタンだけのシンプルな見た目が多く、せっかく作り込んだLPの中で浮いてしまいがちです。FORMAKEを通すと、同じフォームがLPになじむデザインに変わります。
そのまま貼ると
FORMAKEを通すと
＼ 期間限定で配布中 ／
登録フォームは、LPの中でいちばん大事な「最後のひと押し」の場所です。見出しで呼びかけ、押したくなるボタンを置き、注意書きで不安を取り除く。その形を、毎回ゼロから作らずに済むのがFORMAKEの役割です。
対応しているメルマガ配信サービス
次の5つのサービスに対応しています。それぞれの管理画面で発行した「登録フォームのHTML」をそのまま貼り付けてください。
| 配信サービス | HTMLを発行する場所 | URLだけで読み込み |
|---|---|---|
| マイスピー（MyASP） | シナリオ管理の「登録フォームタグの発行（HTML）」 | できる |
| アスメル | シナリオの「登録フォームのHTMLソース」 | できる |
| エキスパ | フォームの「HTMLタグ発行」 | できない |
| オレンジメール | 読者登録フォームの「埋め込みHTML取得」 | できない |
| ジェイシティ（Jcity） | 登録フォームのHTML | できる |
※「URLだけで読み込み」ができるサービスは、HTMLの代わりに登録フォームのURLを貼っても使えます。迷ったときは、HTMLを丸ごと貼るのがいちばん確実です。
使い方
作業は4ステップです。はじめての方でも、5分ほどでフォームが完成します。
配信サービスのHTMLを貼る
「配信サービスで発行したフォームのHTML」の欄に、管理画面でコピーしたHTMLを貼り付けます。サービスは自動で選ばれ、読み込めると緑色の枠で「読み込みました」と表示されます。
色とボタンの動きを選ぶ
カラープリセットからLPに合う色を選び、ボタンアニメーションを決めます。右側のプレビューに、すぐに反映されます。
文言とお名前欄を整える
見出し、ボタンの文言、注意書きを、プレゼントの内容に合わせて書き換えます。お名前も集めたいときは、「入力項目」でお名前欄をオンにします。
HTMLとCSSをLPに貼る
「出力コード」のHTMLとCSSをコピーして、LPに貼り付けます。WordPressなら、HTMLをカスタムHTMLブロックに、CSSを追加CSSの欄に貼ります。CSSを貼る欄がないときは、「CSSとHTMLをまとめた版」を1か所に貼ってください。
公開前に、必ずテスト登録を
フォームを貼ったら、ご自分のメールアドレスで一度登録してみてください。配信サービスの読者一覧に追加され、自動返信メールが届けば完成です。配信サービス側で「お名前」を必須にしている場合は、FORMAKEでもお名前欄をオンにして「必須にする」にチェックを入れてください（オフのままだと登録エラーになります）。
PRO版で使える機能
FORMAKE PROでは、左のパネルのすべての項目が使えます。LPの色や雰囲気に合わせて、フォームを細かく作り込んでください。
色を10か所まで指定する
「② 色」で、メインカラー、グラデーションの終点、見出し、ボタンの文字、外枠の背景と線、入力欄の背景と線、ラベル、注意書きの色を1つずつ決められます。カラーコードを直接入力することもできます。ボタンのグラデーションのオン・オフも選べます。
形を整える
「③ 形」で、外枠をカードにするか背景に溶け込ませるか、影の強さ、外枠・入力欄・ボタンの角丸、ボタンの幅、フォームの最大幅を調整できます。ボタンをカプセル型（完全な丸）にすることもできます。
7種類のボタンアニメーション
ブルブル、ぷるん、キラッ、ドクドク、ぴょこん、ふわっと光る、なしの7種類から選べます。「動きの間隔」で、ゆっくり・ふつう・速めの切り替えもできます。
フォントとラベル
フォントは、Noto Sans JPか、設置するサイトのフォントを選べます。「入力項目」で、入力欄の上に「メールアドレス」などの項目名を表示することもできます。お名前を必須にしたときは「必須」の印も付きます。
1つのLPに複数のフォームを置く
「① 基本設定」のクラス接頭辞とアンカーIDを、2つ目のフォームでは別の名前（例：fmk2 と section_form2）にしてください。デザイン違いのフォームを、同じページに並べて置けます。
設定の保存と読み込み
「⑦ 設定の保存・読み込み」の「テキストでダウンロード」で、作ったデザインをファイルに残せます。別のパソコンで続きを作るときや、LPごとにデザインを使い分けるときは、そのファイルを読み込むだけで元どおりになります。
フリー版とPRO版の違い
このページのFORMAKEはPRO版です。ご登録ありがとうございます。下の表の機能が、すべてお使いいただけます。
このページのFORMAKEはフリー版です。どの配信サービスでも、貼るだけでおしゃれなフォームを作れるという一番大事な機能は、フリー版でもすべて使えます。自分のLPに合わせて細かく作り込みたい方には、メールアドレスのご登録で使えるPRO版をご用意しています。
| 機能 | フリー版 | PRO版 |
|---|---|---|
| 5サービス対応・HTMLの読み込み・自動判定 | 使える | 使える |
| 見出し・ボタン・注意書きの文言編集 | 使える | 使える |
| お名前欄の追加 | 使える | 使える |
| 色 | プリセット8色 | 10か所を自由に指定 |
| 形（角丸・影・外枠・ボタン幅など） | 標準デザイン | 自由に調整 |
| ボタンアニメーション | 2種類 | 7種類＋動きの速さ |
| フォントの切り替え | なし | 使える |
| 入力欄の上のラベル表示 | なし | 使える |
| 1つのLPに複数のフォームを設置 | なし | 使える |
| 設定の保存・読み込み | なし | 使える |
| 料金 | 無料 | 無料（メールアドレスのご登録） |
よくある質問
本当に無料で使えますか？
はい、無料です。個人でも商用でもお使いいただけます。作ったフォームにクレジット表記を入れる必要もありません。
「読み込めませんでした」と表示されます
選んだ配信サービスと貼ったHTMLが合っているか確認してください。違うサービスのHTMLだと分かったときは、切り替えボタンが表示されます。それでも読み込めないときは、HTMLの貼り付け欄の下にある「うまくいかないときは、開発者に知らせる」から、メールアドレスを入れて送ってください。貼り付けたHTMLが自動で添えられるので、確認して対応します。
フォームを設置したのに、登録できません
いちばん多いのは、配信サービス側で「お名前」が必須なのに、FORMAKEでお名前欄をオフにしているケースです。お名前欄をオンにして「必須にする」にチェックを入れてください。それでも登録できないときは、「開発者に知らせる」から教えてください。
一覧にない配信サービスでも使えますか？
現在は5つのサービスに対応しています。ほかのサービスを使っている方は、「開発者に知らせる」からHTMLを送っていただけると、対応を検討する参考にさせていただきます。
フリー項目（名前とメールアドレス以外の入力欄）は使えますか？
FORMAKEは、確実に動くことを優先して「お名前」と「メールアドレス」の2つに絞っています。フリー項目は配信サービスごとに設定の仕方が大きく違い、選択肢の文言が少しずれるだけで登録エラーになるためです。
LPのボタンから、フォームの場所へジャンプさせるには？
FORMAKEのフォームの上には、アンカー（ジャンプ先の目印）が付いています。LPのボタンのリンク先を「#section_form」にすると、押したときにフォームの場所まで移動します。アンカーIDを変えたときは、「#」のあとをその名前にしてください。
別のパソコンで、続きから作れますか？
作業内容は、使っているブラウザに自動で保存されます。別のパソコンやブラウザで続けるときは、「⑦ 設定の保存・読み込み」の「テキストでダウンロード」でファイルを保存し、使う先で「ファイルを選択して読み込む」から読み込んでください。
貼り付けたHTMLは、どこかに送られますか？
送られません。FORMAKEはお使いのブラウザの中だけで動き、作業内容もそのブラウザに保存されるだけです。「開発者に知らせる」から送信したときだけ、選んだサービス名と貼り付けたHTMLが届きます。
WordPress以外でも使えますか？
使えます。出力されるのはふつうのHTMLとCSSなので、HTMLを貼れるページ作成サービス全般で使えます。CSSを貼る場所がないときは、「CSSとHTMLをまとめた版」をお使いください。