とりあえずwordpressで問い合わせフォームを、、って時にはほぼこれを使いますね。
複雑なフォームだったり特殊だったりレイアウトや動きの指定が厳しかったりすると別のプラグインや自作になりますが、Contact Form 7はお手軽に問い合わせフォームを実装できるので重宝してます。
今回やりたいカスタムは下記の通り
- 記事ページからクエリ付きのURLで問い合わせページにリンク
- クエリに持たせた記事IDから任意のデータを取得
- フォームのinput valueに反映
です。
使用したバージョンは 4.3.1 です。
カスタマイズ後
先にカスタマイズ後のページをご覧ください。
こんな風にタイトル等をフィールドの値にセットさせます。
実装
Contact Form 7の設定
引っ張りたいデータ分フィールドを追加して作成しておきます。
<p>記事タイトル (必須)<br /> [[text* title]]</p> <p>記事URL (必須)<br /> [[text* url]]</p> <p>お名前 (必須)<br /> [[text* your-name]]</p> <p>メールアドレス (必須)<br /> [email* your-email]</p> <p>題名<br /> [[text your-subject]]</p> <p>メッセージ本文<br /> [textarea your-message]</p> <p>[submit "送信"]</p>
わかりやすいようにContact Form 7デフォルトのものに追加しています。
追加したものは記事タイトル・記事URLです。
[[text* title]],[[text* url]]の部分の名前(inputのname)は任意ですが後で使うのでわかりやすいのがいいかと。
functions.php
次にfunctions.phpにコードを追加していきます。
function wpcf7_get_post_data( $tag ){
if( !is_array( $tag ) ) return $tag;
//クエリに[post_id]がセットされているか
$post_id = ( isset( $_GET['post_id']) && $_GET['post_id'] ) ? $_GET['post_id'] : false;
//[post_id]がある場合
if( $post_id ) {
if( $tag['name'] == 'title' ) {
$title = get_the_title( $post_id );
$tag['values'] = array( $title );
} else if( $tag['name'] == 'url' ) {
$url = get_permalink( $post_id );
$tag['values'] = array( $url );
}
}
return $tag;
}
add_filter( 'wpcf7_form_tag', 'wpcf7_get_post_data' , 11 );
フック：wpcf7_form_tag
wpcf7_form_tagというフックはContact Form 7で内容が出力される前に通る処理で、データを任意の形に変更できます。
呼び出す場所はプラグインファイル「includes/shortcodes.php」に書かれてます。
処理内容
クエリに[post_id]がセットされているか
今回はURLクエリに「post_id」を付与して記事IDを取得するようにします。
ですので、それがあるかないかの判断をしています。
[post_id]がある場合
[post_id]がある場合、記事IDからタイトル・URLを呼び出し、Contact Form 7のデータに追加していきます。
$tagにはContact Form 7で作成した全データが入っている状態で、フィールドの値は全部空です。
そこに取得した記事データを入れていきます。
- $tag[‘name’] == ‘title’
作成したinputのnameは$tag[‘name’]に入っていますので、入れたい箇所かどうか調べています。 - $title = get_the_title( $post_id );
記事IDからタイトルを取得します。 - $tag[‘values’] = array( $title );
inputのvalueは$tag[‘values’]に入りますのでここに入れていきます。必ず配列で。
URLの場合も同様です。
get_post_meta()でカスタムフィールドも取れますよね。
single.php
取得したい記事ページに下記コードを足します。
記事ページですのでsingle.phpになります。
<a href="<?php echo esc_url( home_url( '/contact/?post_id=' .$post->ID ) ); ?>">問い合わせ</a>
これでクエリにpost_idをもたせたURLにリンクさせます。
問い合わせボタンを出すか出さないか、カスタムフィールドで分岐させてもいいですね。
エディターに書く場合はポストIDも指定で。
<a href="http://securavita.net/contact/?post_id=1">問い合わせ</a>
完成
応用編
応用では2つのフォームを作成しておき、クエリがあるかないかで切り替えます。
問い合わせとアンケートの様な用途が全く違うものでは使い道が無いですが（ページを変えたほうが良い）普通の問い合わせフォームと記事データを読むフォームを作って切り替えるようにしておけば、任意の記事からリンクされた場合どこのページから問い合わせがあったかわかりやすくなるというものです。
使用はいたって簡単でクエリにpost_idがセットされてれば記事データを読むフォーム、セットされてなければ普通のフォームを出すというものです。
Contact Form 7の設定
Contact Form 7でフォームを2つ作成しておきます。
名前は「contactform」「contactform_post」としておきます。
問い合わせページのテンプレート.php
page.phpでもいいですが、念のためpage-contact.php(問い合わせページのスラッグがcontactの場合)で固定のテンプレートを作成しといたほうがいいかと。
フォームを出したい場所に
if( isset( $_GET['post_id'] ) && $_GET['post_id'] ) {
echo do_shortcode( '[[contact-form-7 id="{フォームのid}" title="contactform_post"]]' );
} else {
echo do_shortcode( '[[contact-form-7 id="{フォームのid}" title="contactform"]]' );
}
これで切り替わります。
do_shortcode()にはContact Form 7のショートコードを入れて下さい。