Comment ajouter des classes paires / impaires à votre publication dans les thèmes WordPress

Voulez-vous ajouter des classes impaires et impaires aux publications dans votre thème WordPress? Ajouter une classe impaire et paire vous permet de styler différemment chaque article. Dans cet article, nous allons vous montrer comment ajouter une classe impair / pair à votre message dans les thèmes WordPress..

Pourquoi ajouter des classes impaires / paires à vos publications dans les thèmes WordPress?

De nombreux thèmes WordPress utilisent une classe ancienne ou même une classe pour les commentaires WordPress. Il aide les utilisateurs à visualiser où un commentaire se termine et le suivant commence..

De même, vous pouvez utiliser cette technique pour vos publications WordPress. Il semble esthétique et aide les utilisateurs à numériser rapidement des pages avec beaucoup de contenu. C'est particulièrement utile pour la page d'accueil des sites de magazines ou d'actualités.

Cela dit, voyons comment ajouter une classe impair et pair à vos messages dans le thème WordPress..

Ajout de classes impaires / paires aux articles dans le thème WordPress

WordPress génère des classes CSS par défaut et les ajoute à différents éléments de votre site Web à la volée. Ces classes CSS aident les développeurs de plugins et de thèmes à ajouter leurs propres styles pour différents éléments..

WordPress est également livré avec une fonction appelée post_class, qui est utilisé par les développeurs de thèmes pour ajouter des classes à publier un élément. Voir notre guide sur la façon de styler différemment chaque publication WordPress.

le post_class est également un filtre, ce qui signifie que vous pouvez y ajouter vos propres fonctions. C'est exactement ce que nous allons faire ici.

Ajoutez simplement ce code au fichier functions.php de votre thème ou à un plugin spécifique au site..

 function oddeven_post_class ($ classes) global $ classe_ courante; $ classes [] = $ current_class; $ current_class = ($ current_class == 'impair')? 'même bizarre'; retourne $ classes;  add_filter ('post_class', 'oddeven_post_class'); global $ current_class; $ current_class = 'impair'; 

Cette fonction ajoute simplement impair au premier post, puis pair, et ainsi de suite.

Vous pouvez trouver les classes impaires et paires dans le code source de votre site. Il suffit de prendre la souris pour un titre de publication, puis faites un clic droit pour sélectionner inspecter ou inspecter élément.

Maintenant que vous avez ajouté des classes paires et impaires à vos publications. L'étape suivante consiste à les styler à l'aide de CSS. Vous pouvez ajouter votre CSS personnalisé à la feuille de style de votre thème enfant ou en utilisant le plugin Simple Custom CSS.

Voici un exemple de CSS que vous pouvez utiliser comme point de départ:

 .même background: # f0f8ff;  .odd background: # f4f4fb;  

Voici à quoi cela ressemblait sur notre site de test:

Si vous ne savez pas comment utiliser CSS, vous voudrez peut-être consulter CSS Hero. Il vous permet d'ajouter du CSS à n'importe quelle partie de votre site WordPress sans écrire de code..

Nous espérons que cet article vous a aidé à apprendre à ajouter une classe impair / pair à vos messages dans les thèmes WordPress. Vous pouvez également consulter notre guide sur la manière de styliser la mise en page de vos commentaires WordPress.

Si vous avez aimé cet article, abonnez-vous à nos tutoriels vidéo sur la chaîne YouTube pour WordPress. Vous pouvez aussi nous trouver sur Twitter et Facebook.