Il explique comment facilement ajouter une fonctionnalité de vote sur les articles sans recours à un plugin.

D’autant que les composants sont de très bonne facture offrant un design de qualité. C’est un très bon point de départ pour commencer un nouveau projet ! Ça vaut le coup d’oeil !

1. La gestion des pages & templates
2. L’utilisation de widgets
3. L’utilisation des metaboxes
4. L’utilisation des shortcodes
5. La gestion des menus

Nous allons voir dans cet article comment transformer un blog WordPress classique un outil complet de gestion de contenu.

Les pages & templates

Le cœur d’un site internet repose sur ses pages. Ce type de contenu est natif sur WordPress, cependant leur utilisation demeure simple. Afin d’arriver à des constructions de pages plus complexes et dynamiques, il convient de réaliser certains templates ainsi que d’ajouter des options permettant de configurer chaque page individuellement.

Vous trouverez toutes les informations nécessaires à l’utilisation des pages dans ce tutoriel :

WordPress CMS : les pages

Dans une approche CMS, la partie la plus importante est donc la gestion des pages.

De la classique page de contact et de présentation jusqu’à la page de portfolio et de blog, nous allons voir comment gérer nos différents types de contenus et comment les mettre en page.

Continuer

Les Widgets

Les widgets sont l’un des points de WordPress car ils permettent d’ajouter facilement des fonctionnalités dans un thème. Il en existe de toute sorte, du mur facebook au tweets, vous trouverez tous les widgets qu’il vous faut ici : http://wordpress.org/extend/plugins/tags/widget. Pour créer votre propre widget, vous pouvez vous référer à l’article suivant :

Tutoriel WordPress: Créer un widget

WordPress utilise nativement un système de « widgets » dans la barre latérale (la « sidebar »). Les widgets sont intiment liés au thème utilisé. Il est possible directement depuis un thème de créer son propre widget.

Nous allons donc voir ici, comment créer simplement un widget, qui affichera les photos d’un compte Flickr donné.

Continuer

Les Metaboxes

Les metaboxes sont un mécanisme très puissant permettant de configurer facilement un type de contenu spécifique. Cela se matérialise par l’ajout de « boîtes » dans l’interface d’administration d’un contenu où l’on peut saisir certaines informations que l’on pourra utiliser pour modifier le comportement de ce contenu.

Retrouvez toutes les clés pour créer vos propres metaboxes (de manière générique) dans cet article:

WordPress CMS : les metaboxes

Les metabox (ou boîtes à meta information) sont des données enregistrées pour un contenu spécifique (page ou article donné) et qui permettent par exemple de facilement modifier l’affichage du contenu selon les informations saisies.

Continuer

Les Shortcodes

Les shortcodes sont un moyen très pratique d’insérer du contenu dynamique au sein d’un contenu administrable (article ou page). Vous pouvez par exemple ajouter vos derniers tweets ou une sélection d’article (comme dans cet article) ou tout autre contenu dynamique.

Consultez ce tutoriel pour créer vos propres shortcodes !

Tip WordPress: utiliser les shortcodes

Les shortcodes sont des macros fonctions qui peuvent être utilisées aussi bien dans les contenus d’articles qu’au sein du code d’un fichier.

Ils permettent d’exécuter du code sans réellement toucher au code lui même, grâce à des mots-clés du type [mafonction param1=valeur1 param2=valeur2].

Continuer

Les Menus

Point indispensable dans tout site, les menus n’ont jamais été aussi facile à configurer dans WordPress. Il est possible d’en créer plusieurs, de les place aux emplacements souhaités dans le thème et même de paramétrer leur affichage.

Créer vos propres menus avec l’aide de ce tutoriel :

WordPress CMS : les menus

La navigation est l’un des points les plus importants d’un bon CMS. Depuis la version 3.0, il n’a jamais été aussi facile d’utiliser les menus dans WordPress.

Il est possible de créer autant de menus qu’on veut et d’y insérer autant d’entrées que souhaitées.

Continuer

De la classique page de contact et de présentation jusqu’à la page de portfolio et de blog, nous allons voir comment gérer nos différents types de contenus et comment les mettre en page.

La gestion des pages est présente depuis bien longtemps dans WordPress. Cependant, Si l’on ne veut pas réaliser uniquement de simples pages à partir de l’éditeur de texte, il faut recourir à l’utilisation de templates.

