WordPress を Shifter へ移行するにあたって、フォームサービスを色々調べてみた。

# ０．はじめに

AWS EC2 [AMIMOTO](https://ja.amimoto-ami.com/) で [WordPress](https://wordpress.com) サイトを構築して、

* [AMIMOTO AMI を使って、WordPress を立ち上げて、接続先を RDS に変更してみる \- Qiita](https://qiita.com/kusokamayarou/items/58d550b82b960c321c3a)

[CloudFront](https://aws.amazon.com/jp/cloudfront/) やら [ALB](https://docs.aws.amazon.com/ja_jp/elasticloadbalancing/latest/application/introduction.html) やら [AWS WAF](https://aws.amazon.com/jp/waf/) を適用したりと…、

* [SSL 化済みの WordPress サイトに CloudFront を適用してみる \- Qiita](https://qiita.com/kusokamayarou/items/21e4bcdaa7c8dd8523ab)
* [CloudFront 適用済みの WordPress サイトに ALB を適用してみる \- Qiita](https://qiita.com/kusokamayarou/items/1229bed12462eee48e68)
* [CloudFront 適用済みの WordPress サイトに ALB を適用後、ALB \- WordPress 間を HTTP\(80番\) で通信させてみる \- Qiita](https://qiita.com/kusokamayarou/items/edffa0f1159f60a2ce82)
* [CloudFront 適用済みの WordPress サイトに AWS WAF も適用してみる \- Qiita](https://qiita.com/kusokamayarou/items/099a97fc0edc493e22fb)
* [CloudFront と AWS WAF 適用済みの WordPress \(AMIMOTO\) サイトで、ウェブモニタリング \(Site24x7 & StatusCake\) からのポーリングをブロックさせない様にしてみる \- Qiita](https://qiita.com/kusokamayarou/items/9b1093c922b6642fc26f)

色々やってたんですが…、

どうも運用が非常に面倒臭くなってきちゃいまして…、

😫😫😫

「ええーぃ、[Shifter](https://go.getshifter.io) へ移行しちゃろうかい！」と思ってですね。

で、

そうすると、問い合わせページとかのフォームをどうしようかい？という話になりまして、ちょっくらググってみたところ、こちらのページなどが見つかりまして…、

* [Shifterで問い合わせフォームを作る \| Life Retrospective](https://hisa-tech.site/shifter-contact-form-basin/)
* [Shifterで問い合わせフォームを作る（FormSpree連携） \| Life Retrospective](https://hisa-tech.site/shifter-contact-form-formspree/)

<br>

「ほほぅ、さすが [Shifter](https://go.getshifter.io) さん。その辺のネタもきっちり揃うとるんですなぁ…。」と思ったんですが…、

生来の「もうちょい探したら、もっと良いもん出てくるんじゃ無いんかい！」癖がムクムクと起き上がってきまして…、英語もたいしてわからないんですが、適当に漁ってたら、こちらのページなどが見つかりまして…。

* [A Comparison of Static Form Providers \| CSS\-Tricks](https://css-tricks.com/a-comparison-of-static-form-providers/)

<br>

そしたら、何か、[Kwes Forms](https://kwes.io/) というサービスをベタ褒めしてたので、ちょっと興味引かれまして…、

ただ、今度は、「イヤイヤ、そんなこのネットの時代に、どこの誰が書いたかもわからない記事を一つ読んだだけで、そうそう大事なこと決めたりしないしないでしょ！」病がやってきまして…。

この辺のページとか見つつ、色んなフォームサービスを調べたり試してみたところ…、

* [Best Form Services to use in 2020 \- DEV](https://dev.to/haamidev/best-form-services-to-use-in-2020-41ij)

<br>

結局、「 [Kwes Forms](https://kwes.io/) 良いんじゃない ♪♪♪」ということになったんですが…、せっかくだから、色々と調べたことを書いておこうかと…。

# １．選定の基準など…

で、今回色々と調べたり、試したりしたフォームサービスについてですが、

一応の必須の基準としては、こちらを５点を設けときました。

* フリープランがある。
* 10サイト、30フォーム あたりまで利用できる。
* API や 他サービス との連携がしっかりしてる。
* フォーム登録後のメールの内容をある程度カスタマイズ出来る。
* リアルタイムチャットサポートなど、サポートが充実している。

では、順番に…、

# ２．既存のページに、スクリプトタグを埋め込んだりするタイプのサービス

## [Kwes Forms](https://kwes.io/)

<a href="https://kwes.io/"><img src="https://kwes.io/images/logo.png" width=256></a>

* Plan : GOLD $79 / Month　[※](https://kwes.io/pricing)
* 10 Sites, Unlimited Forms, 10K Submissions / Month
* File Storage : 20GB
* Integrations : CSV, Webhooks, API (50K/Day), Zapier, Stripe
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Custom Email : ○　※ロゴも可
* Live Chat Support : ○
* Validation : ○　※日本語あり
* Data Archive : Unlimited
* 10 Additional Users, Local Testing, Calculated Fields, Repeater Fields, Multistep Forms
* 機能が非常に豊富で、使いやすいUI。
* 多言語対応のバリデーションや様々な種類のフォームが用意されているので、複雑なフォームを使いたい場合は、良いかも。

## [Formcarry\.](https://formcarry.com/)

<a href="https://formcarry.com/"><img src="https://formcarry.com/assets/img/logo.png" width=256></a>

* Plan : Growth $49 / Month　[※](https://formcarry.com/)
* Unlimited Sites, Unlimited Forms, 10K Submissions / Month
* File Storage : 5GB
* Integrations : CSV, JSON, Webhooks, API, Zapier,
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Custom Email : ○
* Live Chat Support : ○
* Data Archive : Unlimited
* reCaptcha, Analytics, Use Your Own Mail Server
* 機能が非常に豊富で、使いやすいUI。
* メール関連の機能が豊富。

## [Formspree](https://formspree.io/)

<a href="https://formspree.io/"><img src="https://formspree.io/img/formspree-logo-full-horizontal@0.5x.png" width=256></a>

* Plan : PLATINUM $40 / Month　[※](https://formspree.io/plans)
* Unlimited Sites, 50 Forms, 5K Submissions / Month
* File Storage : 10GB
* Integrations : Webhooks, API, Zapier, Stripe, Slack, Zendesk
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Live Chat Support : ○
* Data Archive : 365 Day
* reCAPTCHA
* 最低限の機能は揃っていて、使いやすいUI。
* ダッシュボードからは、直近30日しか Submissions を見れない？アーカイブも、365日まで？

## [Basin](https://usebasin.com/)

<a href="https://usebasin.com/"><img src="https://usebasin.com/assets/website/logo_l-182f8fd2575d2bb95b9e48d329140e412ceb21c90d6c9127d9f97d2d10740f8a.svg" width=256></a>

* Plan : Premium $15 / Month　[※](https://usebasin.com/pricing)
* Unlimited Sites, Unlimited Forms, 5K Submissions / Month
* File Storage : 10GB
* Integrations : CSV, XLSX, Webhooks, API, Zapier
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Custom Email : ○
* Validation : △　※ [Form Validation \- Basin Docs](https://usebasin.com/docs/setup/form-validation)
* Data Archive : Unlimited　※指定可
* reCAPTCHA, Custom Honeypot Field, Analytics, Unlimited sub-accounts, Custom domains
* 最低限の機能は揃っていて、使いやすいUI。
* 料金が非常に安い。
* Unlimited Forms なので、たくさんの種類のフォームがある場合は、良いかも。

## [Form2chat\.io](https://app.form2chat.io/)

<a href="https://app.form2chat.io/"><img src="https://app.form2chat.io/assets/logo-70bf7562310c175a1664cf91e13530ebb2bc498469abb7b920b76cc013101d49.svg" height=64></a>

* Plan : PREMIUM $10 / Month　[※](https://app.form2chat.io/pricing)
* Unlimited Sites, Unlimited Forms, 75K Submissions / Month
* File Storage : 10GB
* Integrations : CSV, JSON, Email, Webhooks, API, Zapier, Slack, Messenger, Telegram, Viber
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Custom Email : ○
* Live Chat Support : ○
* Data Archive : Unlimited　※指定可
* reCAPTCHA, Analytics, Collaborators
* 最低限の機能は揃っていて、使いやすいUI。
* 料金が非常に安い。
* 場合によっては、[Basin](https://usebasin.com/) よりも良いかも。

## [Getform](https://getform.io/)

<a href="https://getform.io/"><img src="https://getform.io/_nuxt/img/095d0b3.svg" height=64></a>

* Plan : Enterprise $69 / Month　[※](https://getform.io/pricing)
* Unlimited Sites, 75 Forms, Unlimited Submissions
* File Storage : 25GB
* Integrations : Webhooks, API, Zapier
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Custom Email : ○
* Live Chat Support : ○
* Validation : △　※ [Getform \| Easy form endpoints for your forms](https://getform.io/docs/validations/html5-form-validation)
* Invite Unlimited members
* 非常にシンプルで、実装も非常に簡単。
* Unlimited Submissions なので、大量にリクエストが発生する場合は良いかも。

## [formX](https://formx.stream/index)

<a href="https://formx.stream/index"><img src="https://formx.stream/assets/img/formx-white.png" width=256></a>

* Plan : SMBs & Freelancers $49.99 / Month　[※](https://formx.stream/pricing)
* 10 Sites, Unlimited Forms, Unlimited Submissions / Month
* Integrations : CSV, Webhooks, API, Zapier, Slack
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Custom Email : △
* Live Chat Support : ○
* reCAPTCHA, Custom Reports, Workflow & State Management
* 最低限の機能は揃っていて、使いやすいUI。
* Unlimited Submissions なので、大量にリクエストが発生する場合は良いかも。
* ファイルアップロードは無いのかな？

## [FieldGoal](https://fieldgoal.io/)

<a href="https://fieldgoal.io/"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/0e579848-bc43-c6a2-0473-e8277ae3f05f.png" width="256"></a>

* Plan : Agency $79 / Month　[※](https://fieldgoal.io/)
* Unlimited Sites, 50 Forms, Unlimited Submissions
* File Storage : AWS S3
* Integrations : API, Zapier
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* reCAPTCHA
* 非常にシンプルで、実装も非常に簡単。
* Unlimited Submissions なので、大量にリクエストが発生する場合は良いかも。そうでなければ、ちょっとコスト高。
* ストレージも S3 なので、制限無し。

## [SmartForms](https://smartforms.dev/)

<a href="https://smartforms.dev/"><img src="https://smartforms.dev/logo.png" height=64></a>

* Plan : Enterprise $20 / Month　[※](https://smartforms.dev/pricing)
* Unlimited Sites, Unlimited Forms, 10K Submissions / Month
* File Storage : 10GB
* Integrations : Webhooks, Zapier, Slack, Telegram
* Spam Protection : ○
* Thank you Page URL Redirect : ○　※リダイレクトと Thank you Page が別で設定可。
* reCAPTCHA
* 最低限の機能。

## [Pageclip](https://pageclip.co/)

<a href="https://pageclip.co/"><img src="https://d2qlddhczasafd.cloudfront.net/img/logo-black.png" width=256></a>

* Plan : Pro $19 / Month　[※](https://pageclip.co)
* Unlimited Sites, Unlimited Forms, 10K Submissions / Month
* Integrations : CSV, JSON, Email, Webhooks, API, Zapier, Slack
* Validation : ○
* 機能は少なめ。ファイルアップロードも無し？

<br>

# ３．サービス内でフォームを作成し、リンクなどを払い出すタイプのサービス

各項目を WordPress に直接設定するのではなく、フォームをサービス内で作成したフォームのリンクなどを払い出して、それを WordPress のページに貼り付ける形式のサービスです。テンプレートなども用意されていて、フォームが WordPress のデザインと違っても気にならないのであれば、これらのサービスも良いかもしれません。

## [FormKeep](https://formkeep.com/)

* Plan : Agency $99 / Month　[※](https://formkeep.com/pricing)
* Unlimited Sites, 30 Forms, Unlimited Submissions
* File Storage : 7.5GB
* Integrations : Webhooks, API, Zapier, Slack, Google Sheets
* Spam Protection : ○
* Custom Email : ○
* Live Chat Support : ○　※電話サポートついているが、たぶん英語なのかな…。
* reCAPTCHA, Reports, Email Campaigns, Form Designer and Hosting, Team Roles
* 埋め込み系では無く、リンクを払い出す形のフォームサービス。

## [Wufoo](https://www.wufoo.com/)

* Plan : Professional $39 / Month　[※](https://www.wufoo.com/pricing/)
* Unlimited Sites, Unlimited Forms, 5K Submissions
* File Storage : 5GB
* Integrations : Webhooks, API (25K), Zapier, Slack, Google Sheets
* Spam Protection : ○
* Thank you Page URL Redirect : ○
* Custom Email : ○　※ロゴも可
* Live Chat Support : ○　※電話サポートついているが、たぶん英語なのかな…。
* Validation : ○　※日本語あり
* reCAPTCHA, Analytics, Report, User Management

## [Typeform](https://www.typeform.com/)

* Plan : Premium $70 / Month　[※](https://www.typeform.com/pricing/)
* Unlimited Sites, Unlimited Forms, 10K Submissions
* File Storage : 4GB
* Integrations : Webhooks, API, Zapier, Slack, Google Sheets
* Thank you Page URL Redirect : ○
* Custom Email : ○
* Live Chat Support : ○
* Team Collaboration, Custom Subdomain

## [JotForm](https://www.jotform.com/)

* Plan : Silver $39 / Month　[※](https://www.jotform.com/pricing/)
* Unlimited Sites, 100 Forms, 10K Submissions

# ４．その他のサービス

## [StaticKit](https://statickit.com/)

* Plan : PRODUCTION $20 / Month　[※](https://statickit.com/pricing)
* Unlimited Sites, Unlimited Forms, 1K Submissions / Month
* Integrations : API, Zapier
* コマンドラインでガチャガチャするタイプのサービス。

## [FormSubmit](https://formsubmit.co/)

<a href="https://formsubmit.co/"><img src="https://formsubmit.co/public/image/logo.jpg" width=256></a>

* 無料のサービス。
* 非常にシンプル。ダッシュボード無しで、フォーム登録でメールが通知される。

## [FormBackend](https://www.formbackend.com/)

* こちらのサービスは、サインアップ出来なかった…。

## [Formaholic \- Home](https://formaholic.com/)

* こちらのサービスは、サインアップ出来なかった…。

# ９９．ハマりポイント

* ハマったというか、色々調べたり、試したり、まとめたり…、<br>疲れました…。

😫😫😫

# ＸＸ．まとめ

今回、色々調べた結果。[Kwes Forms](https://kwes.io/) を選定しました。

選定の要因としては、

* 現在のフォームへの修正が少ないこと。
* 日本語のバリデート対応が簡単にできること。
* 通知するメールの内容を自由に変更できること。

あたりが大きかったです。

やはり、

* Shifter への移行の手間を如何に少なくするか。
* Shifter 移行後の手間やメンテナンスを如何に少なくするか。

といった観点が重要でした。

サービスの利用にあたっては、それぞれの事情や状況があるので、私の基準がそのまま当てはまることは無いと思いますが、こちらに今回の移行の手順の記事を書きましたので、良ければご覧下さい ♪♪♪

* [WordPress サイトで、MW WP Form で作成した問い合わせフォームを、固定ページ & Kwes Forms へ移行してみる。 \- Qiita](https://qiita.com/kusokamayarou/items/6f89113ef48f8514dd54)

あと、

バリデートについては、これらの様なライブラリを利用して、そのフォームに最適なバリデートを実装しても良いかもしれません。ただ、日本語の対応で色々手を入れないとダメかもしれないけど…。

* [7 Best Pure JavaScript Form Validation Libraries \(2020 Update\) \- CSS Script](https://www.cssscript.com/best-javascript-form-validator/)
* [20 Javascript Libraries to Build Form Validation Like a Boss – Bashooka](https://bashooka.com/coding/javascript-libraries-to-build-form-validation-like-a-boss/)
* [FormValidation • The best validation library for JavaScript](https://formvalidation.io/)

もし、これらのライブラリを試してみた方がいらっしゃれば、是非記事を投稿して、シェアして頂けると非常に嬉しいです！

😆😆😆

以上、ご参考になれば ♪♪♪

👋👋👋