Tuto : Connaitre le template en cours sous forme de petit plugin

Afin de vous aider dans le développement de votre thème, je vous propose un tutoriel pour réaliser en quelques lignes un plugin qui vous permettra d’afficher le template de page en cours.

La problématique : Comment connaitre la page de template actuellement utilisée quand on ne maitrise pas entièrement le template hierarchy ?

Afin de connaitre la page de template utilisée par WordPress, il suffit de vous reporter au Template Hierarchy WordPress sur le Codex. Mais généralement le schéma fait peur aux débutants.

Voici en quelques lignes comment afficher le template actuellement utilisé, affiché dans l’admin bar, ainsi que le post type en cours (post, page, custom type) et le nombre de requêtes et le temps d’execution de la page. (Pour les pressés le code entier se trouve à la fin de l’article)

1. Créer le dossier du plugin et le fichier

Pour commencer, créez un dossier wp-simple-debug dans votre dossier /wp-content/plugins/ de votre installation WordPress. A l’intérieur créez un fichier wp-simple-debug.php et ouvrez-le avec votre éditeur de code préféré.

2. Initialiser le plugin

Pensez à aller activer votre plugin dans votre administration WordPress (Menu Extensions) afin de pouvoir tester votre plugin.

3. Ajouter un menu dans la barre d’administration

Le meilleur endroit pour afficher le template en cours, c’est dans l’admin bar en haut de votre site.

Pour cela nous allons utiliser la fonction WordPress $wp_admin_bar->add_node(). Plus d’informations sur le Codex WordPress.

Nous allons ajouter 4 nodes : l’indication “Debug info” qui sera l’entête du sous menu, une entrée pour afficher le template, une pour le type de publication en cours (page, post, custom …) et le nombre de requêtes exécutées. Voici le code :

function create_node_toolbar($wp_admin_bar) {

global $wp_admin_bar;

$debug_args = array(
 'id' => 'debug_info',
 'title' => 'Debug info',
 'parent' => false
 );

$current_file_args = array(
 'id' => 'current_file',
 'title' => 'Current theme file : ' . $GLOBALS['current_theme_template'],
 'parent' => 'debug_info'
 );

$current_post_type = array(
 'id' => 'current_post_type',
 'title' => 'Current Post type : ' . get_post_type(),
 'parent' => 'debug_info'
 );

$number_queries_args = array(
 'id' => 'num_queries',
 'title' => get_num_queries().' queries in '. timer_stop(0) .' seconds',
 'parent' => 'debug_info'
 );

$wp_admin_bar->add_node($debug_args);
 $wp_admin_bar->add_node($current_file_args);
 $wp_admin_bar->add_node($current_post_type);
 $wp_admin_bar->add_node($number_queries_args);
 }

add_action( 'admin_bar_menu', 'create_node_toolbar', 999 );

Vous noterez que nous empaquetons la fonction à l’appel de la fonction WordPress admin_bar_menu. Il faut comprendre ici que vous indiquez à WordPress d’exécuter ce code à un moment précis : le moment ou WordPress va iniatiliser le menu d’admin. On intercepte la fonction pour y ajouter notre menu.

$GLOBALS[‘current_theme_template’] n’est pas encore défini, donc ce code seul ne fonctionnera pas.

4. Le code pour afficher le template

Maintenant que le menu est en place. Il faut que l’on écrive la fonction qui va trouver le template actuellement utilisé. WordPress lui le sait déjà, puisqu’il l’appelle. Donc il nous suffit de trouver la bonne valeur.

function define_current_theme_file( $template ) {
 $GLOBALS['current_theme_template'] = basename($template);
 return $template;
 }

add_action('template_include', 'define_current_theme_file', 1000);

Ici encore, nous empaquetons la fonction pour qu’elle soit appelée au moment ou WordPress va inclure le template. Ces quelques lignes s’occupent de récupérer le nom de fichier utilisé.

5. Aller plus loin avec les actions WordPress

Vous retrouverez régulièrement cette façon de faire dans les plugins WordPress : faire quelque chose à un moment précis. WordPress effectue des centaines d’actions avant d’afficher une page, et vous pouvez modifier ces actions via des plugins à volonté. On les appelle aussi des hooks (crochets). Vous pouvez consulter la liste des actions depuis le Codex WordPress.

6. Code complet et téléchargement du plugin

Merci à @thierrylemoulec pour ce petit plugin très utile.

Voici le code complet :

<?php
/**
 * @package wp_simple_debug
 * @version 0.2
 */
/*
Plugin Name: WP Simple debug admin info
Plugin URI:
Description: This plugin show a custom debug info menu in the admin bar for easing debugging.
Author: Thierry Le Moulec
Version: 0.2
Author URI: http://thry.me/
*/

if(!is_admin()){

function define_current_theme_file( $template ) {
 $GLOBALS['current_theme_template'] = basename($template);
 return $template;
 }

add_action('template_include', 'define_current_theme_file', 1000);

/**
 * This function will create a new node in the admin toolbar using $wp_admin_bar->add_node
 * @return null
 */
 function create_node_toolbar($wp_admin_bar) {

global $wp_admin_bar;

$debug_args = array(
 'id' => 'debug_info',
 'title' => 'Debug info',
 'parent' => false
 );

$current_file_args = array(
 'id' => 'current_file',
 'title' => 'Current theme file : ' . $GLOBALS['current_theme_template'],
 'parent' => 'debug_info'
 );

$current_post_type = array(
 'id' => 'current_post_type',
 'title' => 'Current Post type : ' . get_post_type(),
 'parent' => 'debug_info'
 );

$number_queries_args = array(
 'id' => 'num_queries',
 'title' => get_num_queries().' queries in '. timer_stop(0) .' seconds',
 'parent' => 'debug_info'
 );

$wp_admin_bar->add_node($debug_args);
 $wp_admin_bar->add_node($current_file_args);
 $wp_admin_bar->add_node($current_post_type);
 $wp_admin_bar->add_node($number_queries_args);
 }

add_action( 'admin_bar_menu', 'create_node_toolbar', 999 );
}

?>

Pour les flémmards, vous pouvez aussi directement télecharger le plugin :

wp-simple-debug.