Les templates

Les templates sont des fichiers PHP dans votre thème permettant de modifier l’affichage d’une page. Pour déclarer un template, il suffit de créer un fichier PHP (basé sur le template de base de page.php par exemple) et d’insérer en haut le commentaire suivant :

<?php
/*
Template Name: Blog
*/
?>

Ceci indique à WordPress que la page est un template et qu’il peut donc être utilisé pour les pages.

Le template Blog

Voyons comment réaliser un template de page qui afficher les derniers articles.

Pour cela, le plus simple et propre de récupérer les articles du blog est de créer un nouvel objet WP_Query auquel nous allons passer nos arguments :

1. paged : permet de gérer la pagination
2. post_type : définit le type de contenu que l’on veut afficher (post pour articles)
3. posts_per_page : le nombre d’articles à afficher

La liste complète des options est disponible ici sur le codex WordPress.

<?php

get_header();

if(is_front_page())
	$_paged = "page";
else
	$_paged = "paged";

$paged = (get_query_var($_paged)) ? get_query_var($_paged) : 1;
$args = array(
	'paged' 			=> $paged,
	'post_type' 		=> 'post',
	'posts_per_page'	=> 12
);

$my_query = new WP_Query($args);

if ($my_query->have_posts()) : ?>

<div class="posts">
<?php while ($my_query->have_posts()) : $my_query->the_post();

	get_template_part("entry");

endwhile; ?>
</div>

<?php echo paginate_links();

get_footer();

Les shortcodes

Les templates de page, c’est bien, mais on peut aussi dynamiser la création de pages en permettant de constuire du contenu « à la volée » via l’utilisation de shortcodes.

Les shortcodes sont des fonctions très utiles pour la gestion des pages car elles permettent de mettre en page du contenu (qui peut être dynamique) de manière simple.

Colonnage

Vous pouvez créer des shortcodes pour afficher votre contenu sous forme de colonnes.

add_shortcode('display_one_third', 'display_one_third');
add_shortcode('display_two_third', 'display_two_third');

Voici un exemple de shortcode que vous pouvez insérer dans votre éditeur :

[display_one_third]Lorem ipsum ...[/display_one_third]
[display_two_third]Lorem ipsum ...[/display_two_third]

Voici le code des fonctions associées :

function display_one_third($atts, $content = null)
{
	$output = "<div class='one-third'>$content</div>";

	return do_shortcode($output);
}

function display_two_third($atts, $content = null)
{
	$output = "<div class='two-third'>$content</div>";

	return do_shortcode($output);
}

Et voici les déclarations CSS associées :

.one-third{ width:30.66%; float:left; margin-right:4% }
.two-third{ width:65.34%; float:left }

Voici une liste de suggestions de shortcodes qui vous permettront de gérer vos mises en pages plus facilement :

1. http://www.catswhocode.com/blog/10-super-useful-wordpress-shortcodes
2. http://smashingwall.com/wordpress/shortcodes-resources/
3. http://wp.tutsplus.com/articles/general/resource-roundup-20-creative-shortcodes-to-use-in-your-projects/

Grâce à l’utilisation de shortcodes, nous pouvons arriver à concevoir des pages complexes et dynamiques, telles que la page d’accueil de ce site :

Les metaboxes

Afin d’aller encore plus loin dans la personnalisation des pages (et des différents types de contenu en général), nous pouvons utiliser les meta-boxes.

Ce mécanisme permet d’ajouter pour un contenu spécifique des informations utiles, par exemple pour modifier l’affichage du contenu.

Retrouvez tout ce qu’il faut savoir sur cette page : WordPress : Les Meta Boxes

Page d’accueil

La différence fondamentale entre un blog et un site « normal » est que leur page d’accueil est différente. Afin d’avoir une page d’accueil particulière dans WordPress, il suffit de modifier cet options dans Réglages → Lecture.

Conclusion

En utilisant convenablement les templates, les shortcodes et les metaboxes, vous serez à même de réaliser de nombreuses mises en pages différentes et complexes pour gérer votre contenu.

En effet, il est vivement conseillé d’utiliser le système interne de WordPress pour gérer tous ses appels.

