カスタムフィールドを管理画面の投稿一覧に表示させてクイック編集モードで編集可能にする方法 -『wordpress』
- uto usui
- //
- admin
- function.php
- wordpress
カスタムフィールドの値をアドバンスカスタムフィールドなどで拡張して便利に扱っていることは多いと思いますが、投稿一覧でチェックしたい場合や、その際頻繁に変更する必要がある場合に、カスタムフィールドを管理画面の投稿一覧に表示させてクイック編集モードでその場で編集可能にする方法です。
今回はカスタムフィールドの値はテキストのみになります。
管理画面の投稿一覧にカスタムフィールドの項目を追加する
まずは管理画面の投稿一覧にカスタムフィールドの項目を表示させてみます。
function add_posts_columns( $defaults ) {
$defaults['item01'] = 'item01'; // ID と 表示させるラベル
$defaults['item02'] = 'item02';
return $defaults;
}
add_filter( 'manage_posts_columns', 'my_posts_columns' );
function my_posts_custom_column( $column, $post_id ) {
switch ( $column ) {
case 'item01': // ID
$post_meta = get_post_meta( $post_id, 'item01', true );
if ( $post_meta ) {
echo $post_meta;
} else {
echo 'none'; // 値が無いとき
}
break;
case 'item02':
$post_meta = get_post_meta( $post_id, 'item02', true );
if ( $post_meta ) {
echo $post_meta;
} else {
echo 'none';
}
break;
}
}
add_action( 'manage_posts_custom_column' , 'my_posts_custom_column', 10, 2 );
クイック編集にカスタムフィールドの入力エリアを追加
クイック編集の中にカスタムフィールドの入力エリアを追加します。
function add_field_to_quickmenu( $column_name, $post_type ) {
static $print_nonce = TRUE;
if ( $print_nonce ) {
$print_nonce = FALSE;
wp_nonce_field( 'quick_edit_action', $post_type . '_edit_nonce' );
}
?>
<fieldset class="inline-edit-col-right inline-custom-meta">
<div class="inline-edit-col column-<?php echo $column_name ?>">
<label class="inline-edit-group"></p>
<?php
switch ( $column_name ) {
case 'item01':
?><span class="title">item01</span><input name="item01"><?php
break;
case 'item02':
?><span class="title">item02</span><input name="item02"><?php
break;
}
?>
</label>
</div>
</fieldset>
<?php
}
add_action( 'quick_edit_custom_box', 'add_field_to_quickmenu', 10, 2 );
カスタムフィールドの入力エリアにjQueryで値をセットしておく
あらかじめカスタムフィールドに保存されている値がある場合に、カスタムフィールドの値をjQueryでセットします。
function my_admin_edit_foot() {
global $post_type;
$slug = 'post'; // 投稿タイプの指定をしたいとき変更
if ( $post_type == $slug ) {
?>
<script>
(function($) {
var $wp_inline_edit = inlineEditPost.edit;
inlineEditPost.edit = function( id ) {
$wp_inline_edit.apply( this, arguments );
var $post_id = 0;
if ( typeof( id ) == 'object' )
$post_id = parseInt( this.getId( id ) );
if ( $post_id > 0 ) {
var $edit_row = $( '#edit-' + $post_id );
var $post_row = $( '#post-' + $post_id );
//椅子
var $chair = $( '.column-item01', $post_row ).html();
$( ':input[name="item01"]', $edit_row ).val( $chair );
//机
var $table = $( '.column-item02', $post_row ).html();
$( ':input[name="item02"]', $edit_row ).val( $table );
}
};
})(jQuery);
</script>
<?php
}
}
add_action('admin_print_footer_scripts', 'my_admin_edit_foot');
クイック編集モードでカスタムフィールドの値を保存させる
最後に保存機能を追加します。
function save_custom_meta( $post_id ) {
if ( !current_user_can( 'edit_post', $post_id ) ) {
return;
}
$_POST += array("{$slug}_edit_nonce" => '');
if ( !wp_verify_nonce( $_POST["{$slug}_edit_nonce"], 'quick_edit_action' ) ) {
return;
}
if ( isset( $_REQUEST['item01'] ) ) {
update_post_meta( $post_id, 'item01', $_REQUEST['item01'] );
}
if ( isset( $_REQUEST['item02'] ) ) {
update_post_meta( $post_id, 'item02', $_REQUEST['item02'] );
}
}
add_action( 'save_post', 'save_custom_meta' );
おわります。