Creating an Image-Centric Custom Post Type?

Does anyone have any tips for creating an image-centric custom post type?

To elaborate, my blog has rotating header images, shown below:

Blog header showing random images

The two images in the top left are randomized, and exist as attachments to a specific page that only exists to contain these images. I’m wondering if it’s feasible to store these in a different way using custom post types. I’ve created a new post type, “header-image”, and I’m trying to figure out where to go from here. I would like each header-image “post” to have one image attachment. Instead of pulling random images from a page, I would pull random posts from the header-image post type. Given this,

  1. How might I incorporate a simple interface to the attachment process that is available from the “New Header Image” admin page?
  2. Can I remove the post title and content input boxes to unclutter that page?

Goals are to create a better interface to the current upload process, and eventually be able to create a taxonomy to flag images as left picture/right picture. (Looking at the above image, you can see the photo on the right covers up the face in the other photo. I could avoid this by marking photos for left and/or right side display.) The latter won’t be a problem if I can implement the former.

Update: based on an answer here, I was able to implement this setup. Full code is posted below.


goldenapple’s initial answer gave me the jumpstart I needed to finish this up.


Here is the complete code I’m using to add a new post type “header-image” and modify other admin screens accordingly:

 * Register the Header Image custom post type.
function sixohthree_init() {
    $labels = array(
        'name' => 'Header Images',
        'singular_name' => 'Header Image',
        'add_new_item' => 'Add Header Image',
        'edit_item' => 'Edit Header Image',
        'new_item' => 'New Header Image',
        'view_item' => 'View Header Image',
        'search_items' => 'Search Header Images',
        'not_found' => 'No Header Images found',
        'not_found_in_trash' => 'No Header Images found in Trash'

    $args = array(
        'labels' => $labels,
        'public' => false,
        'show_ui' => true,
        'supports' => array('thumbnail')

    register_post_type( 'header-image', $args );
add_action( 'init', 'sixohthree_init' );

 * Modify which columns display when the admin views a list of header-image posts.
function sixohthree_headerimage_posts_columns( $posts_columns ) {
    $tmp = array();

    foreach( $posts_columns as $key => $value ) {
        if( $key == 'title' ) {
            $tmp['header-image'] = 'Header Image';
        } else {
            $tmp[$key] = $value;

    return $tmp;
add_filter( 'manage_header-image_posts_columns', 'sixohthree_headerimage_posts_columns' );

 * Custom column output when admin is view the header-image post list.
function sixohthree_headerimage_custom_column( $column_name ) {
    global $post;

    if( $column_name == 'header-image' ) {
        echo "<a href="", get_edit_post_link( $post->ID ), "">", get_the_post_thumbnail( $post->ID ), "</a>";
add_action( 'manage_posts_custom_column', 'sixohthree_headerimage_custom_column' );

 * Make the "Featured Image" metabox front and center when editing a header-image post.
function sixohthree_headerimage_metaboxes( $post ) {
    global $wp_meta_boxes;

    remove_meta_box('postimagediv', 'header-image', 'side');
    add_meta_box('postimagediv', __('Featured Image'), 'post_thumbnail_meta_box', 'header-image', 'normal', 'high');
add_action( 'add_meta_boxes_header-image', 'sixohthree_headerimage_metaboxes' );

 * Enable thumbnail support in the theme, and set the thumbnail size.
function sixohthree_after_setup() {
    add_theme_support( 'post-thumbnails' );
    set_post_thumbnail_size(150, 100, true);
add_action( 'after_setup_theme', 'sixohthree_after_setup' );

Admin screenshots

Header Images post list

Header Images post editing

Template code

$header_images = get_posts('post_type=header-image&orderby=rand&numberposts=2');

foreach( $header_images as $idx => $post ) {
    the_post_thumbnail('post-thumbnail', array('class' => 'snapshot snapshot' . ($idx+1) ) );

Leave a Comment