En effet, beaucoup (dont moi même il y a peu) utilisions un fichier php externe dans lequel nous chargions le fichier wp-load.php pour accéder à toutes les fonctionnalités de WordPress. Cela correspond plus à un hack qu’à un réel ajout.

Voyons donc comment bien utiliser le système natif de WordPress pour la gestion d’appels ajax.

Partie PHP

Hooks

Le système intégré de WordPress est basé sur les hooks. Il existe deux hooks dynamiques :

// Hook exécuté pour les utilisateurs non connectés
add_action("wp_ajax_my_ACTION_NAME", "my_ajax_function");

// Hook exécuté pour les utilisateurs connectés
add_action("wp_ajax_nopriv_ACTION_NAME", "my_ajax_function");

La partie ACTION_NAME correspond au paramètre qui sera passé par le javascript.

Localisation

Il faut ensuite pouvoir récupérer l’URL du script de WordPress admin-ajax.php. Pour cela, nous pouvons ajouter un paramètre lors de l’inclusion d’un script js, via la fonction wp_localize_script.

wp_enqueue_script('script', get_template_directory_uri().'/js/script.js', array('jquery'), '1.0', 1 );
wp_localize_script('script', 'ajax_var', array(
		'url' => admin_url('admin-ajax.php'),
		'nonce' => wp_create_nonce('ajax-nonce')
	)
);

Nous passons deux paramètres :

1. url : l’URL dynamique du fichier de WordPress (votre.site.com/wp-admin/admin-ajax.php)
2. nonce : une sécurité pour vérifier l’authenticité des requêtes

Et voici la fonction de callback des requêtes ajax :

function my_ajax_function()
{
	$nonce = $_POST['nonce'];

	if ( ! wp_verify_nonce( $nonce, 'ajax-nonce' ) )
		die ( 'Interdit !');

	// Traitement
	if(isset($_POST['param']))
	{
		// ...
		echo "valeur";
	}
	else
		...

	// important, pour bien récupérer la valeur de retour
	exit;
}

Après avoir vérifié que l’on récupère bien les paramètres que l’on a passés via notre script (et pas un autre, évitant ainsi des tentatives de corruption), il suffit d’effectuer le traitement désiré en pensant à bien renvoyer une valeur de retour pour le javascript.

Partie Javascript

Maintenant il suffit d’appeler grâce à jQuery par exemple, le script de WordPress admin-ajax.php et de lui passer les bons paramètres. On peut ainsi récupérer l’URL du fichier comme cela :

var url = ajax_var.url;
var nonce = ajax_var.nonce;

$("button").click(function(){
	$.ajax({
		type: "post",
		url: ajax_var.url,
		data: "action=ACTION_NAME&nonce="+ajax_var.nonce+"&param=valeur",
		success: function(msg){
			// Traitement
		}
	});
})

Conclusion

Ainsi, en utilisant le système interne de WordPress, nous nous assurons que nos appels ajax continueront à bien fonctionner avec les futures versions. L’utilisation des hooks est plus propre et plus efficace.

En fait, vous les utilisez à chaque fois sans que vous le sachiez vraiment. Les catégories, tags, format etc… sont autant de metaboxes.

Création d’une métabox

Nous allons donc voir comment créer des metaboxes de manière générique et en utiliser une pour mettre en page notre contenu. Nous allons par exemple créer une metabox pour choisir la disposition d’une page.

Définition d’une metabox

Une metabox est définie selon plusieurs paramètres :

1. Identifiant
2. Titre
3. Fonction de callback (d’affichage)
4. Le type de contenu pour lequel elle sera applicable (‘post’, ‘page’, ‘link’, ou ‘custom_post_type’)
5. L’emplacement (‘normal’, ‘advanced’, ou ‘side’)
6. La priorité (l’ordre d’affichage dans la page)
7. Les arguments à passer à la fonction de callback

Maintenant créez un fichier metabox_options.php et insérer le code suivant dedans :

<?php

