Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Cómo mostrar solo la categoría secundaria en el bucle de entradas de WordPress

En nuestra experiencia, si añades muchas categorías a tus entradas de WordPress, las cosas pueden empezar a parecer un poco abarrotadas. Múltiples categorías, especialmente las categorías padre e hijo, pueden desordenar sus disposiciones y hacer que sea más difícil para los lectores encontrar lo que están buscando.

¿No sería más limpio mostrar solo la categoría secundaria de cada entrada?

Esta guía le mostrará cómo retocar el archivo de su tema de WordPress para mostrar solo las categorías secundarias en el bucle de entradas, dando a su blog un aspecto más ágil y fácil de usar.

Showing only child categories inside WordPress post loop

¿Por qué mostrar solo la categoría secundaria en el bucle de entradas de WordPress?

Al crear un blog en WordPress, puede organizar su contenido mediante categorías y etiquetas.

Para ayudar a los lectores a encontrar contenidos interesantes más rápidamente, puede incluso crear categorías secundarias (o subcategorías).

Por ejemplo, si tiene un blog de viajes, puede crear una categoría “Destinos” y luego categorías secundarias como “Europa”, “América” y “Australia”.

Por defecto, la mayoría de los temas de WordPress muestran todas las categorías padre e hijo de una entrada.

Displaying the child categories only in the WordPress post loop

Sin embargo, si utiliza muchas categorías, las páginas de su blog pueden parecer desordenadas y complicadas. También puede dificultar que los lectores encuentren la categoría que les interesa.

Por esa razón, puede que quiera ocultar las categorías genéricas de una entrada y mostrar solo las categorías secundarias. Dicho esto, veamos cómo mostrar solo las categorías secundarias en el bucle de entradas de WordPress.

Antes de editar un archivo de tema de WordPress: puntos clave que debe recordar

Esta guía está dirigida a personas que se sienten cómodas con el código y la edición de archivos de temas de WordPress. Aquí hay algunas cosas que debe hacer antes de seguir el tutorial:

  1. En primer lugar, tienes que conectar tu sitio web con FTP o abrir el gestor de archivos de tu alojamiento web para poder acceder a esos archivos.
  2. Si eres principiante, puedes consultar nuestra guía para principiantes sobre cómo pegar fragmentos de código de la web en WordPress para prepararte de antemano.
  3. Recomendamos crear una copia de seguridad o utilizar un sitio de ensayo para seguir este método. De este modo, si algo sale mal, su sitio activo no se verá afectado.

Por último, esta guía solo es aplicable a los temas clásicos de WordPress. Los temas en bloque tienen una estructura diferente para los archivos de temas.

Mostrar solo la categoría hija en el bucle de entradas de WordPress

En este tutorial, le mostraremos cómo editar el archivo de su tema utilizando el gestor de archivos de Bluehost. Pero independientemente de su proveedor de alojamiento, los pasos deben ser similares.

En primer lugar, acceda a su Escritorio Bluehost y navegue hasta la pestaña ‘Sitios web’. A continuación, haga clic en “Ajustes” en el sitio que desea editar.

Bluehost site settings

A continuación, desplácese hasta la sección Enlaces rápidos.

A continuación, haga clic en el botón “Gestión de archivos”.

Accessing a website's file manager in Bluehost

Se abrirá el gestor de archivos.

Ahora, tendrá que encontrar el código en el archivo de su tema que es responsable de mostrar las categorías. Puede empezar a hacerlo yendo a la carpeta public_html de su sitio wp-content ” themes la carpeta de su tema actual.

En esta etapa, es posible que tenga que abrir cada archivo y carpeta uno por uno para encontrar el archivo correcto para editar. Una cosa que puede hacer es tratar de encontrar código relacionado con la categoría, como has_category o get_the_category_list. Si los localiza, entonces debería estar en el archivo correcto.

Si no puede encontrar el archivo de plantilla adecuado, consulte nuestra hoja de trucos sobre la jerarquía de plantillas de WordPress y nuestra guía sobre cómo encontrar el archivo de tema adecuado para editar.

Si utilizas el tema Twenty Twenty-One, el archivo que debes buscar es el archivo template-tags dentro de la carpeta ‘inc’. Cuando lo encuentres, haz clic con el botón derecho en el archivo y selecciona “Editar”.

Opening the inc folder for the Twenty Twenty One theme in Bluehost file manager

En el archivo, este es el fragmento de código responsable de mostrar las categorías y etiquetas:

