web-development-kb-pt.site

Criando um tipo de postagem personalizada centrada na imagem?

Alguém tem alguma dica para criar um tipo de postagem personalizada centrada na imagem?

Para elaborar, meu blog tem imagens de cabeçalho rotativas, mostradas abaixo:

Blog header showing random images

As duas imagens no canto superior esquerdo são aleatórias e existem como anexos de uma página específica que existe apenas para conter essas imagens. Eu estou querendo saber se é possível armazená-los de uma maneira diferente usando tipos de postagem personalizados. Eu criei um novo tipo de post, "header-image", e estou tentando descobrir para onde ir a partir daqui. Gostaria que cada imagem de cabeçalho "post" tivesse um anexo de imagem. Em vez de puxar imagens aleatórias de uma página, eu colocaria mensagens aleatórias do tipo de postagem do cabeçalho da imagem. Dado isso,

  1. Como posso incorporar uma interface simples ao processo de anexo que está disponível na página de administração "Nova imagem de cabeçalho"?
  2. Posso remover o título do post e as caixas de entrada de conteúdo para desimpedir essa página?

As metas são para criar uma interface melhor para o processo de upload atual e, eventualmente, ser capaz de criar uma taxonomia para sinalizar imagens como imagem da esquerda/imagem da direita. (Olhando para a imagem acima, você pode ver a foto à direita cobre o rosto da outra foto. Eu poderia evitar isso marcando fotos para exibição à esquerda e/ou à direita). Este último não será um problema se Eu posso implementar o primeiro.

Update: baseado em uma resposta aqui, eu pude implementar esta configuração. O código completo é postado abaixo .

16
Annika Backstrom

a resposta inicial de goldenapple me deu o empurrão que eu precisava para terminar isso.

funções.php

Aqui está o código completo que estou usando para adicionar um novo tipo de post "header-image" e modificar outras telas de administração de acordo:

/**
 * 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' );

Capturas de tela do administrador

Header Images post list

Header Images post editing

Código do modelo

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

foreach( $header_images as $idx => $post ) {
    setup_postdata($post);
    the_post_thumbnail('post-thumbnail', array('class' => 'snapshot snapshot' . ($idx+1) ) );
}
17
Annika Backstrom
function register_header_image() {
     register_post_type( 'header-image', 
                         array( 
                             'label'=>'Header Images',
                             'name'=>'Header Images',
                             'singular_name'=>'Header Image',
                             'public'=>true,
                             'show_ui'=>true,
                             'hierarchical'=>true,
                             'supports'=>array('thumbnail') ) );
}

add_action ('init','register_header_image');
add_theme_support( 'post-thumbnails' );

Isso deve registrar seu tipo de postagem com nada além de um campo para uma imagem em destaque. Veja o codex http://codex.wordpress.org/Function_Reference/register_post_type para obter uma lista dos argumentos a serem transmitidos.

13
goldenapples