$themename = "my_theme";
$metaboxes = array(
	'page_layout' => array(
		'title'			=> __('options', $themename),
		'applicableto'	=> 'page',
		'priority'		=> 'low',
		'location'		=> 'normal',
		'tabs'			=> array(
			'page_layout_options' => array(
				'title' 	=> __('layout', $themename),
				'fields' 	=> array(
					'layout_sidebar' => array(
						'title'			=> __('layout', $themename),
						'type' 			=> 'radio',
						'description'	=> __('choose page layout', $themename),
						'options'		=> array('full-width' => "<img src='".get_template_directory_uri().'/admin/img/full-width.png'."' alt='".__('full width', $themename)."' title='".__('full width', $themename)."' />", 'sidebar-content' => "<img src='".get_template_directory_uri().'/admin/img/sidebar-content.png'."' alt='".__('left sidebar', $themename)."' title='".__('left sidebar', $themename)."' />", 'content-sidebar' => "<img src='".get_template_directory_uri().'/admin/img/content-sidebar.png'."' alt='".__('right sidebar', $themename)."' title='".__('right sidebar', $themename)."' />")

					)
				)
			),
			'page_options' => array(
				'title' 	=> __('common options', $themename),
				'fields' 	=> array(
					'display_tagline' => array(
						'title'			=> __('hide page title', $themename),
						'type' 			=> 'checkbox',
						'description'	=> '',
						'size'			=> ''
					)
				)
			)
		)
	)
);

Explications

Les options ci-dessus correspondent aux paramètres des metaboxes :

$metaboxes = array(
	'metabox_ID' => array(
		'title' 	=> 'Titre',
		'applicableto'	=> 'Type de contenu applicable',
		'priority'		=> 'Priorité',
		'location'		=> 'Emplacement de la metabox',
		'tabs'			=> array(
			'identifiant Onglet' => array(
				'title'		=> 'Titre du premier onglet de la metabox',
				'fields'	=> array(
					'identifiant Champ' => array(
						'titre champ'	=> 'Titre du champ',
						'type' 			=> 'Type de champ',
						'description'	=> 'Description du champ',
						'options'		=> '(optionel) Valeur des options si type radio'
					)
				)
			)
		)
	)
);

Les libellés et descriptions utilisent gettext pour l’internationalisation.

Chargement des options

Dans un autre fichier metabox_framework.php, insérer le code suivant :

include_once("metaboxes_options.php");

add_action( 'admin_init', 'add_metaboxes' );

function add_metaboxes()
{
	if(!empty($metaboxes))
	{
		foreach($metaboxes as $id => $metabox)
		{
			add_meta_box($id, $metabox['title'], 'show_metaboxes', $metabox['applicableto'], $metabox['location'], $metabox['priority'], $id);
		}
	}
}

Après avoir inclus nos options, nous allons ajouter les métaboxes (informer WordPress de le faire pour nous via la fonction add_action).

Affichage des metaboxes

Maintenant que nos metaboxes sont créées, il nous faut les afficher dans la page d’administration du contenu adéquat.

Toujours dans ce dernier fichier, ajouter une fonction show_metaboxes() avec le code suivant :

<?php

function show_metaboxes($post, $args)
{
	global $themename, $metaboxes;

	$custom = get_post_custom($post->ID);
	$tabs = $metaboxes[$args['id']]['tabs'];

	/** Wrapper **/

	$output = "<div class='metabox-wrapper'>";

	/** Nonce **/
	$output .= '<input type="hidden" name="custom_meta_box_nonce" value="'.wp_create_nonce(basename(__FILE__)).'" />';

	/** Menu **/
	$output .= '<div id="page_options_menu"><ul>';

	$i = 0;
	foreach($tabs as $id => $tab)
	{
		$output .= '<li';
		if($i == 0)
			$output .= ' class="active"';
		$output .= '><a href="#'.$id.'">'.__($tab['title'], $themename).'</a></li>';
		$i++;
	}

	$output .= '</ul></div>';

	/** Content **/
	$output .= '<div id="page_options_content"><div class="inner">';

	foreach($tabs as $id => $tab)
	{
		$fields = $tab['fields'];

		$output .= '<div class="option_content" id="'.$id.'">';

		$iter = 0;

		foreach($fields as $id => $field)
		{
			$output .= '<div class="row">
					<div class="label">
						<label for="'.$id.'">'.$field['title'].'</label>';
						if(!empty($field['description']))
							$output .= '<small>'.$field['description'].'</small>';
					$output .= '</div>
					<div class="value">';

			switch($field['type'])
			{
				case "text":
					$output .= '<input type="text" id="'.$id.'" name="'.$id.'" value="'.$custom[$id][0].'" size="'.$field['size'].'" />';
				break;

				case "checkbox":
					$output .= '<input type="checkbox" id="'.$id.'" name="'.$id.'" size="'.$field['size'].'"';
					if($custom[$id][0] == "on") $output .= " checked='checked'";
					$output .= '/>';
				break;

				case "radio":
					$output .= "<div class='green_block'>";

					$val = $custom[$id][0];
					$radio_id = $id;

					foreach($field['options'] as $id => $label) :
						if($val == $id) $checked = ' checked="checked"';
						else $checked = "";
						$output .= "<div class='radio-option'><label for='".$id."_$iter'>".$label."</label><input$checked type='radio' name='".$radio_id."' value='".$id."' id='".$id."_$iter' /></div>";
					endforeach;
					$output .= "</div>";
				break;
			}

			$output .= '</div></div>';

			$iter++;
		}
		$output .= '</div>';
	}

	$output .= '</div></div><div class="clear"></div></div>';

	echo $output;
}

