Spanish (Español) translation by Eva Collados Pascual (you can also view the original English article)



En un tutorial anterior, demostré cómo crear una plantilla de archivo para una taxonomía que listaste las entradas según el término de la taxonomía.
Este tutorial es similar en el sentido de que te muestra cómo separar las entradas en nuestros archivos, pero usa una estructura distinta y también una archivo de plantilla diferente. Te voy a enseñar ha crear una plantilla de archivo para una taxonomía que liste las entradas según que tipo de entradas sean, es decir, en base a su post type.
Esto podría ser útil en el caso de que hayas registrado un tipo de entrada que quieres mantener independiente del resto de entradas normales o de otro tipo de entrada concreta, pero seguir manteniendo una taxonomía válida para ambos tipos. Por ejemplo, si estás listando libros y artículos como tipos de entradas distintos, pero sigues teniendo temas comunes como taxonomía (por ej. ¡WordPress!).
En el ejemplo que voy a usar aquí, trabajaré con el tipo de entrada ‘animals’, tal y como hice en el anterior tutorial, pero esta vez también trabajaré con una entrada estándar. Listaré todos los animales usando el término de consulta y después listaré las entradas del blog con ese término.
1. Comienzo: Crear el Tema
Crearé un tema hijo para el tema twentyfourteen, de manera que si estás usando los archivos fuente de este tutorial también necesitarás tener instalado ese tema en tu sitio web. En la hoja de estilo de mi tema, añado lo siguiente:
1 |
/*
|
2 |
Theme Name: WPTutsPlus Creating a Taxonomy Archive to List Posts by Post Type
|
3 |
Theme URI: https://rachelmccollin.co.uk/wptutsplus-tax-archive-by-post-type/
|
4 |
Description: Theme to support WPTutsPlus tutorial on creating a custom taxonomy archive. Child theme for the Twenty Fourteen theme.
|
5 |
Author: Rachel McCollin
|
6 |
Author URI: http://rachelmccollin.co.uk/
|
7 |
Template: twentyfourteen
|
8 |
Version: 1.0
|
9 |
*/
|
10 |
|
11 |
@import url("../twentyfourteen/style.css"); |
Esto es todo lo que necesito para crear mi tema hijo. Si estás usando tu propio tema, puedes saltarte este paso.
2. Registrar el Tipo de Entrada y la Taxonomía
Nota: Si has seguido mi otro tutorial sobre la creación de una plantilla de archivo para una entrada personalizada, puedes usar el tema que creaste ya que usa el mismo tipo de entrada y taxonomía. Solo tendrás que hacer una pequeña modificación que te indicaré en esta sección, y añadir un nuevo archivo para el archivo de la taxonomía.
El siguiente paso consiste en registrar el tipo de entrada ‘animal’ y la taxonomía ‘animal family’. Crea un archivo functions.php
para tu tema y añade en primer lugar la función para registrar el tipo de entrada:
1 |
// register a custom post type called 'animals'
|
2 |
function wptp_create_post_type() { |
3 |
$labels = array( |
4 |
'name' => __( 'Animals' ), |
5 |
'singular_name' => __( 'animal' ), |
6 |
'add_new' => __( 'New animal' ), |
7 |
'add_new_item' => __( 'Add New animal' ), |
8 |
'edit_item' => __( 'Edit animal' ), |
9 |
'new_item' => __( 'New animal' ), |
10 |
'view_item' => __( 'View animal' ), |
11 |
'search_items' => __( 'Search animals' ), |
12 |
'not_found' => __( 'No animals Found' ), |
13 |
'not_found_in_trash' => __( 'No animals found in Trash' ), |
14 |
);
|
15 |
$args = array( |
16 |
'labels' => $labels, |
17 |
'has_archive' => true, |
18 |
'public' => true, |
19 |
'hierarchical' => false, |
20 |
'supports' => array( |
21 |
'title', |
22 |
'editor', |
23 |
'excerpt', |
24 |
'custom-fields', |
25 |
'thumbnail', |
26 |
'page-attributes'
|
27 |
),
|
28 |
'taxonomies' => array( 'post_tag', 'category'), |
29 |
);
|
30 |
register_post_type( 'animal', $args ); |
31 |
}
|
32 |
add_action( 'init', 'wptp_create_post_type' ); |
Después, bajo este código, registra la taxonomía animal family.
Si estás trabajando con el tema que creamos en el tutorial anterior, tendrás que añadir array('animal,'post')
en los argumentos de tu función, dirigido solo a ‘animal’
.
1 |
// register a taxonomy called 'Animal Family'
|
2 |
function wptp_register_taxonomy() { |
3 |
register_taxonomy( 'animal_cat', array( 'animal', 'post' ), |
4 |
array( |
5 |
'labels' => array( |
6 |
'name' => 'Animal Families', |
7 |
'singular_name' => 'Animal Family', |
8 |
'search_items' => 'Search Animal Families', |
9 |
'all_items' => 'All Animal Families', |
10 |
'edit_item' => 'Edit Animal Families', |
11 |
'update_item' => 'Update Animal Family', |
12 |
'add_new_item' => 'Add New Animal Family', |
13 |
'new_item_name' => 'New Animal Family Name', |
14 |
'menu_name' => 'Animal Family', |
15 |
),
|
16 |
'hierarchical' => true, |
17 |
'sort' => true, |
18 |
'args' => array( 'orderby' => 'term_order' ), |
19 |
'rewrite' => array( 'slug' => 'animal-family' ), |
20 |
'show_admin_column' => true |
21 |
)
|
22 |
);
|
23 |
}
|
24 |
add_action( 'init', 'wptp_register_taxonomy' ); |
Guarda el archivo de tus funciones y comprueba como ahora aparecen tu nuevo tipo de entrada y tu taxonomía en el área de administración de tu sitio web.
Ahora añade información – yo he añadido algunos animales y entradas en la familia ‘Canines’.
3. Crear una Plantilla de Archivo
Ahora crea un archivo llamado taxonomy-animal_cat.php
. Será la planilla de archivo para la nueva taxonomía.
Copia el código para el elemento contenedor de tu tema en este archivo de manera que cuente con elementos y clases comunes con el resto de tu tema. Yo lo estoy copiando del tema twentyfourteen – si estás usando tu propio tema, cópialo de él. Copia todo excepto el encabezado y el loop, y añade algunos comentarios en la parte superior para recordar para qué sirve este archivo:
1 |
<?php
|
2 |
/*
|
3 |
WpTutsPlus tutorial for creating archive to display posts by taxonomy term
|
4 |
Archive template for animal_cat taxonomy
|
5 |
*/
|
6 |
?>
|
7 |
|
8 |
<?php get_header(); ?> |
9 |
|
10 |
<div id="main-content" class="main-content"> |
11 |
|
12 |
<div id="primary" class="content-area"> |
13 |
<div id="content" class="site-content" role="main"> |
14 |
|
15 |
|
16 |
|
17 |
</div><!-- #content --> |
18 |
</div><!-- #primary --> |
19 |
<?php get_sidebar( 'content' ); ?> |
20 |
</div><!-- #main-content --> |
21 |
|
22 |
<?php
|
23 |
get_sidebar(); |
24 |
get_footer(); |
4. Identificar el Objeto de la Consulta
Para que puedas mostrar el nombre del término consultado y definir tus consultas en los dos loops que vas a crear, necesitas identificar el objeto de la consulta y guardarlo como variable.
Añade lo siguiente en algún lugar cerca de la parte superior de tu plantilla de archivo (yo lo estoy añadiendo bajo la llamada get_header()
)
1 |
<?php
|
2 |
// get the currently queried taxonomy term, for use later in the template file
|
3 |
$term = get_queried_object(); |
4 |
?>
|
Vas a estar usando esto en el siguiente paso.
5. Mostrar el Título para la Página de Archivo
Antes de añadir tus loops, tienes que dar salida al titular para tu página de archivo. Tras la apertura del div #content
, añade el siguiente código:
1 |
<header class="archive-header"> |
2 |
<h1 class="archive-title"> |
3 |
<?php echo $term->name; ?> |
4 |
<?php //post_type_archive_title(); ?> |
5 |
</h1> |
6 |
</header><!-- .archive-header --> |
6. El Primer Loop
Bajo el titular, tienes que añadir tu primer loop, usando WP_Query
según necesites para definir los argumentos.
Primero define la consulta:
1 |
// Define the query
|
2 |
$args = array( |
3 |
'post_type' => 'animal', |
4 |
'animal_cat' => $term->slug |
5 |
);
|
6 |
$query = new WP_Query( $args ); |
Advierte que esto emplea la variable $term
que ya has definido.
Y después añade el loop, dando salida a un enlace para cada animal en una lista sin orden:
1 |
if ($query->have_posts()) { |
2 |
|
3 |
// output the term name in a heading tag
|
4 |
echo'<h2>Animals in the ' . $term->name . ' Family</h2>'; |
5 |
|
6 |
// output the post titles in a list
|
7 |
echo '<ul>'; |
8 |
|
9 |
// Start the Loop
|
10 |
while ( $query->have_posts() ) : $query->the_post(); ?> |
11 |
|
12 |
<li class="animal-listing" id="post-<?php the_ID(); ?>"> |
13 |
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> |
14 |
</li>
|
15 |
|
16 |
<?php endwhile; |
17 |
|
18 |
echo '</ul>'; |
19 |
|
20 |
} // end of check for query having posts |
21 |
|
22 |
// use reset postdata to restore orginal query
|
23 |
wp_reset_postdata(); |
24 |
|
25 |
?>
|
Es importante que aquí incluyas dos cosas:
- Una comprobación de que la consulta tenga entradas – no querrás mostrar un encabezado que no contenga ningún listado debajo.
-
wp_reset_postdata()
para resetear la consulta – siempre debes usar esto conWP_Query
.
7. El Segundo Loop
El segundo loop es casi idéntico al primero a excepción de los argumentos de la consulta:
1 |
<?php //second query - posts |
2 |
|
3 |
// Define the query
|
4 |
$args = array( |
5 |
'post_type' => 'post', |
6 |
'animal_cat' => $term->slug |
7 |
);
|
8 |
$query = new WP_Query( $args ); |
9 |
|
10 |
if ($query->have_posts()) { |
11 |
|
12 |
|
13 |
// output the term name in a heading tag
|
14 |
echo'<h2>Blog Posts About the ' . $term->name . ' Family</h2>'; |
15 |
|
16 |
// output the post titles in a list
|
17 |
echo '<ul>'; |
18 |
|
19 |
// Start the Loop
|
20 |
while ( $query->have_posts() ) : $query->the_post(); ?> |
21 |
|
22 |
<li class="animal-listing" id="post-<?php the_ID(); ?>"> |
23 |
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> |
24 |
</li>
|
25 |
|
26 |
<?php endwhile; |
27 |
|
28 |
echo '</ul>'; |
29 |
|
30 |
} // end of check for query having posts |
31 |
|
32 |
// use reset postdata to restore orginal query
|
33 |
wp_reset_postdata(); |
34 |
|
35 |
?>
|
Ahora guarda el archivo de tu plantilla y previsualizalo. Deberías ver dos listas, una para los animales y la otra para las entradas:



Resumen
Así es como creas una página de archivo para una taxonomía que liste las entradas según el su tipo. Podrías extender esta técnica para hacer más interesantes tus páginas de archivo:
- Variando el loop de manera que se muestre distinto contenido para cada tipo de entrada, por ejemplo mostrando una imagen destacada o un extracto para algunos tipos de entradas.
- Añadiendo estilos distintos para cada tipo de entrada.
- Cambiando el diseño de la página de manera que los archivos se sitúen unos al lado de otros o organizados en una retícula. Puedes ver un ejemplo de un sitio en el que hice esto en http://type-academy.co.uk/temperament-intro/
- Adaptar esta técnica a una categoría o archivo de una etiqueta alterando los argumentos de tu consulta.
¡Estoy seguro de que se te pueden ocurrir muchas más posibilidades!