Contact Form 7でおススメの設定やカスタマイズ
WordPressでお問い合わせのプラグインと言えばContact Form 7というくらい定番です。
プラグインをインストールして、お問い合わせフォームを表示したい部分にコードを貼り付けるだけで導入できます。
「フォームでメールが送れる」というだけで良い人にはそれで良いのですが、追加しておくと便利なものをまとめました。
メールをデータベースに保存
メールがフィルターをかけられて見えづらいところに振り分けられたりすると、せっかくのお問い合わせに気がつけないというようなこともあります。
何らかの理由でメールが届かなかった場合にもメール以外で保存されていれば安心です。
Flamingo
ダッシュボードからプラグインを選択
新規追加を選択
キーワード「Flamingo」で検索
有効化
で利用できます。
確認はダッシュボードの左メニューに追加された「Flamingo」から。
CSV出力機能もあります
アドレス帳、受信メッセージともにCSV出力機能があります。
サンクスページを表示
Contact Form 7を使う上での悩みどころは「送信完了が分かりにくい」というところです。
そんな悩みを解消すべく、フォームの送信完了画面を設定します。
サンクスページの準備
まずは送信が完了した際に表示させる固定ページを準備します。
例）example.com/thanks/
ページごとに任意のスクリプトやCSSを記述できる場合はこれでOK。
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://example.com/thanks/'; //サンクスページURL
}, false );
</script>
functions.phpに追記する場合
<?php
add_action( 'wp_footer', 'add_thanks' );
function add_thanks() {
?>
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://example.com/thanks/'; //サンクスページURL
}, false );
</script>
<?php
}
?>
フォームを複数設置していて、それぞれサンクスページを表示したい場合
ページIDで指定して条件分岐します。
例）
ページID=123のフォームは送信後、example.com/thanks/、それ以外のページのフォームはexample.com/thanks2/
<?php
add_action( 'wp_footer', 'add_thanks' );
function add_thanks() {
if( get_the_ID() == '123' ) {//フォームの設置ページID
?>
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://example.com/thanks/'; //サンクスページURL
}, false );
</script>
<?php
}else{
?>
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://example.com/thanks2/'; //サンクスページ2URL
}, false );
</script>
<?php
}
}
?>
自動返信メールの送信設定
管理画面から左のメニュー「お問い合わせ」をクリックし、コンタクトフォームの一覧から自動返信を設定したいものを選びます。
上段のタブにある「メール」を選択します。
「メール（２）を使用」の先頭の四角をクリックしてチェックを入れると、
自動返信用のフォームが表示されます。
送信先
自動返信を送る宛先メールアドレスを指定します。
元々入っている[your-email]でOK。
送信元
自動でブログ名とともにメールアドレスが入力されていますが、送信元としたいメールアドレスを指定します。
題名
自動返信メールの題名を入力します。
追加ヘッダー
自動返信メールに対して返信した場合の送り先メールアドレスを指定できます。
普通に設定した送信元へ返信されるようにしたい、という場合には、Reply-To: …. は削除してOK。
メッセージ本文
自動返信メールで送りたいメッセージを入力します。
[your-name]、[your-email]、[your-message]は、自動返信メールを送信時、メールフォームに入力された名前、メールアドレス、メール本文に置き換えられて送信されます。
gtagトラッキングコード用のスクリプト
お問い合わせ数をGoogle Analyticsで確認したいときに使用します。
※使用しているトラッキングコードにより異なります。
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
gtag('event', 'submit', {
'event_category': '問い合わせ',
'event_label': '回数'
});
}, false );
</script>
reCAPTHAをContact Form7のページだけに読み込む
//Contact Form 7で作られたフォームのページじゃなければreCAPTCHAを読み込みをキャンセル
//(デフォルトでContact Form 7にキー登録すると全ページreCAPTCHAが読み込まれてしまう)
add_action( 'wp_enqueue_scripts', function (){
global $post;
$valid_recaptcha = false;
$content = get_post()->post_content;
if($content != null){
//Contact Form 7のショートコードが存在する
if(has_shortcode($content, 'contact-form-7')) {
$valid_recaptcha = true;
}
}
//ショートコードが存在しなければreCAPTCHAの読み込みをキャンセルする
if($valid_recaptcha == false){
wp_deregister_script( 'google-recaptcha' );
}
}, 100);
