Crear un tema WordPress desde cero – Entradas y comentarios

Las entradas o posts son las noticias o artículos que se publican y actualizan constantemente en la Web. Se organizan de forma cronológica y admiten categorías y etiquetas.

En la plantilla mytheme que estamos desarrollando para este tutorial usaremos el archivo single.php para las entradas donde destacaremos la utilización de los campos: título, contenido, fecha de registro, categorías a las que pertenece el post, tags relacionados (etiquetas).

En el próximo capítulo hablaremos también de la imagen destacada y descripción breve o extracto que mostraremos en los listados de posts (la página de categorías, tags o búsqueda).

También vamos a querer que los usuarios puedan dejar un comentario.

En nuestro archivo single.php añadiremos el siguiente código:

Source code

<?php get_header(); ?>
<div id="sidebar_left" class="col-xs-12 col-sm-3 col-md-3 col-lg-3 hidden-xs hidden-sm">
    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Sidebar Left') ) : endif; ?>
</div>
 
<div id="content" class="col-xs-12 col-sm-8 col-md-6 col-lg-6">
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>   
        <h1><?php the_title(); ?></h1>
        <small><?php the_time( get_option( 'date_format' ) ); ?></small>
        <div class="entry-meta">
            <span class="cat-links"><?php echo get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'mytheme' ) ); ?></span>
        </div>
        <?php the_content(); ?>
 
        <?php
        $posttags = get_the_tags();
        if ($posttags) {
          foreach($posttags as $tag) {
            echo '<a href="'.get_tag_link($tag->term_id).'">'.$tag->name.'</a>'. ' '; 
          }
        }
        ?>
 
        <div class="author_post">
            <?php _e( 'Escrito por ', 'mytheme' ); ?>
            <?php echo get_the_author(); ?> - <?php echo get_the_author_meta("user_description"); ?>
        </div>
     <?php comments_template( '', true ); ?>
    <?php endwhile; endif; ?>
</div>
 
<div id="sidebar_right" class="col-xs-12 col-sm-4 col-md-3 col-lg-3">
    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Sidebar Right') ) : endif; ?>
</div>
<?php get_footer(); ?>

Igual que hicimos para las páginas lo primero que hacemos es incluir la cabecera de nuestra estructura y finalmente nuestro pie de página. Añadimos las 2 columnas y nuestro contenido central y así mantenemos la estructura de nuestro tema mytheme.

El objetivo de este tema es centrarnos en el contenido central de este archivo single.php.

Lo primero que hacemos es revisar si existe para recorrer su información. En un H1 estamos mostrando el título de la entrada con la función the_title(), seguidamente en pequeño mostramos la fecha de publicación con la función the_time(). Obtenemos las categorías a las que pertenece con get_the_category_list(). Mostramos el contenido del post on the_content(). Mostramos los tags relacionados con get_the_tags(). Mostramos el autor del post + su descripción con get_the_author() y get_the_author_meta() respectivamente. Y por último, añadimos el template de los comentarios con la función comments_template().

Como podrás observar siempre utilizo funciones del core de WordPress para obtener la información deseada. Esto quiere decir que nuestra plantilla va a funcionar siempre.

Nuestras entradas se verán así:

La maquetación ya os la dejo a vuestro gusto siempre modificando y añadiendo los estilos en el archivo style.css.

Ahora mismo en nuestro tema se está visualizando la plantilla de comentarios que trae WordPress por defecto. Si quisieramos personalizarla solo tendríamos que añadir en nuestra tema el archivo comments.php con el contenido deseado.

Indice de contenido