TOP

ブログ一覧

MW WP Formで年数のセレクトボックスをカスタマイズした例

MW WP Formで年数のセレクトボックスをカスタマイズした例

WordPressのコンタクトフォームプラグイン「MW WP Form」で年数のセレクトボックスの選択肢に現在の年数まで入れるようにカスタマイズしたので、やったことをメモとして残しておこうと思います。

きっかけ

お問い合わせフォームなどでたまに見かける年数のセレクトボックス。生年月日がいい例でしょうか。
年数のセレクトボックスって数が多いし、要件によっては毎年増やさないといけなかったりするので、大変だなと常々思っていました。

この間、案件でたまたま実装する機会があったので、フィルターフックって実はやったことなくて試してみたかったし、ちょうどいいからやってしまおうとなったわけです。

やったこと

やったこととしてはMW WP Formのフックを使って、セレクトボックスの選択肢に年数をループで設定するだけです。

まず、管理画面でフォームを作成します。

[mwform_select name="year"]年

フォームを作成したら、functions.phpで選択肢を設定します。
MW WP Formには「 mwform_choices_mw-wp-form-xxx 」というフィルターフックが用意されていて、これで選択肢を設定できます。

function add_years($years,$atts) {
  if ( $atts['name'] == 'year' ) { // 選択肢を入れるname属性
    $start_year = 1900;
    $end_year = date("Y");
    foreach (range($start_year, $end_year) as $year) {
      $years[$year] = $year;
    }
  }
  return $years;
}
// xxxにはフォームのIDが入ります。
add_filter( 'mwform_choices_mw-wp-form-xxx', 'add_years', 10, 2 );

最初の年数から現在の年数までを$yearsという配列に格納して、一覧にしています。
これでセレクトボックスの中に1900年から2018年までが格納されているはずです。

追加でやったこと

さらに内容によっては真ん中あたりの値から始めたい場合もあるかと思いますので、初期値も設定します。
初期値を設定するのは「mwform_value_mw-wp-form-xxx」 というフィルターフック を使います。

function my_mwform_value( $value, $name ) {
  if ( $name === 'year' ) { // 設定したいname属性
    $value = 1988; //初期値に設定したい年数を入れる。
    return $value;
  }
  return $value;
}
// xxxにはフォームのIDが入ります。
add_filter( 'mwform_value_mw-wp-form-xxx', 'my_mwform_value', 10, 2 );

これで初期値が指定した年数になっているはずです。

デモページはこちら

まとめ

フィルターフックの解説はプラグイン制作者さんの公式サイトに詳しく書かれていたので、対応としてはそれほど難しくなかったのですが、phpに不慣れなこともあり、思うように値をとれるようになるまでが大変でした。

調べている中でいろいろなフィルターフックの活用方法が出てきたので、他の案件でお問い合わせフォームの仕様を詰めるときに参考にできるかなと思いました。
また、プライベートでもいろいろ試してみようと思います。

参考:
https://2inc.org/blog/2013/10/13/3743/
https://2inc.org/blog/2013/11/07/3832/