Explications

Il y a plusieurs parties importantes dans ce code.

Nous allons dans un premier temps générer un nonce, une sécurité permettant de vérifier ensuite que notre code a bien l’autorisation d’enregistrer ces informations. Puis nous allons récupérer les données déjà associées à notre contenu :

$custom = get_post_custom($post->ID);
$tabs = $metaboxes[$args['id']]['tabs'];

/** Nonce **/
$output .= '<input type="hidden" name="custom_meta_box_nonce" value="'.wp_create_nonce(basename(__FILE__)).'" />';

$args['id'] est le dernier paramètre que l’on a passé à la fonction add_metabox et qui nous permet ici de récupérer les onglets de la bonne metabox.

Ensuite, nous allons parcourir deux fois (ceci pourrait être optimisé pour n’être fait qu’une seule fois) nos onglets pour d’une part construire le menu (les onglets) et ensuite le formulaire associé.

Nous faisons un switch pour afficher le contenu adéquat en fonction du type d’élément souhaité :

switch($field['type'])
{
	case "text":
		//
	break;

	case "checkbox":
		//
	break;

	...
}

Nous aurons donc quelque qui ressemble à cela :

Sauvegarde des metaboxes

Enfin, nous allons sauvegarder toutes nos informations en créant la fonction save_metaboxes.

add_action( 'save_post', 'save_metaboxes' );

function save_metaboxes($post_id)
{
	global $themename, $metaboxes;

	// verify nonce
	if (!wp_verify_nonce($_POST['custom_meta_box_nonce'], basename(__FILE__)))
		return $post_id;

	// check autosave
	if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE)
		return $post_id;

	// check permissions
	if ('page' == $_POST['post_type']) {
		if (!current_user_can('edit_page', $post_id))
			return $post_id;
		} elseif (!current_user_can('edit_post', $post_id)) {
			return $post_id;
	}

	$post_type = get_post_type();

	// loop through fields and save the data
	foreach($metaboxes as $id => $metabox)
	{
		// check if metabox is applicable for current post type
		if($metabox['applicableto'] == $post_type)
		{
			$tabs = $metaboxes[$id]['tabs'];

			foreach($tabs as $id => $tab)
			{
				$fields = $tab['fields'];
				foreach($fields as $id => $field)
				{
					$old = get_post_meta($post_id, $id, true);
					$new = $_POST[$id];

					if ($new && $new != $old)
					{
						update_post_meta($post_id, $id, $new);
					}
					elseif ('' == $new && $old || !isset($_POST[$id]))
					{
						delete_post_meta($post_id, $id, $old);
					}
				}
			}
		}
	}
}

Plusieurs étapes intéressantes dans ce code :

1. On vérifie le nonce, afin de s’assurer que c’est bien notre script qui a commandé cette opération
2. On vérifie que WordPress n’est pas en train d’autosaver le post, ce qui peut causer des pertes de données
3. On s’assure que la personne connectée a les droits suffisants pour effectuer cette action
4. Enfin, on boucle sur les metaboxes
5. On vérifie qu’elles s’appliquent bien à ce type de contenu (get_post_type())
6. Si le meta existe, on l’ajoute ou le modifie
7. Sinon on le supprime (afin de ne pas polluer la base)

Utilisation des metaboxes dans les templates

