WordPressテーマ THE THORにreCAPTCHA付きのお問い合わせページを作成したら!?

ホームラン?フォームランです

管理人が使っている有料のWordPressテーマ THE THOR(ザ・トールでは簡易のお問い合わせページが作成出来ますが、スパム対策もされていませんし、シンプルすぎて物足りないのでreCAPTCHAが設置出来てお問い合わせフォームが作成出来るサービスのFormrun(フォームラン)を導入してみたところスパム対策が効果抜群なのか、外国や日本からのスパムメールがなくなったので紹介します。

フォームが出来るサービスはプラグインのContact Formなどが有名ですがTHE THORとは相性が悪いプラグインの一つですし、外部のサービスを使えばプラグインの削減もできますので一石二鳥だと思います。

管理人はContact Formを使ったことがないですし、お問い合わせにこだわりもないのでTHE THORの簡易お問合わせを使ってきましたが、外国や日本からの宣伝などのスパムメールなどが多いのと、仕事の依頼が増えてきたのでちゃんとしたお問い合わせページを作成したいと思ったのでフォーム作成サービスを探していたところGoogleフォームやFormrun(フォームラン)が良さそうだと思ったので、まずはGoogleフォームを使ってみたあとでFormrunを使ってみたので紹介していきます!他にも以前から知っていたフォーム作成サービスで高機能なサービスがありますのでそちらも軽く紹介します。

 

人気
PR TIMSより出典

今回メインで紹介するFormrun(フォームラン)は「国内有料フォームツール」を対象とした実績調査で有料ユーザー数No.1を獲得するなど、今1番勢いがあるフォームツールサービスだと思います。調査期間が2021年3月12日(金)~3月22日(月)と比較的新しいので信頼性があると思いますし、ドメインを独自に調べたところ他のフォームサービスよりボリュームや流入数が凄いです。

 

スポンサーリンク

Googleフォームを使ってみた感想

 

有名なフォーム作成サービスといえばGoogleフォームなので、Googleフォームを使ってみました。Googleフォームを使ったのは仕事で活用出来ないか?と思ったのがきっかけですがWordpressにも埋め込めるというのは知っていたので、とりあえず使ってみたところ非常にシンプルで短時間で覚えることが出来ましたし、文字を判断し適切なスタイルを選んでくれるので優秀だと思いました。ただやはりシンプルすぎますし、出来ることを増やすにはアドオンの追加やプログラムの知識が必要になりますが、複数のフォームを無料で作成出来るのは魅力ですし、Googleサービスとの強力な連携にも魅力を感じますのでGoogleフォームも使っていきたいと思います。

今回紹介するFormrunとGoogleフォームとの比較が下記になります。

Googleフォームとの比較
Formrun公式より出典

 

Formrun公式でGoogleフォームとの比較した記事がありましたので一部抜粋しました。Googleフォームはアドオンを追加で機能向上出来ますが、Formrunはデフォルトの機能でも高機能なところがいいですね!GoogleフォームはGoogle関連との連携が容易なのでコードが書ける人ならばGoogleフォームの方が無制限にフォームが使えるのがいいですが、時間がかかるので時短したい方はFormrunがベストでしょう。

 

ブログ専用のお問い合わせ用にGoogleアカウントを追加し、Gメールを取得する

 

ブログ(THE THOR)専用のお問い合わせ用のフォームを作成するために専用のGoogleアカウント及びGメールを取得したかったので作成しました。Googleアカウントの作成は簡単にできますが、既存のメールを使いたい方は特にGoogleアカウントを新規で取得する必要はありません!管理人の場合、Googleフォームをブログや仕事に使う可能性があるのと、GメールをFormrunのメールアドレスとして使いたいので取得しました。

Formrunのユーザー登録をする

Formrunロゴ
PR TIMSより出典

 

Formrunを無料でスタートなどのボタンを押してログイン画面を表示させます。Formrunを使うには無料のユーザー登録が必要なので登録しておきましょう!途中の工程などがない場合もあるかも知れませんがご了承下さい。

ログイン

 

ユーザー登録
Formrunユーザー登録

 

右下の「ユーザー登録」をクリックします。

すでにユーザー登録済みの方はログインしましょう!

ユーザー登録

 

Googleアカウントで登録

 

ユーザー登録は上の方で紹介しているGoogleアカウントを使い登録しましたので「Googleアカウントで登録」を選びました。連携機能があるのでGoogleアカウントを使うのが妥当だと思います!

 

Googleにログイン

アカウントを入力

Googleにログインする必要があるのでまずはメールアドレスか電話番号を入力して「次へ」を押します。

メールアドレスの場合は続いてパスワードの入力も必要になるので入力して下さい。

 

Formrun(フォームラン)の機能と初期設定など

 

Forrmrun

 

Formrunの初期画面では色々と説明が出ますので、適度にみながらスキップしましょう。

Formrunの料金プランを確認

formrun料金プラン
Formrun公式より出典

Formrunの料金プランですが無料ではフォーム作成数が1と少ないですが、以前は3個まで使えたようなので残念ではありますが無料で使えるだけありがたいと思いましょう!

有料プランは「BEGINNER」「STARTER」「PROFESSIONAL」とありますが、無料プランだと使える機能に制限がありますので、無料で使ってみて複数のフォームを作成したくなったら有料プランに切り替えましょう。

 

プラン変更
Formrun公式より出典

テーム→プラン変更からプラン変更出来ます!

 

サイトのお問い合わせ作成に最適

 

サイトのお問い合わせ
Formrun公式より出典

 

無料プランでは一つのフォームしか作成出来ませんので、その場合はお問い合わせに使った方が良い個人的には思います。

 

当サイトのお問い合わせ

 

当サイトに設置したお問い合わせを先に見せますが、THE THORの簡易お問い合わせと比べてもゴージャスになりました!変更する可能性もありますので実際のお問い合わせページをご確認下さい。サイドバーが表示されているので表示しないようにした方がいいかも知れませんね!

 

新規チーム名の登録

 

新規チーム作成

 

まずはチーム名を作成する必要があるので適当な名前をつけましょう!後からの変更も出来るので安心です。

 

新規フォームの作成

 

どっち?

 

新規フォーム作成にはテンプレートから作成する方法とコード型で作成する方法がありますが、管理人は簡単な「テンプレートから作成する」を選びました!ほとんどの方がこちらを選ぶと思いますし、コード型で作成する知識があるなら自作フォームの方がいいかも知れないので導入した意味はないでしょう!

しかし、どんなUIか見てみたい気もするのでHTML・CSSの知識を得たら時間が経ってから試してみるのも良さそうです。

テンプレートを選択する

 

テンプレート
フォームの種類

 

テンプレート選択でいろいろな種類の中から選べるようになっていますが今回は「お問い合わせ窓口」を選びました。他にもいろいろな種類のテンプレートが選べるので仕事でも使えそうです。

 

Formrunの使い方(チーム選択前)

 

メニュー

 

右上のアカウントを押すとアカウント設定、チーム一覧、ホームページが選択出来ます。

 

Formrunの使い方(チーム選択後)

 

編集したい

 

チーム選択後は左上のロゴを押すことでチーム一覧、フォーム一覧、新規チーム作成、チーム設定、プラン設定が出来ます。

 

フォーム編集画面にいくには?

 

フォーム編集画面

 

上記のアイコンを押してフォーム編集画面に行きます。

 

設定できること

 

設定
設定
スタイル
スタイル
カバー
カバー
項目
項目

 

 

設定下
設定の下部
設定の下部にある項目ではSNSシェアボタンの設置、OGP設定、プライバシーポリシーページヘのリンク設置などが出来るようになっています。クレジット表記は有料版でないと消せないですが個人的には気にしません

 

設定や設置出来る項目がGoogleフォームより多いのが魅力です。セキュリティー対策も多く連携出来るサービスも多いですが、無料プランでは連携出来ることが少ないのが残念ですが仕方ないですね!

 

カバー
カバーの数も多いですが自分の好きな画像も使えるので、最初はデフォルトから選んでおいて専用のカバーが作成できたら貼り替えましょう!

 

外部連携設定

 

連携機能

 

外部連携設定ではGoogleスプレッドシート連携やMailchimp連携からShopifyなど出来ますが、ほとんどが有料のプランでないと使えないのが残念ですが、個人ブログやサイトならそこまでの連携もいらないので特に気にしなくてもいいでしょう!

フォーム編集

 

編集画面

 

ドラッグ&ドロップ

 

フォーム編集画面では項目を選んで右側の編集画面にドラッグ&ドロップで追加して編集する作業になリます。

 

編集出来る

 

編集したい箇所をクリックして位置変更や項目の削除や文字入力などの編集作業がそれぞれできます。出来ることが多いですが、必要な機能は限られているので、自身に必要なことだけまずは設定してから後で再編集するのがいいと思います。

 

スパム対策にReCAPTCHAを設置する

 

 

スパム対策

 

何といってもスパム対策でReCAPTCHAが使えるのは凄いです。たった私はロボットではありませんにチェックを付けるだけの機能ですが前後の行動などを判断してくれるのでスパム対策効果は高いです。

スパム対策フィルタ

こちらも有効

 

スパム対策フィルタの設定で「半角英数字のみの場合、受け付けない」にチェックを入れておくと外国からのスパムメール対策になります。これの効果なのか外国からのスパムメールは0になりましたので効果は凄いです!

 

THE THORにFormrunのフォームを設置する

 

THE THOR簡易お問い合せ

 

THE THORの簡易お問い合わせはテンプレートを「お問い合わせTPL」を選択して更新するだけで簡単に簡易お問い合わせページでが出来ますが、簡易すぎですし、スパム対策も何もありませんのでせめてreCAPTCHAがついていれば良かったのかも知れません!

 

デフォルトに変更

 

Formrunのお問い合わせを設置するために「お問い合わせTPL」から「デフォルトテンプレート」に変更して更新します。

iframe埋め込みフォーム

埋め込み

 

①まずはスクリプト設置のコードをご自身のHPのお問い合わせページに貼り付けます。

②フォームの埋め込み先URL(フォーム設置URL)ご自身のサイトのお問い合わせページのURLを記入

③更新するボタンを押す

これで後はご自身のサイトのプレビューページを確認してちゃんと表示されていれば問題ないです。わからない場合は赤枠をクリックして確認して下さい。

 

バーコードダウンロード他

 

宣伝

 

作成したフォームが保存されると上記の画面が表示されますのでバーコードをダウンロードしておきましょう。他にも共有リンクコピーやSNSでの共有なども出来ます。

 

完了画面と非公開画面の確認

完了画面
完了画面確認

 

入力画面の他にも完了画面と非公開画面確認ができますので一応確認しておきましょう。

 

非公開画面

クラウド管理ツールTayoriも捨てがたい

 

Tayori
Tayori公式より出典

 

PR TIMSが運営するサービスの一つのTayoriも個人的には捨てがたいと思います。こちらのサービスはかなり以前から知っていましたが使わずにいたのでもったいなかったと思いました。Formrunが無料で一つしかフォームが使えないのでTayoriも無料で一つ使ってみて違いを比較した上でいずれか有料サービスを使いたいところです。

 

Formrunを無料で使ってみた感想(まとめ)

 

まだお問い合わせフォームを設置下ばかりですが、外国と日本からのスパムメールは0になりましたのでスパム対策は効果テキメンでした。まだまだ見た目や設定などを試行錯誤しながら工夫して行こうと思いますのでたまに覗いてみて下さい(笑)

THE THORの簡易お問い合わせを使ってきましたが外国や日本からのスパムメールが多くて既読や削除などの対応がめんどくさかったのが楽になりました。個人情報の流出を防ぐためにもセキュリティがしっかりしたサービスを選ぶことが大事なのでFormrunに出会えてよかったと思います。

無料で一つしか使えないのが残念なのでTayoriとGoogleフォームを使って比較しながら使っていこうと思います。

プラグインを使わずにお問い合わせページが作成できてreCAPTCHAも設置出来るので個人的には満足できるサービスだと思います。

 

ホームラン?フォームランです
最新情報をチェックしよう!