リダイレクト処理ができない・・・
contact form 7はくそほど有名で、ベッタベタなプラグインですね。
しかしながら、デフォルトではサンキュー画面とかに遷移しないんですよ〜。
そこで今回は、デザインカスタムしたフォームの裏側の処理を、
contact form7で作るというなんともニッチな案件・・・
最初から、全部うまくいくとは思っていなかったが、最後のリダイレクト処理で徹底的に詰まった!
チキショウ!!!
ちなみにリダイレクトの処理のコードはこちら。(これは動いたよ)
<script>
document.addEventListener('wpcf7mailsent', function(event) {
location = '/redirect-saki-no-url';
}, false);
</script>
当然のごとくコードの後半・・要素の読み込んだあと・・(/body前が無難)に記述・・・。
普通なら動くんですが・・・。なんでじゃ!!!!!
name値やvalue値は全部合わせてるので、理屈的には問題ないと思っていたのに・・。
以下、解決までに試したことを記述するぜ!
<?php wp_head(); ?>と、<?php wp_footer(); ?>を記述
はい。検索すると、よくよく出てくるのが、こちら。
自作のテンプレートを作るときに注意なのが、この2つ。
<?php wp_head(); ?>
<?php wp_footer(); ?>
headerと、footerに記述します。
自作でWordpressのテンプレートごと作るとき、
キモいコードや記述は徹底的に省きたいと思っているので、
筆者は、あんまり考えずに、マッハ5でこの2つを削除しました。(sudo -D kill me eternity.)
キモいとかって判断基準が、ほんとディベロッパーとしてどうなんでしょうね。
会社に謝らないとね。
上記2つは超絶短いコードなんですけど、取得してくる情報は大切なものも多い・・・
これがないと、contact form 7は動かないっす。
しかし今回はこれで、解決せず!!!!! 草ぁああ
Contact form7の”js”が読み込めてない?
contact form7はjsを読み込んで、ajaxで動いている感じみたいです。
なんで、外部からのscriptを読まねばいけないんですが、
どうやらjsがなくても中途半端に動くらしい・・・笑 ほんまなんそれ。
メールは送れるが、送信ステータスのメッセージとか、スピナーが表示されなかった。
なんというか、70点?
おそらく、<?php wp_footer(); ?>の記述で呼び出されているっぽいが、
これでも症状が改善せず・・。
原因はこれ!!!!
案件が露出するのは良くないので、フォームの中身は割愛してますよ!もちろん!
なんと、htmlの構造問題!!! 知るか!!ボケぇ!
<div role="form" class="wpcf7 container" id="wpcf7-f<?php echo esc_html($CONTACTFORM7_ID); ?>-o1" lang="ja" dir="ltr">
<!-- <div class="container form-area"> こいつや!!!-->
<div class="screen-reader-response">
<p role="status" aria-live="polite" aria-atomic="true"></p>
<ul></ul>
</div>
<form action="/#wpcf7-f<?php echo esc_html($CONTACTFORM7_ID); ?>-o1" id="form_box" method="post" class="wpcf7-form init" novalidate="novalidate" data-status="init">
<div style="display:none;">
<input type="hidden" name="_wpcf7" value="<?php echo esc_html($CONTACTFORM7_ID); ?>" />
<input type="hidden" name="_wpcf7_version" value="5.6.3" />
<input type="hidden" name="_wpcf7_locale" value="ja" />
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f<?php echo esc_html($CONTACTFORM7_ID); ?>-o1" />
<input type="hidden" name="_wpcf7_container_post" value="0" />
<input type="hidden" name="_wpcf7_posted_data_hash" value="" />
</div>
<div class="wpcf7-response-output" aria-hidden="true"></div>
<input type="submit" value="〜〜〜〜〜" class="nxbtn wpcf7-form-control has-spinner wpcf7-submit" style="display:block;" />
</form>
<!-- </div> このデェエエェェエィブが邪魔やったんや!!!!!-->
</div>
デフォルトソースをカスタムして、階層が変わったことが問題だったようです・・・。
フタを開けたら、IQ2ぐらいの超絶初歩的なミス・・・・。僕はチンパンやな。
失った時間は戻らないので、八つ当たりで記事を書きました。。。
まじで、自分が全知全能ならプラグインとか1個も使わないで、
使用していないコードなんてないような、クリーンなサイトを作りたいもんですね。
ほな。