Maintenant, nos metaboxes sont prêtes à être utilisées. Nous allons donc voir comment les exploiter au sein d’un template.

Pour cela, nous allons utiliser le template page.php pour modifier l’affichage du contenu.

Récupération des metas de la page courante :

$options = get_post_custom($post->ID);

Puis ajuster l’affichage (inclure la sidebar ou non) :

<?php

$options = get_post_custom($post->ID);
$layout = $options['layout_sidebar'][0];

if(empty($layout))
	$layout = "content-sidebar";

get_header();

switch($layout)
{
	case "full-width":
		the_content();
	break;

	case "content-sidebar":
		the_content();
		get_sidebar();
	break;

	case "sidebar-content":
		get_sidebar();
		the_content();
	break;
}

get_footer();

Ce qui nous donnera selon les cas les affichages suivants :

Conclusion

Voilà un exemple concret et générique d’utilisation des metaboxes pour améliorer l’affichage du contenu. Vous pouvez ensuite ajouter autant de metaboxes que vous le souhaitez, simplement en rajoutant des options dans le fichier d’options, et les utiliser dans vos fichiers de template.

En règle générale, les templates sont appelés du plus spécifique au plus générique, par exemple page-slug.php sera appelé avant page-id.php lui même appelé avant page.php. Plus d’information sur WP Tuts.

Il est possible de créer autant de menus qu’on veut et d’y insérer autant d’entrées que souhaitées.

Activer le support des menus

Premièrement, il faut activer l’utilisation des menus. Dans le fichier functions.php de votre thème, ajouter la ligne suivante :

add_theme_support( 'menus' );

Définir l’emplacement des menus

Première étape, il va s’agir de choisir où insérer nos menus. En règle générale, on ajoute un menu principal en haut de page, un deuxième sous menu dans une sidebar et peut être un dernier menu pour le footer.

Enregistrement d’un menu

Nous allons ensuite enregistrer nos différents menus auprès de WordPress. Toujours dans le fichier functions.php, insérez le code suivant :

register_nav_menu( 'main_navigation', 'Navigation principale' );
register_nav_menu( 'sidebar_navigation', 'Navigation secondaire' );
register_nav_menu( 'footer_navigation', 'Navigation tertiaire' );

Ceci nous permet de configurer trois zones de menus pour notre thème. On peut les visualiser dans Apparence → Menus.

Insertion des menus dans le thème

Maintenant il ne reste plus qu’à insérer nos menus aux endroits où l’on souhaite les voir.

Prenons l’exemple du menu principal, nous allons l’insérer dans le fichier header.php.

<?php
if (has_nav_menu('main_navigation')){
	wp_nav_menu(
		array(
			'container' 		=> 'nav';
			'container_class' 	=> 'main-menu',
			'theme_location' 	=> 'main_navigation'
		)
	);
} else {
	// En cas d'absence de menu
}
?>

En premier lieu, nous vérifions que le menu a bien été déclaré, puis nous définissons les paramètres du menu :

• container: définit le « wrapper » utilisé autour de la liste du menu (ie < nav >)
• container_class : définit la classe à ajouter au container (pour le css)
• theme_location : définit à quel zone de menu se rattacher

theme_location est l’option la plus importante, car c’est elle qui va définir la zone à laquelle rattacher ce menu (préalablement déclaré avec register_nav()).

Il en va de même pour les autres menus (sidebar et footer).

Créer les menus et ajouter des entrées

Nos menus bien enregistrés, il suffit de se rendre dans la page d’administration des menus pour créer les différents menus.

Pour cela il suffit de créer trois menus dans la zone de droite en spécifiant un nom puis de les associer aux zones que nous avons définies (Navigation Principale, Secondaire et Tertiaire), dans la zone de gauche.

Ensuite, il n’y a plus qu’à ajouter des entrées au menu via drag & drop.

Pour ajouter une description à un menu, pensez à afficher le champ description, caché par défaut, dans les options de l’écran.

Modifier le code html d’un menu

Il est possible de modifier le code HTML généré par WordPress par défaut pour un menu.

Pour cela, il faut rajouter une option lors de l’insertion du menu :

wp_nav_menu(
	array(
		'walker' => new description_walker()
	)
);

Ensuite il faut surcharger la classe description_walker avec la méthode start_el dans notre fichier functions.php, par exemple avec :

