つながるnet

タクソノミ選択とカスタムフィールドのラジオボタンをシンクロさせる

サブタイトル1:カスタムフィールドの表示/非表示の制御
目的はこっちなのですが、この方法を説明しているわけではありません。

サブタイトル2:タクソノミ選択をラジオボタンに
これはおまけですが、そうしたいケースも多いかも。

WordPressの投稿時にタクソノミ(もしくはカテゴリ)の選択をカスタムフィールドの値とシンクロ(同期)させたいことってないですか?

次のようなケースです

例えば、「売買物件」と「賃貸物件」とがあって、その選択により項目を切り替えたい場合。

  • タクソノミによって表示されるカスタムフィールド項目を切り替えたい
  • カスタムフィールドの実装にWordPressプラグイン Advanced Custom Fields(ACF) を使用
  • ACFの「条件判定」の基準をタクソノミにしたい

カスタムフィールド表示/非表示を切り替える上での問題点

ACFの「条件判定」とは、他のカスタムフィールド項目の値の条件によって、特定のカスタムフィールドの表示表示/非表示を制御できる機能です。

つまり、ACFの「条件判定」は、タクソノミの選択による表示/非表示には対応していないのです。(あってます?)

それで、タクソノミと同じ項目をカスタムフィールドにも設ければOKですが、

同じ項目なのに両方を選択するのはスマートではない!

タクソノミで「売買物件」「賃貸物件」を選択して、カスタムフィールドでも同じ項目をまた選択しなければならないなんてスマートではありませんし、どちらかを選択し忘れてしまうこともあるかもしれません。それで

やっと本題なのですがこんなイメージです。
tax

タクソノミとカスタムフィールドの選択をシンクロさせる

ことができればちょっとスマートになりますね。

以下のコードの設定は
・カスタム投稿タイプのスラグ:estate
・タクソノミ名:tax_estate
・タクソノミ売買物件のID:6
・タクソノミ賃貸物件のID:7
・カスタムフィールド売買物件/賃貸物件のフィールド名:sellrent
・カスタムフィールド売買物件/賃貸物件はラジオボタンとして設置

functions.phpに記述:

/***********************************************
 * タクソノミ選択時の制御
 ***********************************************/
function my_print_footer_scripts() {
	global $post_type;
	if ($post_type == 'estate'): ?>
<script type="text/javascript">
	//<![CDATA[
	jQuery(function($){

		// タクソノミ選択チェックボックスをラジオボタンに
		$(".categorychecklist input[type=checkbox]").each(function(){
			$(this).attr("type","radio");
		});

		// タクソノミIDとタクソノミ名を配列に定義
		var tax_arr = new Array();
		tax_arr['#in-tax_estate-6'] = '売買物件';
		tax_arr['#in-tax_estate-7'] = '賃貸物件';

		// タクソノミクリック時の処理
		$("input[name^=tax_input]").live("click", function(){
			$("input[name^=tax_input]").each(function(){
				if ( $(this).is(':checked') == true ) {
					taxid = $(this).val();
					taxname = tax_arr['#in-tax_estate-'+taxid];
					return false;
				}
			});
			$("#acf-field-sellrent-"+taxname).attr('checked', 'checked');
		});

		// カスタムフィールドのラジオボタンクリック時の処理
		$("[id^=acf-field-sellrent-]").live("click", function(){
			$("[id^=acf-field-sellrent-]").each(function(){
				if ( $(this).is(':checked') == true ) {
					taxname = $(this).val();
					return false;
				}
			});
			for (var key in tax_arr) {
				if ( tax_arr[key] == taxname ) taxid = key;
			}
			$(taxid).attr('checked', 'checked');
		});

	});
	//]]>
</script>
<?php
	endif;
}
add_action('admin_print_footer_scripts', 'my_print_footer_scripts', 21);

ちょっと解説

17-20行目:タクソノミIDとタクソノミ名(フィール名と共通)を配列に
21行目~:タクソノミからカスタムフィールドへシンクロ
33行目~:カスタムフィールドからタクソノミへシンクロ

そして選択はどちらか、つまりラジオボタンが望ましいので、
タクソノミの選択もチェックボックスからラジオボタンに変更
12-14行目:単純にtypeをradioに書き換えている
これは通常投稿のカテゴリ選択にも応用できそうですね。

これで希望どおりの制御が完成です。

直接メールしてみる

お名前 (必須)
メールアドレス (必須)
件名
ご相談内容
画像文字をご入力ください
captcha

コメントを残す