One-Click "Featured" Star in the Posts List
Adds a star column to the Posts screen that marks or unmarks a post as featured with one click, saving a "featured" custom field your theme or queries can use.
Opens WPIDE on
Code
// Custom field that stores the flag.
$wpide_featured_key = '_wpide_featured';
add_filter( 'manage_post_posts_columns', function ( $columns ) {
return array_slice( $columns, 0, 1, true ) + array( 'wpide_featured' => '<span class="dashicons dashicons-star-filled" aria-hidden="true"></span><span class="screen-reader-text">Featured</span>' ) + array_slice( $columns, 1, null, true );
} );
add_action( 'manage_post_posts_custom_column', function ( $column, $post_id ) use ( $wpide_featured_key ) {
if ( 'wpide_featured' !== $column ) {
return;
}
$on = '1' === get_post_meta( $post_id, $wpide_featured_key, true );
printf(
'<button type="button" class="wpide-star button-link" data-id="%d" aria-pressed="%s" title="Toggle featured"><span class="dashicons dashicons-star-%s" aria-hidden="true"></span><span class="screen-reader-text">Featured</span></button>',
(int) $post_id,
$on ? 'true' : 'false',
$on ? 'filled' : 'empty'
);
}, 10, 2 );
add_action( 'wp_ajax_wpide_toggle_featured', function () use ( $wpide_featured_key ) {
check_ajax_referer( 'wpide_featured_toggle', 'nonce' );
$post_id = isset( $_POST['post_id'] ) ? absint( $_POST['post_id'] ) : 0;
if ( ! $post_id || ! current_user_can( 'edit_post', $post_id ) ) {
wp_send_json_error( null, 403 );
}
$on = '1' !== get_post_meta( $post_id, $wpide_featured_key, true );
$on ? update_post_meta( $post_id, $wpide_featured_key, '1' ) : delete_post_meta( $post_id, $wpide_featured_key );
wp_send_json_success( array( 'featured' => $on ) );
} );
add_action( 'admin_footer-edit.php', function () {
if ( 'post' !== get_current_screen()->post_type ) {
return;
}
?>
<style>.column-wpide_featured{width:2.2em}.wpide-star .dashicons{color:#dba617}</style>
<script>
document.addEventListener( 'click', function ( event ) {
var button = event.target.closest( '.wpide-star' );
if ( ! button ) { return; }
var body = new FormData();
body.append( 'action', 'wpide_toggle_featured' );
body.append( 'post_id', button.dataset.id );
body.append( 'nonce', <?php echo wp_json_encode( wp_create_nonce( 'wpide_featured_toggle' ) ); ?> );
fetch( ajaxurl, { method: 'POST', credentials: 'same-origin', body: body } )
.then( function ( response ) { return response.json(); } )
.then( function ( result ) {
if ( ! result.success ) { return; }
button.setAttribute( 'aria-pressed', result.data.featured ? 'true' : 'false' );
button.querySelector( '.dashicons' ).className = 'dashicons dashicons-star-' + ( result.data.featured ? 'filled' : 'empty' );
} );
} );
</script>
<?php
} );
Notes
Query featured posts with 'meta_key' => '_wpide_featured', 'meta_value' => '1'; change $wpide_featured_key to reuse an existing field.
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.