class description_walker extends Walker_Nav_Menu
{
	function start_el(&$output, $item, $depth, $args)
	{
		global $wp_query, $themename;
		$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

		$class_names = $value = '';

		$classes = empty( $item->classes ) ? array() : (array) $item->classes;

		$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
		$class_names = ' class="'. esc_attr( $class_names ) . '"';

		$output .= $indent . '<li id="menu-item-'. $item->ID . '"' . $value . $class_names .'>';

		$attributes  = ! empty( $item->attr_title ) ? ' title="'  . esc_attr( $item->attr_title ) .'"' : '';
		$attributes .= ! empty( $item->target )     ? ' target="' . esc_attr( $item->target     ) .'"' : '';
		$attributes .= ! empty( $item->xfn )        ? ' rel="'    . esc_attr( $item->xfn        ) .'"' : '';
		$attributes .= ! empty( $item->url )        ? ' href="'   . esc_attr( $item->url        ) .'"' : '';

		$item_output = $args->before;
		$item_output .= '<a'. $attributes .'><span class="icon"></span>';
		$item_output .= $args->link_before .$prepend.apply_filters( 'the_title', $item->title, $item->ID ).$append;
		$item_output .= "</a>";
		$item_output .= $args->after;

		$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
	}
}

Plus d’informations ici : http://codex.wordpress.org/Function_Reference/Walker_Class

Modifier les classes css du menu

Il est également possible d’ajouter des classes CSS à une entrée de menu en utilisant le hook nav_menu_css_class :

add_filter('nav_menu_css_class', 'add_custom_classes');

function add_custom_classes($classes, $item)
{
    if($item->title == "Blog")
	{
        $classes[] = "my_custom_class";
    }

    return $classes;
}

Conclusion

A partir de là, vous pouvez créer autant de menus que vous le souhaitez, et les placer à l’endroit que vous désirez dans votre thème.

Il existe deux types de hook dans WordPress :

• Les actions
• Les filtres

Les actions

Tout au long du processus de construction d’une page, WordPress place des « hooks » permettant aux développeurs d’ajouter des fonctionnalités à une étape particulière. Ainsi il est facile d’enrichir le processus avec nos propres fonctions.

Exemple simple, l’action « save_post » permet de réaliser des actions supplémentaires lors de la sauvegarde d’un post (article, page ou autre). C’est par cet intermédiaire que l’on pourra sauvegarder nos méta informations (metaboxes).

Voici certaines des actions importantes :

• after_setup_theme
• wp_footer
• wp_head
• admin_head
• admin_enqueue_scripts
• pre_get_posts
• …

Voyons comment facilement utiliser un hook pour ajouter le code Google Analytics dans le footer de votre thème.

Exemple avec wp_footer

Dans un fichier comme functions.php par exemple, ajoutez :

add_action('wp_footer', 'add_google_analytics');

Puis créez la fonction add_google_analytics :

function add_google_analytics()
{
	$ga = get_option('google_analytics');
	if(!empty($ga))
		echo stripslashes($ga);
}

Nous aurions très bien pu ajouter ce code directement dans le fichier footer.php. Mais ici, le code est sorti du template, ce qui est plus lisible, maintenable et réutilisable.

Les filtres

Le principe des filtres est de modifier une donnée construite par WordPress avant de l’afficher.

Voici certains filtres utiles :

• body_class
• the_content
• wp_title
• excerpt_length
• …

Le filtre the_content va permettre de modifier le contenu d’un post avant de l’afficher. Très utile si vous avez des remplacements de chaînes à faire.

Voyons par exemple comment modifier le [...] présent par défaut à la fin des extraits d’articles.

Exemple avec get_the_excerpt

add_filter('get_the_excerpt', 'new_excerpt_hellip');

La différence avec les actions, c’est le ou les paramètres passés à notre fonction qui vont nous permettre de modifier leur valeur avant de les afficher.

function new_excerpt_hellip($text)
{
   return str_replace('[...]', '...', $text);
}

Conclusion

Les hooks sont un très moyen de modifier le comportement de WordPress selon nos besoins afin soit d’y ajouter de nouvelles fonctionnalités au travers des actions ou simplement d’altérer certaines de ses méthodes via les filtres.

Il est donc vivement recommandé de les utiliser plutôt que d’intervenir directement dans les templates de fichier.