2
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Contact Form 7で動的に選択肢を生成する方法 

Last updated at Posted at 2022-07-06

Contact Form 7で動的に選択肢を生成する方法 

カスタム投稿などをもとに、Contact Form7でチェックボックス、ラジオボタン、プルダウンなどを動的に生成したい時がある。

例えば製品についてのお問い合わせフォームなど。

カスタム投稿として登録されている製品の名前を吸い出して、
動的にチェックボックスを作りたいといったシチュエーションだ。

そんな希望を叶える実装方法を紹介する。

手順は至ってシンプル。

  1. カスタム投稿の情報を吸い出してHTMLを生成する関数を作成する。
    関数の中身は以下のような内容。
    1-1. WP_Queryで投稿情報を取得しまわす。
    1-2. ob_startでバッファリングを有効にし、その中でHTMLを書く。
    タイトルやカスタムフィールドの値など自由に取得可能。
    1-3. 最後にバッファを返す
  2. 1で作成したコードをContact Form7のショートコードに登録。
  3. 2で作成したショートコードをContact Form7の編集画面に張り付ける。

コードは以下のようになる。

functions.php
<?php
function add_original_choices()
{

  ob_start();

  $args = array(
    'post_type' => 'works', //worksというカスタム投稿をもとに動的にinputを生成
    'order' => 'ASC'
  );

  $the_query = new WP_Query($args);
  $i = 0;
  if ($the_query->have_posts()) : while ($the_query->have_posts()) : $the_query->the_post();
?>
      <label for="<?php echo $i; ?>"><?php the_title(); ?></label> <!-- $postのIDをもとに本文やカスタムフィールドの値など自由に取得可能 -->
       <input type="checkbox" id="<?php echo $i; ?>" value="<?php the_title(); ?>">
<?php
      $i++;
    endwhile;
  endif;
  return ob_get_clean();
}
wpcf7_add_form_tag('add_original_tag', 'add_original_choices');
// この場合「add_original_tag」がショートコード名

add_original_choicesという関数でカスタム投稿の情報を吸い出し、HTMLを生成しreturnする。
wpcf7_add_form_tagはContact Form7に独自のショートコードを追加する関数なので、
それを利用してadd_original_choices関数をadd_original_tagというショートコードにする。

上記で作成したadd_original_tagショートコードをContact Form7の編集画面に張り付ければ完成だ。

2
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?