Contact Form 7で作成したフォームで、送信完了画面に遷移させつつ、送信内容の一部を完了画面に表示させたいという要望がありました。
意外と今後も実装することが出てくるかもしれないと思ったので、実装内容を備忘録として残しておきたいと思います。
Contact Form 7で送信完了画面へのリダイレクト時に送信内容を取得する方法
送信完了画面へリダイレクトさせる方法は「Contact Form 7でメール送信後に任意のページにリダイレクトさせる方法」で書きましたが、リダイレクト時にパラメータを付与することで送信内容を取得できます。
今回実装したケースでは、フォームへ遷移する直前のページのタイトルと投稿IDを取得したかったので、フォーム側では以下のようにtype=”hidden”で追加しました。
直前のページの情報をフォームに渡す方法についての詳細は、「Contact Form 7に一つ前のページの情報を渡してフォームに自動入力させる方法」をご参照ください。
[hidden post-title default:get]
[hidden post-id default:get]あとは適用しているテーマのfunctions.phpに以下を追加してあげると、送信完了画面でパラメータの値として送信内容が追加されます。’123’のところはフォームの投稿IDを入れてください。
function wpcf7_redirect_complete() {
?>
<script>
document.addEventListener('wpcf7mailsent', function(event) {
if ('123' == event.detail.contactFormId) {
var inputs = event.detail.inputs;
var params = new URLSearchParams();
for (var i = 0; i < inputs.length; i++) {
params.append(inputs[i].name, inputs[i].value);
}
location.replace('<?php echo esc_url(home_url()) . '/contact/thanks/?'; ?>' + params.toString());
}
}, false);
</script>
<?php
}
add_action('wp_footer', 'wpcf7_redirect_complete');上記のままでも良いですが、そのままだと「?post-title=タイトル&post-id=1234&your-name=田中太郎&your-email=hoge@example.com」のようにすべての送信内容がパラメータに入ってしまいます。
欲しい情報はタイトルと投稿IDのみなので、以下のようにタイトルと投稿IDのみをパラメータに追加するようにしました。
function wpcf7_redirect_complete() {
?>
<script>
document.addEventListener('wpcf7mailsent', function(event) {
if ('123' == event.detail.contactFormId) {
var inputs = event.detail.inputs;
var params = new URLSearchParams();
for (var i = 0; i < inputs.length; i++) {
if ('post-title' === inputs[i].name || 'post-id' === inputs[i].name) {
params.append(inputs[i].name, inputs[i].value);
}
}
location.replace('<?php echo esc_url(home_url()) . '/contact/thanks/?'; ?>' + params.toString());
}
}, false);
</script>
<?php
}
add_action('wp_footer', 'wpcf7_redirect_complete');あとは、完了画面で「$_GET[‘post-title’]」や「$_GET[‘post-id’]」で値を取得して出力する感じです。
<?php
if (isset($_GET['post-title'])) {
$post_title = $_GET['post-title'];
echo esc_html($post_title);
}
if (isset($_GET['post-id'])) {
$post_id = $_GET['post-id'];
echo esc_html($post_id);
}
?>あとがき
GETパラメータで送信内容を追加することで、色々なことができますね。
送信内容を元に完了画面で何らかの処理を実装したい時は、参考にしていただければ幸いです。