A veces por necesidades de diseño tener un banner en la página principal de un sitio web, por ejemplo, de algo así como los anuncios, novedades u ofertas o enlaces a nuevo contenido en el sitio web o fotos destacadas.
Lo mejor en este caso es utilizar un custom post type o tipo personalizado para mantener este contenido separado de lo demás y así poder publicarlo como contenido en la página de inicio cada vez que se agrega un banner.
Hay algunas opciones para hacerlo. Una opcion sencilla es utilizar un widget que se agregan mediante el registro de un área de widget en el lugar correcto en los archivos de plantilla del tema o plantilla.
Sin embargo, un enfoque mas interesante, que le da más flexibilidad, es la creación de un tipo de post personalizado y usarlo para mostrar uno o más banners. Incluso se puede utilizar para mostrar banners de una determinada categoría diferente a los demás, si tiene varias categorias, pero quiere destacar una de ellas.
Aqui dejamos un ejemplo lo primero sera registrar el nuevo post type en el archivo functions.php
// registramos el custom post type called 'banner'
function banner() {
$labels = array(
'name' => __( 'Banners' ),
'singular_name' => __( 'banner' ),
'add_new' => __( 'New banner' ),
'add_new_item' => __( 'Add New banner' ),
'edit_item' => __( 'Edit banner' ),
'new_item' => __( 'New banner' ),
'view_item' => __( 'View banner' ),
'search_items' => __( 'Search banners' ),
'not_found' => __( 'No banners Found' ),
'not_found_in_trash' => __( 'No banners found in Trash' ),
);
$args = array(
'labels' => $labels,
'has_archive' => true,
'public' => true,
'hierarchical' => false,
'supports' => array(
'title',
'editor',
'excerpt',
'custom-fields',
'thumbnail',
'page-attributes'
),
'taxonomies' => array( 'post_tag', 'category'),
);
register_post_type( 'banner', $args );
}
add_action( 'init', 'Banners' );El siguiente paso es crear una función para consultar utilizando WP_Query para consultar el tipo de post banner y mostrar todos los banners. A continuación, agrega esta función siempre que sea en el tema que desee mostrar sus banners.
De nuevo en el archivo functions.php o en su archivo plugin si usted está utilizando este enfoque, agregue lo siguiente:
// mostramos el banner en la home
function home_banner() {
//consulto los post
$query = new WP_Query( array(
'post_type' => 'banner',
));
// muestro los banner en un div con clase banner-box div
if ( $query->have_posts() ) { ?>
<div class="banner-box">
<?php while ( $query->have_posts() ) : $query->the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class( 'banner' ); ?>><?php the_content(); ?></div>
<?php endwhile; ?>
</div>
<?php }
wp_reset_postdata();
}Veamos como mostrar banners en la página de inicio, para eso utilizamos condicionales para detectar la pagina en que estamos utilizamos is_home_page (). Esto comprobará la página de inicio si tenemos otra pagina que no es la home para inciar habra que detectar cual es con <?php is_page($page); ?>.
En mi archivo header.php, añado lo siguiente justo dentro de la etiqueta id="main"> <div apertura. Como estoy trabajando con un tema de los niños, he creado un nuevo archivo header.php en mi tema infantil, que es un duplicado del archivo de cabecera del tema de los padres a excepción de este nuevo código.
Luego en la la pagina que quiera poner mostrar los banner por ejemplo head.php o index.php añadimos el siguiente código:
<? //mostrar el banner solo en la home
if ( is_home() ) {
home_banner();
}
?>
