Cómo añadir columnas personalizadas en el admin de WordPress
WordPress permite customizar su administrador de la misma manera que el front. Vamos a ver como podemos añadir nuevas columnas a las tablas donde se muestran nuestros posts. Por un lado, tenemos un panel que a veces pasa desapercibido: «Opciones de pantalla». Es una pestaña situada en la parte superior derecha de la pantalla, y nos permite añadir columnas que por defecto pueden estar desactivadas, como por ejemplo el número de comentarios.
Tambíen pueden aparecer opciones añadidas por alguno de los plugins que tenemos instalados. En el ejemplo del pantallazo, se puede ver que hay opciones extra relacionadas con el SEO, que han sido añadidas por el plugin Yoast.
Además de todas estas columnas, podemos añadir otras columnas con cualquier dato relacionado con nuestros posts. Para ello WordPress dispone de dos «hooks»: manage_posts_columns y manage_posts_custom_column. Los «hooks» son enganches con funciones del core de WordPress, que nos permiten insertar nuestro código para modificar dichas funciones desde nuestro tema, si tener que modificar los archivos del core. Para verlo con un ejemplo, vamos a añadir la columna a nuestro admin pegando este código en el functions.php del tema:
1 2 3 4 5 6 7 8 |
/* Añade una nueva columna al admin */ function my_theme_columns_head($defaults) { $defaults['featured_image'] = 'Featured Image'; return $defaults; } add_filter('manage_posts_columns', 'my_theme_columns_head'); |
Con la linea
1 |
add_filter('manage_posts_columns', 'my_theme_columns_head'); |
le estamos diciendo a WordPress que cuando vaya a montar las columnas del listado de posts en el admin (manage_posts_columns), ejecute nuestra función my_theme_columns_head para modificar el proceso y añadir una nueva columna. Si guardamos, ya deberíamos ver la nueva columna en el admin, de momento vacía.
Una vez tenemos la columna en el admin, vamos a utilizar el hook manage_posts_custom_column para especificar el contenido que queremos pintar dentro. Para ello añadimos al functions.php:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
/* Muestra la imagen en la columna para cada post. */ function my_theme_columns_content($column_name, $post_ID) { if ($column_name == 'featured_image') { $post_thumbnail_id = get_post_thumbnail_id($post_ID); if ($post_thumbnail_id) { $post_thumbnail_img = wp_get_attachment_image_src($post_thumbnail_id, array(50,50)); if($post_thumbnail_img[0]){ echo '<img src="' . $post_thumbnail_img[0] . '" />'; } } } } add_action('manage_posts_custom_column', 'my_theme_columns_content', 10, 2); |
En este caso, estamos diciéndole a WordPress, que cuando pinte las columnas (manage_posts_custom_column), ejecute nuestra función my_theme_columns_content. Y dentro de la función, que si el nombre de la columna que se está pintando es el que hemos creado, pinte un thumbnail de 50×50 del post (En este caso he utilizado para simplificar un array como segundo parámetro de wp_get_attachment_image_src para especificar las dimensiones, pero también podemos crear un nuevo tipo de imagen con add_image_size).
Una vez hecho esto, si actualizamos el admin, veremos algo así:
Por último, especificar que con estos hooks, añadimos la columna para todos los tipos de posts. Si solo queremos añadir la columna en la pantalla de posts, podemos utilizar los hooks:
1 2 |
add_filter('manage_post_posts_columns', 'my_theme_columns_head',10); add_action('manage_post_posts_custom_column', 'my_theme_columns_content', 10, 2); |
Y si queremos añadir la columna solo a un custom post type (en este caso «experimentos»):
1 2 |
add_filter('manage_experimentos_posts_columns', 'my_theme_columns_head',10); add_action('manage_experimentos_posts_custom_column', 'my_theme_columns_content', 10, 2); |