【Contact Form 7】投稿タイトルを自動でフィールドに設定する方法
こんにちは、岐阜・名古屋を拠点に全国各地からご依頼いただくWEBサイトを制作しているフリーランスエンジニアの寺井です。
WordPressの投稿でセミナーページや求人ページを作成し、それぞれのページに「エントリーはこちら」というボタンを設置し、入力フォームに遷移した際、セミナー名や求人名が自動で入力フィールドに入力されていたら、申し込みをするユーザーの手間が省けたり誤った情報でのエントリーを未然に防ぐことが出来ます。
WordPressでお問い合わせフォームを作成する代表的なプラグインの「Contact Form 7」なら、この機能を簡単に実装することが出来ます。
そこで今回の記事では「Contact Form 7」を使い、投稿タイトルを入力フィールドに自動で設定する方法をご紹介します。
前提としてお問い合わせフォームのスラッグ名は「entry」、GET値パラメータはtitleとしています。
この部分はそれぞれの環境に合わせて変更が必要になります。
この記事の目次を表示
Contact Form 7の設定から実装する方法
まず最初に「Contact Form 7」の設定から自動で投稿タイトルを入力フィールドに設定するカスタマイズ方法をご紹介します。
こちらの方法であれば難しいプログラムを作成することなく実装することが出来るため、迷った場合はこちらの方法をお勧めします。
フォームページへのリンク設定
まずは各投稿ページから「Contact Form 7」で作成したお問い合わせフォームがあるページへのリンク設定をします。
<a href="<?php echo home_url('entry'); ?>?title=<?php echo get_the_title(); ?>" class="button">申し込む</a>
?title=<?php echo get_the_title(); ?>
この記述をすることでGET値としてパラメータを設定し、遷移先ページのURLに投稿タイトルを渡すことが出来ます。
Contact Form 7の設定
続いて、「Contact Form 7」のフォームタブを開き、以下のように入力します。
[text* title default:get]
このように入力することでURLにtitleのGET値パラメータが渡されている場合、自動でこのフィールドにそのGET値が設定されるようになります。
今回の記事では、この投稿タイトルの値になります。
その他設定
もしフィールドの書き換えを出来ないようにするためには以下のように指定します。
[text* title default:get readonly]
似た設定として以下のような指定がありますが、こちらを指定してしまうと書き換え出来ないだけでなく、値の送信も出来なくなってしまいますので注意が必要です。
[text* title default:get disabled]
functions.phpにコードを追加して実装する方法
続いて、functions.phpにコードを追加して実装するカスタマイズ方法をご紹介します。
フォームページへのリンク設定
functions.phpを使用して実装する場合も、まずは各投稿ページから「Contact Form 7」で作成したお問い合わせフォームがあるページへのリンク設定をします。
ここに関しては最初でご紹介した方法と同じ設定内容になります。
<a href="<?php echo home_url('entry'); ?>?title=<?php echo get_the_title(); ?>" class="button">申し込む</a>
Contact Form 7の設定
続いて、「Contact Form 7」のフォームタブを開き、以下のように入力します。
[text* title]
GET値の設定はfunctions.phpで行うため、ここの設定はシンプルになります。
functions.phpにコードを追加
最後にfunctios.phpに以下のようにコードを追加します。
function my_wpcf7_form_tag($tag) {
if (!is_array($tag) || !isset($_GET['title'])) {
return $tag;
}
if ($tag['name'] === 'title') {
$tag['values'] = array($_GET['title']);
}
return $tag;
}
add_filter('wpcf7_form_tag', 'my_wpcf7_form_tag', 10, 1);
「Contact Form 7」のフィルターフック「wpcf7_form_tag」を使用します。
このフィルターフックはタグの値を変更・操作する場合に使用します。
このフックに関数を引っかけることでtitleのGET値パラメータが渡されている場合、[text* title]のフィールドにそのGET値が設定されます。
今回の記事では、この投稿タイトルの値になります。
その他設定
以下設定は最初でご紹介した方法と同じになります。
もし書き換え出来ないようにするためには以下のように指定します。
[text* title default:get readonly]
誤って以下のように設定してしまうと、書き換え出来ないだけでなく、値の送信も出来なくなってしまいます。
[text* title default:get disabled]
まとめ
今回の記事では「Contact Form 7」で投稿タイトルを自動で設定するカスタマイズ方法をご紹介しました。
フォームに自動で値を設定させたいという要望はWEB制作をしていると、よく挙げられます。
「Contact Form 7」を使用することでこのような要望も比較的簡単に叶えることが出来ます。
他にも様々なカスタマイズが容易に出来るプラグインですので、上手く取り入れていきたいですね。