if ( has_category() || has_tag() ) {

				echo '<div class="post-taxonomies">';

				$categories_list = get_the_category_list( wp_get_list_item_separator() );
				if ( $categories_list ) {
					printf(
						/* translators: %s: List of categories. */
						'<span class="cat-links">' . esc_html__( 'Categorized as %s', 'twentytwentyone' ) . ' </span>',
						$categories_list // phpcs:ignore WordPress.Security.EscapeOutput
					);
				}

				$tags_list = get_the_tag_list( '', wp_get_list_item_separator() );
				if ( $tags_list && ! is_wp_error( $tags_list ) ) {
					printf(
						/* translators: %s: List of tags. */
						'<span class="tags-links">' . esc_html__( 'Tagged %s', 'twentytwentyone' ) . '</span>',
						$tags_list // phpcs:ignore WordPress.Security.EscapeOutput
					);
				}
				echo '</div>';
			}
		} else {

Ahora que has encontrado el código correcto, puedes sustituir todo ese fragmento de código por esto:

if ( has_category() || has_tag() ) {

    echo '<div class="post-taxonomies">';

    // Get the list of categories
    $categories = get_the_category();
    $child_cat_IDs = array(); // Array to store child category IDs
    $parent_cat_IDs = array(); // Array to store parent category IDs
 
    foreach ( $categories as $category ) {
        if ( $category->parent > 0 ) {
            $child_cat_IDs[] = $category->term_id; // Store the child category ID
        } else {
            $parent_cat_IDs[] = $category->term_id; // Store the parent category ID
        }
    }

    // Output child categories if there are any
    if ( !empty($child_cat_IDs) ) {
        $output = '<span class="cat-links">' . esc_html__( 'Categorized as ', 'twentytwentyone' ) . ' ';
        foreach ( $child_cat_IDs as $cat_id ) {
            $cat_link = get_category_link($cat_id);
            $cat_name = get_cat_name($cat_id);
            $output .= '<a href="' . esc_url($cat_link) . '">' . esc_html($cat_name) . '</a> ';
        }
        $output .= '</span>'; // Close the span tag after the loop
        echo $output; // Output the child category links

    // Output parent categories if there are no child categories
    } elseif ( !empty($parent_cat_IDs) ) {
        $output = '<span class="cat-links">' . esc_html__( 'Categorized as ', 'twentytwentyone' ) . ' ';
        foreach ( $parent_cat_IDs as $cat_id ) {
            $cat_link = get_category_link($cat_id);
            $cat_name = get_cat_name($cat_id);
            $output .= '<a href="' . esc_url($cat_link) . '">' . esc_html($cat_name) . '</a> ';
        }
        $output .= '</span>'; // Close the span tag after the loop
        echo $output; // Output the parent category links
    }

    // Handle tags
    $tags_list = get_the_tag_list('', wp_get_list_item_separator());
    if ( $tags_list && ! is_wp_error( $tags_list ) ) {
        printf(
            /* translators: %s: List of tags. */
            '<span class="tags-links">' . esc_html__( 'Tagged %s', 'twentytwentyone' ) . '</span>',
            $tags_list // phpcs:ignore WordPress.Security.EscapeOutput
        );
    }

    echo '</div>'; // Close post-taxonomies div
}
} else {

Este fragmento de código identifica primero todas las categorías asignadas a la entrada. A continuación, comprueba si cada categoría tiene un padre.

Si es así, significa que es una categoría secundaria y se añade a la lista de visualización. Las categorías superiores son omitidas, resultando en una visualización más limpia y específica de la categorización de sus entradas.

Este es el aspecto que debería tener al sustituir el código:

Making changes to the code that displays the category list in the post loop using the Bluehost file manager

Una vez hecho esto, sólo tienes que guardar los cambios.

Ahora, necesita visitar una entrada que tenga una o más categorías hijas. Verá que la categoría padre está oculta, y WordPress muestra ahora solo las categorías hijas.

Result of editing the code to display only the child category in the post loop

Esperamos que este artículo te haya ayudado a aprender cómo mostrar solo la categoría hija en tus entradas de WordPress. A continuación, puede que quieras ver nuestro artículo sobre cómo dar un estilo diferente a las categorías individuales en WordPress y nuestra guía para principiantes sobre cómo buscar por categoría en WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

10 comentariosDeja una respuesta

  1. Mike

    Managed it!

    foreach((get_the_category()) as $childcat) {
    $parentcat = $childcat->category_parent;
    if (cat_is_ancestor_of(10, $childcat)) {
    echo get_cat_name($parentcat);
    }
    }

  2. MIke

    I have three main categories and this code is successfully working in my single page loop to echo the actual selected category name.
    I now want to echo the parent of the category. The complication is that I have two layers below the main category (3 levels) and I want to echo the one level parent not the top level parent. It seems easy to echo the top parent, but I haven’t seem any code to return the child level category of a grandchild category?

  3. amnachohan

    Will it work outside the loop ?

  4. Marian Rick

    This is a great piece of code. Thanks a lot so far!

    For one of my projects I have to go further, and display only the lowest subcategory. So there may be three levels, (Forms -> Squares -> Big Squares). With this code all subs (Squares -> Big Squares) are displayed. How can I tell this code to repeat the process till only the last child is found and displayed?

    If you’ve got any solutions for that you are my heroes once again! Keep up your great work and blog!

  5. GoranJakovljevic

    is it possible to do this for 2 categories instead of single one?

  6. gashface

    How Would I include &orderby=ID ?

  7. Andus Beckus

    This is great thanks!

    But how do you display children of all categories and not just cat 10?

    Be great if someone could help with this. :)

    • Editorial Staff

      If you are trying to display a list of all child categories, then use wp_list_categories() function. It has parameters that allow you to list only child categories or only parent categories. But that doesn’t work for the case that we are talking about in this article.

      Administrador

      • Mattia

        great, but if I want to show not “category 10” but “current category”?

  8. Keith Davis

    Great snippets of info from you guys.
    I really have to start to get into this PHP.

    Great site boys and I notice that you are up to Pagerank 6!
    How about a couple of posts on upping your pagerank.

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.