WORDPRESS | Contact Form 7でEFO

      2017/10/07

みなさんこんにちはALEXです。

ウェブマーケティングにとってお問い合わせページの送信数の向上は再重要課題です。とランディングページからいかにお問い合わせページに誘導するか、お問い合わせページでいかに離脱率を押さえ「お問い合わせ」送信をしていただくかがウェブサイトのもっとも重要な動線です。現在はEFO(Entory Form Optimization)という用語も使われて各社有料のフォームページを提供しています。

当社も実際にEFOがコンバージョン率に直結する重要な指標であり、当社のクライアント様にもこの部分はもっとも投資費用対効果が高い部分であることをご説明して改善をご提案しています。

ですが、ここで問題があります。

 

有料EFOサービスの問題点

「どこのEFOサービスも結構お高い」

「どこのEFOサービスも似たり寄ったり」

それにさらに悩ましい問題があります。当社が推進しているのはウェブサイトのDIY化です。そのためにはウェブサイトはWORDPRESSでの制作をご提案しています。構築当初は社内にインハウス制作に対応できるエンジニアがいなくても、導入部分を外注で対応し実務を通してスキルアップいただき、自社で制作できるように支援させていただいております。ですので、お問い合わせページは基本的にContact Form7を推奨しています。

今回、とある案件でContactform7を使用したお問い合わせページをリニューアルしてEFOを改善することになりました。某EFOベンダーから売り込みを受けていたこともあり、このEFOフォームを導入することとして準備をしていたのですが、なんと。

Contact form 7と連携した実績がない?

Contact form 7と連携したことはないので、タグを送るからそっちで組み込んでくれ、というなんとも信じがたい連絡がありました。

というのも、現在のEFOベンダーはJQueryを使用しているために、JapascirptをHTMLに埋め込んで使っています。なので、contact form 7 ,Wordpressと連携してこなかったのだと推察できます。

えー?困るよそれじゃリアルタイムバリデーションできないし、フォームは基本Contactform7で構築しているし今更ゼロから始められないという深刻な問題にぶつかってしまいました。

 

自分で作るしかない

こうなったら、Contactform7を使ったフォームをカスタマイズしてDIYでEFOを改良するしかない!と思い立ちました。

デフォルトでは味もそっけもないフォームです。とてもではありませんが、有料サービスに仕えた代物ではありません。ですが、プログラムなのでCSSとJsを改良すれば、しっかりしたフォームになりEFOを向上させることが出来るはずです。

今後、改良の経緯を本ブログに連載形式でアップしてまいります。今回はまず決意表明といったところです。

有難うございました。

 

連載目次

Contact Form 7でEFO

Contact Form7 メールアドレスの再入力チェック

Contact Form7 のレイアウトを改良する

Contact Form7 Googleアナリティクスの目標に設定する

Contact Form7 の確認画面を追加する

Contact Form 7 でメール送信ができない(1)

Contact Form7 バリデーションを導入する

Contact form 7にマイクロコピー挿入

Contact Form 7 郵便番号から住所を自動入力する

 - ワードプレス