Skip to content

Instantly share code, notes, and snippets.

@krystyna93
Last active June 10, 2023 12:56
Show Gist options
  • Save krystyna93/76dff1b74b5379ae27f372b69a2f49f4 to your computer and use it in GitHub Desktop.
Save krystyna93/76dff1b74b5379ae27f372b69a2f49f4 to your computer and use it in GitHub Desktop.
Customize WordPress Dashboard Editor Table Columns Example: Add Column Header and Featured Image w/size
<?php
/* To modify the columns in a WordPress dashboard table, you can use the manage_{$post_type}_posts_columns filter.
This filter allows you to add or remove columns from the post type's edit screen.
Here is an example of how to use this filter to modify the columns in the Posts table:
*/
Modify wordpress dashboard table column headings with image columns and featured image example
function custom_posts_table_columns($columns) {
// Remove the Author column
unset($columns['author']);
// Add a custom column for the post thumbnail
$columns['thumbnail'] = 'Thumbnail';
return $columns;
}
add_filter('manage_posts_columns', 'custom_posts_table_columns');
/*
In this example, we remove the default "Author" column by unsetting it from the $columns array.
We then add a new column called "Thumbnail" by adding a new key-value pair to the $columns array.
Simply replace "posts" with the name of the post type you want to modify and adjust the column names and keys as needed.
----
To add a column for images in a WordPress table, you can use the manage_{$post_type}_posts_columns filter to add a new column
heading and the manage_{$post_type}_posts_custom_column action to output the content for each row.
Here's an example of how to add an "Image" column to the Posts table:
*/
// Add a custom column header for the image
function custom_posts_table_columns($columns) {
$columns['image'] = __('Image', 'textdomain');
return $columns;
}
add_filter('manage_posts_columns', 'custom_posts_table_columns');
// Output the content for the image column
function custom_posts_table_column_content($column_name, $post_id) {
if ($column_name == 'image') {
// Get the post thumbnail URL
$thumbnail_url = get_the_post_thumbnail_url($post_id, 'thumbnail');
// Output an img tag with the thumbnail URL
if ($thumbnail_url) {
echo '<img src="' . esc_attr($thumbnail_url) . '" alt="" />';
}
}
}
add_action('manage_posts_custom_column', 'custom_posts_table_column_content', 10, 2);
/* In this example, we first add a new column header called "Image" using the manage_posts_columns filter.
We then define a function to output the content for the "Image" column using the manage_posts_custom_column action.
The custom_posts_table_column_content function checks whether the current column is "Image" and outputs an <img> tag with the post
thumbnail URL if it exists. Note that we're using the esc_attr function to sanitize the thumbnail URL for output.
You can customize this code to suit your needs, such as by using a different image size or checking for featured images,
depending on your particular use case.
-----
*/
// Add a custom column header for the image
function custom_posts_table_columns($columns) {
$columns['image'] = __('Image', 'textdomain');
return $columns;
}
add_filter('manage_posts_columns', 'custom_posts_table_columns');
// Output the content for the image column
function custom_posts_table_column_content($column_name, $post_id) {
if ($column_name == 'image') {
// Check if the post has a featured image
if (has_post_thumbnail($post_id)) {
// Get the URL for the featured image with size 60x60
$thumbnail_url = get_the_post_thumbnail_url($post_id, array(60,60));
// Output an img tag with the thumbnail URL
if ($thumbnail_url) {
echo '<img src="' . esc_attr($thumbnail_url) . '" alt="" />';
}
}
}
}
add_action('manage_posts_custom_column', 'custom_posts_table_column_content', 10, 2);
/* In this updated code, we've added a check to see if the post has a featured image using the has_post_thumbnail function.
If it does, we're retrieving the URL for the featured image with a size of 60x60 using the get_the_post_thumbnail_url function with
the array(60,60) parameter.
If a featured image exists and its URL is retrieved, then we output the image tag as before.
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment