WordPressでUX改善!フォームでCTAを非表示にする

Wordpressのテンプレートパーツと条件分岐を利用して、CTAの出し分けを行うUX改善方法を紹介します。

フォームでCTAを非表示にする理由

例えば登録やお問合せフォームの送信完了をコンバージョンに設定していて、全ページのフッターなどにCTA(Call To Action)を設置していて、お問い合わせフォームやフォームの確認・完了画面にまでCTAがあるようなサイトの場合、CTAを非表示にしておくことで、UXを改善させてユーザーの離脱を防ぐことが期待できます。

なぜかというと、ユーザーが自身でアクションを起こしているとき、しかもコンバージョンしようと思っているときに、追い打ちをかけるようにコンバージョンを促すメッセージを見ると不快感を与え、離脱の原因となることがあるからです。
せっかくコンバージョンの一歩手前まできているのですから、非表示にしてユーザーの気が散らないようにしたほうが、ユーザーにとっては余計な情報もなく、使いやすくなることでしょう。

Wordpressでの実装方法

CTAのような使い回すパーツは、get_template_part() でテンプレートパーツを呼び出す形で実装すると管理しやすいと思います。
下記の場合、 themes/テーマファイル名/include/cta.php というファイルにCTAのソースを記述して、そのファイルを呼び出すようになっています。

最後に

管理方法は人それぞれではありますが、色々なソースコードをテンプレートパーツ化し、get_template_part() で呼び出すようにしておくと、運用面で管理がしやすいと思います。
ヘッダーのOGPや広告のトラッキングコードなど、ソースコードに追加する必要があるものが増えてきているので、できるだけソースを見やすく、追いやすくするのにも役立っているのでおすすめです。

SNSでシェアする:

大場 正樹 / Cleysense株式会社 代表

Web制作会社に約3年勤務した後にフリーランスとしてWeb制作やWebマーケティングなどの事業で約6年活動し、事業拡大に伴い2019年7月にクライアントのWebマーケティング活動もサポートするWeb制作会社としてCleysense株式会社を設立。