Les « post format » sont trop souvent écartés lors de la mise en forme des articles. Pourtant ils offrent des possibilités quasiment infinies de personnalisation !

Et en voici la preuve. Lire la suite →

Niveau : intermédiaire
Code : PHP

Prérequis

Avant de s’engager dans ce vaste sujet, il est nécessaire d’identifier les différents fichiers sur lesquels nous allons travailler.

• Dans le répertoire de votre thème, vous devriez avoir un fichier functions.php. Gardez le sous la main car nous serons amenés à le modifier.
• Ensuite, il faudra modifier le fichier post.php situé dans le dossier wp-includes/ de WordPress.
• Repérez également le fichier qui affiche le contenu de vos articles, dans TwentyEleven il s’agit du fichier single.php

Je fais toujours des sauvegardes des fichiers sensibles avant de leur apporter des modifications et je vous conseille d’en faire autant !

À l’attaque

Vous avez surement remarqué la présence de ce cadre lorsque vous écrivez vos articles. Ils permettent d’attribuer un format à vos articles. Jusque là vous ne me direz rien d’exceptionnel, mais nous allons découvrir comment utiliser ces posts formats pour personnaliser nos articles.

Pour les besoins de l’article, nous allons créer deux posts formats radicalement différents.

Le premier affichera le titre et le contenu de l’article tandis que le second n’affichera que l’image à la une.

Un peu de code…

Ouvrez votre fichier functions.php de votre thème et recherchez la ligne suivante :

// La ligne qui nous intéresse !
add_theme_support( 'post-formats', array( 'aside', 'link', 'gallery', 'status', 'quote', 'image' ) );

Note : Sur la version 3.3.1 de WordPress, il s’agit de la ligne 104 !

Si vous ne la trouvez pas, n’hésitez pas à la copier coller dans ce même fichier pour pouvoir continuer le tutorial.

Cette fonction ajoute les « posts formats » spécifiés dans le tableau, soit 6 dans notre cas.

Comment personnaliser l’affichage ?

Dans le fichier single.php, on va pouvoir récupérer le post format associé à l’article et du même coup personnaliser l’affichage pour chacun de ces formats.

Voilà à quoi cela ressemble :

// En passant est la traduction de Aside.
// Si l'article est lié au post format aside
if ( has_post_format( 'aside' )){
// Le titre de mon article
the_title(); 

// Et son contenu
the_content();
}

// Fin du format Aside. On va débuter le format Image
elseif ( has_post_format( 'image' )){
//l'image à la une de mon article
if ( has_post_thumbnail() ) { the_post_thumbnail( '' ); }
}
// De même pour les autres...
 

Libre à vous d’afficher les informations de votre choix pour vos articles, je vous renvoie vers l’excellent Codex de WordPress !
N’oubliez pas d’ajouter les div de votre thème comme primary ou content !

Si vous voulez voir un exemple concret, regardez les 3 post format de ce site :
1/ Le premier pour afficher nos articles du blog comme celui que vous lisez actuellement
.
2/ Le second pour afficher les photos avec une mise en forme horizontale (exemple).
3/ Et le dernier pour afficher les photos avec une mise en forme verticale (exemple).

Je vous avais prévenu, ces post format sont au top et permettent de faire à peu près tout ce qu’on veut avec la mise en page, mais pas seulement.
Vous avez sûrement remarqué qu’on ne peut manipuler les post format qu’avec leur nom anglais et on va aller plus loin en créant de nouveaux post format bien de chez nous.

Créer ses propres post format

La première manipulation consiste à retrouver la fonction get_post_format_strings(). Vous avez 30 secondes sinon ce tutorial s’autodétruira !
Allez un coup de pouce, elle se trouve dans le fichier post.php (dans le répertoire wp-includes).
Voici la fonction telle qu’elle est définie par défaut :

function get_post_format_strings() {
	$strings = array(
		'standard' => _x( 'Standard', 'Post format' ), // Special case. any value that evals to false will be considered standard
		'aside'    => _x( 'Aside',    'Post format' ),
		'chat'     => _x( 'Chat',     'Post format' ),
		'gallery'  => _x( 'Gallery',  'Post format' ),
		'link'     => _x( 'Link',     'Post format' ),
		'image'    => _x( 'Image',    'Post format' ),
		'quote'    => _x( 'Quote',    'Post format' ),
		'status'   => _x( 'Status',   'Post format' ),
		'video'    => _x( 'Video',    'Post format' ),
		'audio'    => _x( 'Audio',    'Post format' ),
	);
	return $strings;
}

Nous allons simplement ajouter à la suite notre nouveau post format.

'video'    => _x( 'Video',    'Post format' ),
'audio'    => _x( 'Audio',    'Post format' ),
'nouveau'    => _x( 'Nouveau',    'Post format' ),
);

Le cas échéant, si vous souhaitez seulement en supprimer certain, vous pouvez très bien supprimer les lignes dans cette fonction.
Attention ! Si vous faites une mise à jour WordPress, ce fichier sera remplacé par un nouveau, sans vos modifications.
Il est impératif de répéter cette manipulation après chaque maj.

Ensuite, nous retournons éditer le fichier functions.php en ajoutant à la suite du tableau :

// On ajoute un nouveau post format => nouveau
add_theme_support( 'post-formats', array( 'aside', 'link', 'gallery', 'status', 'quote', 'image', 'nouveau' ) );

Veillez bien à ne pas avoir de doublons de cette fonction, sinon il y aura conflit entre les deux et la deuxième ne sera pas prise en compte.
Bizarre : il semblerait que le thème de base ne prenne pas en compte les post format chat, video et audio alors qu’ils sont définis dans le fichier post.php vu précédemment ; n’hésitez donc pas à les rajouter au passage

Quelques vérifications

Côté base de données, allons voir ce que ça donne.
La table wp_terms contient les post format. 
Vous devez au préalable enregistrer en brouillon ou publier votre article pour que le post format soit créé dans la base de données.

Nous allons donc vérifier qu’il existe bel et bien dans la base de données en exécutant cette requête (n’oubliez pas de remplacer « nouveau » par le nom de votre post format s’il est différent) :

SELECT *
FROM `wp_terms`
WHERE `name` = "post-format-nouveau"

Si vous obtenez un résultat c’est parfait ! Vous venez de créer un post format et vous pouvez l’utiliser
Dans le cas contraire, vous avez peut-être oublié l’une des étapes du dessus.

Mettre en page les post format dans la loop WordPress

Il est aussi possible de personnaliser l’affichage des post format dans les pages appelant les articles (recherche, archive, actualité, …).
Vous avez remarqué la présence dans le thème TwentyEleven des fichiers content-aside.php, content-gallery… Ce sont eux qu’il va falloir modifier.
Copiez / collez l’un d’eux et renommez-le en content-votrepostformat.php.
Pour reprendre notre exemple, il faudra créer un fichier content-nouveau.php.
Voilà, il ne vous reste plus qu’à modifier l’affichage

Concluons

Maintenant que vous vous êtes familiarisés avec cet outil fantastique, récapitulons ensemble ses avantages :

• Pouvoir personnaliser différemment ses articles selon le contenu,
• Associer à des articles d’une même catégorie plusieurs styles différents,
• Customiser le modèle d’un article selon son post-format dans la page actualité, recherche ou archive.

Et vous, utilisez-vous les post format ? Si oui ou non expliquez pourquoi !

See you space internaute

Retour au
blog

Partager vous rend heureux

Vous avez aimé ? Dites-le !

Tweeter