web-dev-qa-db-fra.com

Comment personnaliser le modèle de catégorie?

Je ne suis même pas sûr qu'il soit possible de faire ce que j'essaie de faire. Je souhaite créer un modèle de catégorie personnalisé qui affiche les catégories enfants de la catégorie actuelle au lieu des publications de cette catégorie.

Je souhaite également garder la mise en page aussi proche que possible du modèle d'origine avec une vignette, un titre et un extrait. Je vais utiliser une image de catégorie personnalisée pour la vignette, le titre correspond au terme de catégorie enfant et, pour l'extrait, à la description de la catégorie.

Dans le modèle de catégorie d'origine, les publications sont présentées sous forme de grille et la boucle comporte un compteur permettant d'ouvrir et de fermer la "ligne" div après chaque publication (voir le code ci-dessous). catégories?

C'est le code que j'utilise pour obtenir mes catégories d'enfants:

<?php 
$cat = get_category( get_query_var( 'cat' ) );
$cat_id = $cat->cat_ID;
$child_categories=get_categories(
array( 'parent' => $cat_id )
);

foreach ( $child_categories as $child ) {
echo '<li>'.$child ->cat_name.'</li>';
}
?>

Mais au lieu d’une liste, j’en ai besoin au format suivant:

<article>
 <div class="category thumbnail">
<a href="" title=""><img alt="" src="" />
</a>
</div>
<div class="category-title">
        <h2 class="entry-title">Category Title</h2>
    </header><!-- .entry-header -->
    <div class="category description">
    </div><!-- .entry-content -->
</div>
</article>

... et voici le modèle de catégorie d'origine:

    <?php
/**
* The template for displaying category archive pages.
*
* @link https://codex.wordpress.org/Template_Hierarchy
*
* @package Codilight_Lite
*/

get_header(); ?>
<div id="content" class="site-content container <?php echo codilight_lite_sidebar_position(); ?>">
<div class="content-inside">
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">

<?php
if ( have_posts() ) : $count = 0; ?>

<header class="page-header">
<?php
the_archive_title( '<h1 class="page-title">', '</h1>' );
the_archive_description( '<div class="taxonomy-description">', '</div>' );
?>
</header><!-- .page-header -->

<?php
$layout_archive_posts = get_theme_mod( 'layout_archive_posts', 'grid' );
if ( $layout_archive_posts == 'grid' ) {
echo '<div class="block1 block1_grid">';
echo '<div class="row">';
while ( have_posts() ) : the_post();
$count++;
get_template_part( 'template-parts/content-grid' );
if ( $count % 2 == 0 ) {
echo '</div>';
echo '<div class="row">';
}
endwhile;
echo '</div>';
echo '</div>';
codilight_lite_custom_paginate();

} else {
echo '<div class="block1 block1_list">';
while ( have_posts() ) : the_post();
get_template_part( 'template-parts/content-list' );
endwhile;
codilight_lite_custom_paginate();
echo '</div>';
}
?>

<?php else : ?>

<?php get_template_part( 'template-parts/content', 'none' ); ?>

<?php endif; ?>

</main><!-- #main -->
</div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

La ligne get_template_part( 'template-parts/content-grid' ); est celle où elle renvoie au div "article" référencé ci-dessus.

categoriescustomization
1
jrcollins

Voici votre solution

<?php
/**
 * The template for displaying category archive pages.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package Codilight_Lite
 */
$cat = get_category( get_query_var( 'cat' ) );
$cat_id = $cat->cat_ID;
$child_categories=get_categories(
    array( 
        'parent' => $cat_id,
        // Uncomment the below line if you want empty category to appear on the list. 
        // 'hide_empty'   => 0
    )
);
get_header(); ?>
<div id="content" class="site-content container">
    <div class="content-inside">
    <div id="primary" class="content-area">
        <main id="main" class="site-main" role="main">
            <?php
            foreach ( $child_categories as $child ) { ?>
                <article>
                    <div class="category thumbnail">
                        <a href="" title=""><img alt="" src="" />
                        </a>
                    </div>
                    <div class="category-title">
                        <h2 class="entry-title"><?php echo $child ->cat_name;?></h2>
                        </header><!-- .entry-header -->
                        <div class="category description">
                            <?php echo $child ->description;?>
                        </div><!-- .entry-content -->
                    </div>
                </article>
            <?php
            }
            ?>
        </main><!-- #main -->
    </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Il suffit de copier et coller dans votre archive.php et vous êtes prêt à partir. J'espère que ça va vous aider.

1
CodeMascot