WordPress プログラミング

【WordPress】ContactForm7のサンクスページ表示されない時の解決策は6つです

2021年1月23日

こんにちはナンブです。
今回はWordPressでcontactform7 をつかってサンクスページ表示されないときの対処法について解説していきます。

ネコポリ
「サンクスページの表示方法がわからないにゃ～サンクスページが表示されない場合どうしたらいいにゃ」

 

こういった疑問に答えます。

 

contactform7をいれてお問い合わせページをしていたときにブチ当たった問題ですね。

 

以前までは【お問い合わせ】→【その他の設定欄】に以下のようにコードを打ち込めばよかった。

 

on_sent_ok: "window.location.href = 'https://○○○○.com/thanks/';"

 

しかし、2021年現在この方法でサンクスページ表示をすることはできません。
入力してもエラー表示がでただけでしょう。

この方法以外の解決策を紹介していきます。

 

サンクスページが表示されないときの対処法

 

以下の6つの手法のうち、どれかを使えばうまく表示することができます。
さっそくですが、てっとり早く連続で紹介します。

 

1 お問い合わせフォームの下に以下のcodeを最下部入力

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://○○.com/';/* 遷移先のURL */
}, false );
</script>

自分のブログのメイン画面を開き、お問い合わせ項目をクリックし、

編集画面へフォームをクリックして、末尾に上記のcodeを入力します

 

2 お使いのテーマのfunction.phpの末尾へ以下のcodeを入力

 

【外観】→【テーマエディター】→【function.php】へ

パターン1

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://○○.com/';/* 遷移先のURL */
}, false );
</script>

 

パターン2（パターン1のcodeがダメならこれ）

add_action( 'wp_footer', 'add_thanks_page' );
function add_thanks_page() {
echo <<< EOD
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://○○.com/thanks/'; /* 遷移先のURL */
}, false );
</script>
EOD;}

 

パターン3（パターン2のcodeがダメならこれ）

// contactformサンクスページリダイレクト
add_action( 'wp_footer', 'add_thanks_page' );
function add_thanks_page() {
if( get_the_ID() == 'ページID記述' ) { /* ページID */
echo <<< EOD
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://OO.com/thanks/'; /* 遷移先のURL */
}, false );
</script>
EOD;
}
}

※ページIDとは・・・お問い合わせフォームなどを使用している固定ページのID

 

パターン4（パターン3のcodeがダメならこれ）

add_action( 'wp_footer', 'kaiza_wp_footer' );
function kaiza_wp_footer() {
global $post;
if( is_page('contact') || is_page('entry') ){ //他のページで出したくないので、ページ特定
$url = get_permalink($post-&gt;ID);
?&gt;
<script type="text/javascript">
document.addEventListener( 'wpcf7mailsent', function( event ) {
location.replace("<?php echo $url; ?>thanks/");
}, false );
}
}

 

3 header.phpのの前とfooter.php内のの前に以下のcode入力


<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://○○.com/thanks/';
}, false );
</script>

以上が解決方法となります。

表示された場合、コンタクトフォームの編集画面のメッセージ項目内の

一番上の【メッセージが正常に送信された】という欄に送信中…と入力してください

 

サンクスページに飛ぶまえに一瞬
「メッセージが正常に更新された」というメッセージが表示され、少し違和感があります。
なので上記のように変更しときましょ

 

サンクスページが表示されない場合

エラ-
ダメな場合
header.phpまたはindex.phpのの前にphp wp_head()；

そして、footer.phpまたはindex.phpのの前php wp_footer();が記述されているかをたしかめましょう。

記述されてないと表示されないので。
コンタクトフォームが#wpcf7-f123-o1というナゾのURLにリダイレクトされた場合

footer.phpに
<script type="text/javascript">wpcf7.cached = 0; </script>

というcodeをいれてみてください。

それでもダメな場合はあきらめましょう。

 

ボクもWordPressの勉強の合間、丸一日かけて何度もしらべたのですが、

結果、この上記似たような解決手段がかかれた記事ばかりでした

ぶっちゃけ時間のムダでした。

 

紹介した解決法でも表示されない原因として、
お使いになっているブログテーマの仕様でページの表示をはやくするために

 

contaxtForm7のプラグインでは、サンクスページが表示されない設定にされている可能性があります。

 

ほかのwordpressテーマをつかってサイト制作をしているときは
contactform7でのサンクスページの表示はされたので
おそらくtheme仕様によるものかあるいは別の理由で表示することができないのでしょう。

 

 

サンクスページをどうしても作りたい人

サンクスページ2

 

それでも、どうしてもサンクスページを表示させたい！という方もおられるでしょう
なので、「あきらめる！」以外の選択肢も紹介します。

 

結論→ MW WP Formを使おう

 

こちらのMW WP Formをつかえばcontact form7よりカンタンにサンクスページをつくることができちゃいます。

 

クラウドワークス1位のwebデザイナーじょうまさふみさんのWordpres講座でもご紹介されているプラグインでもあり、

自分も利用させてもらったプラグインの一つなのでオススメです

 

とりあえず、さきほど紹介した解決手段でもサンクスページが表示されない場合は

 

このプラグインをつかっとけば解決します。
MW WP Formプラグインの設置方法についての記事のリンク一応はっときます↓

 

MW WP Formプラグインの設置方法

 

まあ、こんな感じで今回は以上となります。
参考になれば幸いです。

-WordPress, プログラミング
-