web-dev-qa-db-fra.com

Comment puis-je afficher les publications récentes d'une catégorie particulière dans mon en-tête?

Question: Affichage de la catégorie

J'essaie de créer un en-tête qui extrait les données des 3 publications les plus récentes d'une catégorie spécifique, en extrayant l'image associée à la publication la plus récente (s'il en existe une) à afficher. Je peux très bien créer le style, mais je ne sais pas comment référencer et extraire les informations sur le message. Je ne veux pas faire de boucle parce que je ne veux pas tous les messages.

Je pense à quelque chose dans ce sens.

POST IMAGE (recouvert du titre du dernier post d’une catégorie, qui est un lien vers cette catégorie, faisant éventuellement référence à la date et à l’heure du post). Dans ce cas, je souhaite simplement mettre des liens textuels vers le post juste avant. que dans la catégorie suivie par un troisième lien vers le post avant celui-ci.

Existe-t-il des balises spécifiques pour extraire les titres d'articles et peut-être de petits extraits d'articles et les afficher ainsi?

Précision: ce que je cherche à faire est de redessiner ma page principale afin que la partie supérieure soit divisée en quatre sections, en haut à gauche, en haut à droite, en bas à gauche et en bas à droite. Chacune de celles-ci sera l’image du poste le plus récent dans des catégories spécifiques superposées par un lien vers le poste le plus récent. Ensuite, une liste des deux prochains articles de la catégorie est fournie avec chacun d’eux. Le formatage est effectué via CSS, que je peux gérer, mais je ne sais pas comment extraire les publications de catégories spécifiques et comment extraire uniquement les trois plus récentes.

wp-querycategoriestheme-development
1
OscarGuy

Vous faites voulez "faire une boucle".

Dans votre en-tête, vous souhaitez créer une nouvelle requête pour ces trois publications et les parcourir sans perturber la requête principale dont vous avez besoin plus loin sur chaque page.

Voici une boucle standard appelant trois publications de votre catégorie:

$wpse_235359_query = new WP_Query( array( 

        'category_name' => 'your-category-slug',
        // should pull in posts from child categories too

        'posts_per_page' => 3 

    ) );

if ($wpse_235359_query->have_posts()) :

    while($wpse_235359_query->have_posts()) :
        $wpse_235359_query->the_post();

        /* show your post stuff here using standard
           template tags like the_title()
        */

    endwhile;

endif;

wp_reset_postdata();

L'appel de la fonction wp_reset_postdata à la fin de la requête met tout en place pour que le reste de votre page se comporte comme prévu.

Vous mettez cet extrait de code n'importe où dans vos fichiers de thème pour que vous souhaitiez afficher cet ensemble de publications. Cela peut être dans un thème enfant si vous basez votre thème sur un autre, ou dans les fichiers de thème principal si vous construisez le thème entier.

Modifier - ajouts à partir des commentaires pour raccourcir la liste des commentaires

Appelez la variable $wpse_235359_query comme bon vous semble. Utilisez l'extrait plusieurs fois avec différentes catégories si vous le souhaitez.

Placez-le où vous voulez en utilisant un thème enfant pour pouvoir toujours mettre à jour votre thème parent. Le thème enfant fonctionne en remplaçant les fichiers de modèle entiers dans le parent. Donc, vous copiez le header.php parent dans le thème enfant, vous le modifiez, et l'enfant header.php est utilisé par WP au lieu du header.php parent. Un appel à charger header.php cherchera toujours dans le thème enfant en premier.

Puis, modifiez le style de la première en utilisant HTML comme ceci:

<div>
    <span class="MainCategoryHeader">
    <a href="http://www.example.com/">Permalink One</a>
        </span>
    <span class="MainCategoryHeader">
        <a href="http://www.example.com/">Permalink Two</a>
    </span>
    <span class="MainCategoryHeader">
        <a href="http://www.example.com/">Permalink Three</a>
    </span>
</div>

Appliquez le CSS comme ceci:

.MainCategoryHeader:first-child a { 
    background-color: #FFFFFF; 
    color: #FFFF00; 
} 
.MainCategoryHeader a { 
    background-color: #FFFFFF; 
    color: #000000; 
}

Cependant, cela s’est éloigné de WordPress et du point principal de la question initiale. Si vous êtes heureux que la partie WordPress soit résolue, veuillez accepter la réponse, non seulement pour mon bénéfice, mais aussi pour garder le site en ordre.

0
Andy Macaulay-Brook