Contact Form 7 のテンプレートで使う内容をファイルから取得する

Contact Form 7 のテンプレート書くの面倒問題

WordPress でサイトを構築するとき、お問い合わせフォームとして Contact Form 7 を利用すると、バリデーションなんかもよしなにやってくれて便利。

ただ、フォームで使うテンプレートを WordPress 上で書いていちいち保存しないといけないのが結構辛い。

特に開発中はさくっと手元で書いてさくっとオートリロードで確認したいし、テンプレートの内容もバージョン管理したいですね。

ということで、ファイルに記述した内容を Contact Form 7 のテンプレートとして利用できるように実装してみました。

実装

WordPress 用のテンプレートファイルのフォームを表示したい部分に、以下のコードを埋め込みましょう。

<?php
add_action('wpcf7_contact_form', function ($form) {
  $path = '{ テンプレートを記述したファイルへのパス }';
  ob_start();
  include $path;
  $template = ob_get_clean();

  $p = $form->get_properties();
  $saved_template = $p['form'];
  if($saved_template === $template) return $form;

  $p['form'] = $template;
  $form->set_properties($p);
  $form->replace_all_form_tags();
  $form->save();
  return $form;
});
$useform = array_shift(get_posts(['post_type' => 'wpcf7_contact_form', 'posts_per_page' => 1, 'name' => strtolower(urlencode('{ 利用するフォームのスラッグ }'))]));
echo do_shortcode('[contact-form-7 id="' . $useform->ID . '" title="' . $useform->post_title . '"]');
?>

これでテンプレート用のファイルに記述した内容が Contact Form 7 のテンプレートとして利用されるはずです。やったね。

この方法だと Contact Form 7 の設定画面にもタグが認識されるので、メールの設定等も問題なくできます。

注意

今回の実装の場合、設定画面からテンプレートを編集しようとしてもファイルの内容で上書きされてしまうので、設定画面から編集したい場合は記述の調整が必要です。

また、この実装は WordPress のテンプレートに直接埋め込む場合の書き方です。WordPress 上のエディタから埋め込みたい場合はショートコード化するなどして調整してください。