Créer une page “Contributeurs” sous WordPress pour valoriser vos auteurs

WP Channel est un projet multi-auteurs comme le souligne la page qui valorise les nombreux contributeurs.

Pour créer une telle page, nous aurons recours à un modèle de page et quelques fonctions PHP.

Étape n°1 – Création du modèle de page pour les contributeurs

À l’aide de votre éditeur de code favori, créez un nouveau fichier PHP dans le dossier de votre thème WordPress que vous nommerez template-contributors.php par exemple.

La déclaration d’un modèle de page passe par l’ajout d’une ligne de code.

/* Template Name: Contributeurs */

Étape n°2 – Récupération de la structure du thème

Chaque thème dispose de sa propre structure plus ou moins complexe. De base, on appelle header.php et footer.php mais cela ne suffit généralement pas. Il nous faut reprendre les sections et autres balises <div> présente dans le fichier page.php. Il est fort probable que votre thème intègre nativement un modèle taille large ou fullwidth – autrement dit, sans colonne latérale.

Reprenez donc cette structure en faisant un copier / coller puis supprimer tout ce qui trouve dans la boucle et elle avec, comme ceci :

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

CODE A SUPPRIMER Y COMPRIS L'OUVERTURE ET FERMETURE DE LA BOUCLE

<?php endwhile; else: ?>
      <p><?php _e('Sorry, no posts matched your criteria.', 'textdomain'); ?></p>
<?php endif; ?>

Étape n°3 – Lister les contributeurs

Maintenant que nous disposons de la structure de page, il nous faut lister les utilisateurs qui rédigent du contenu chez vous. C’est sans doute la partie la plus intéressante : les comptes utilisateurs de WordPress disposent de champs (site Web, Facebook, Twitter, etc.) que vous pourrez afficher ou non selon les situations.

Pour commencer, nous allons faire une requête du type WP_User_Query avec l’argument include. Ce dernier nous permet de choisir les utilisateurs que nous souhaitons lister par leur ID – pour obtenir l’ID d’un élément sous WordPress, survolez ce dernier puis notez le numéro affiché dans la barre de détails de votre navigateur.

Et là je sens qu’une question vous taraude l’esprit : pourquoi ne pas utiliser l’argument role ?

La réponse est simple : si comme moi vous avez des utilisateurs avec le rôle auteur et d’autres avec le rôle administrateur vous ne serez pas en mesure de tous les afficher. Et oui, cet argument est une chaîne et non un tableau… dommage ! Des techniques alternatives existeraient mais elles relèvent bien souvent de la bidouille à mon sens.

Voici donc le bout de code qu’il vous faudra adapter à votre sauce :

<?php
	$args = array (
		'include'	=> array( 3, 10, 8, 19, 18, 12, 21, 5 ),
	);

	$user_query = new WP_User_Query( $args );

	if ( ! empty( $user_query->results ) ) {
		foreach ( $user_query->results as $user ) { 
?>

	<article <?php post_class('post'); ?>>

		<?php echo get_avatar($user->ID); ?>

		<div class="entry">
			<h2><a title="<?php echo $user->display_name ?>" href="<?php echo get_author_posts_url($user->ID); ?>"><?php echo $user->display_name ?></a></h2>
			<p><?php echo $user->description ?></p>
		</div>
		<div class="entry-meta-footer">
			<span class="pull-left">
				<span class="author-post"><a rel="nofollow" title="<?php echo $user->display_name ?>" href="<?php echo get_author_posts_url($user->ID); ?>"><?php _e('See all posts', 'wpc'); ?></a></span>
			</span>
			<span class="pull-right">
				<a rel="nofollow" title="<?php _e('Website author', 'wpc'); ?>" href="<?php echo $user->user_url ?>"><span class="dashicons dashicons-admin-links"></span></a>
				<a rel="nofollow" title="<?php _e('Twitter author', 'wpc'); ?>" href="http://twitter.com/<?php echo $user->twitter ?>"><span class="dashicons dashicons-twitter"></span></a>
			</span>
		</div>

	</article>

	<?php }
	}
?>	

Pour ma part, j’affiche les éléments suivants :

• Le nom et le prénom, c’est le minimum que l’on puisse faire ;
• La description de l’auteur ;
• Son gravatar mais vous pourriez également utiliser un champ personnalisé ;
• Un lien vers sa page d’archive ;
• Des liens de réseaux sociaux ;

Résultat final

Je vous propose de télécharger le code que j’utilise pour ma propre page de contributeurs sur ce site. Cependant, il est important de noter qu’il repose sur les technologies HTML5, Twitter Bootstrap et Masonry.

Valoriser les auteurs de votre site est un élément essentiel à mon sens. Cela démontre le caractère collaboratif du Web alors faites de même !