Contenu principal
« Labyrint barvaux » par Benoit.dessucy — Travail personnel. Sous licence CC BY-SA 3.0 via Wikimedia Commons.

Mon fil d’Ariane

Le 100ème. C’est mon 100ème article, alors plutôt que de faire un tutoriel ou sortir une extension, je vais vous donner quelque chose d’un peu différent cette fois : le fil d’Ariane que j’utilise dans mon thème professionnel (YAY!).

Mais… Pourquoi ?

Cette histoire de fil d’Ariane a débutée il y a longtemps avec un article de Daniel. Depuis, du chemin a bien évidemment été fait :) (il ne faut pas s’attendre à un fichier d’une centaine de lignes, on n’est pas loin du zéro supplémentaire).
Jusque là ce fil d’Ariane ne m’a jamais « perdu ». Il est très flexible mais je n’ai presque jamais besoin de la modifier (il y a des filtres).
Il est traduit en ricain, français et allemand, et est compatible avec WooCommerce (vous pouvez donc remplacer celui de WooCommerce par celui-ci).

Démonstration

Pour cela il suffit d’aller faire un tour sur WP Toulouse. Il est bien sûr visible dans les résultats de recherche de Google.

Utilisation

Il y a 3 étapes :

  1. Tout d’abord il faut glisser tous les fichiers du zip dans votre thème : je suis parti du principe qu’il s’agit d’un thème enfant.
  2. Dans le fichier functions.php de votre thème, ajouter :
    include( get_stylesheet_directory() . '/functions-breadcrumb.php' );
  3. Dans un de vos templates (header.php ou index.php par exemple) ajouter ceci là où vous voulez faire apparaitre le fil d’Ariane :
    get_template_part( 'breadcrumb' );

Il y a donc le fichier breadcrumb.php qui est le template du fil d’Ariane, functions-breadcrumb.php qui contient des utilitaires et quelques filtres, et les fichiers de langues.

Petit détail : le séparateur des « brins » utilise une fonte d’icônes. Je ne l’ai pas incluse mais ce séparateur est filtrable.
Si vous utilisez l’extension WordPress SEO, mon fil d’Ariane laissera la place à celui de Yoast si vous activez l’option.

Comportements particuliers

Le plus complexe est fait au niveau de la single. Selon si le type de contenu est hiérarchique ou a une taxonomie attachée, le résultat ne sera pas le même.
Plus simplement on peut dire :

  • Si le type de contenu est hiérarchique (comme les pages), ses « pages » parentes seront affichées dans le fil d’Ariane.
  • Si le type de contenu n’est pas hiérarchique (comme les articles) et a des termes de taxonomie (les catégories), ces termes seront affichés.

C’est ce dernier cas qui est un peu complexe.
Je prend l’exemple des articles. Il y a deux taxonomies : les catégories et les étiquettes (les tags pour ceux qui ne sont pas encore habitués), donc laquelle doit apparaitre ? À priori ça devrait être les catégories, mais comment savoir ? Et pour des événements ? Des lieux ? Des poneys ? Bref, on ne peut pas deviner, la boule de cristal n’est pas comprise dans le prix. Donc il faut faire un choix arbitraire, qui est « Je prend la première qui me tombe sous la main. ». L’ordre dépendra de comment ces taxonomies ont été déclarées. Dans le cas des articles, c’est la taxonomie « catégorie » qui arrive en 1er, ça tombe bien. Mais bien sûr on ne peut pas toujours bien tomber, il y a donc évidemment un filtre au cas où il faudrait rectifier ;)

Pour la sélection des termes de taxonomie c’est un peu différent. Si on a une taxonomie non hiérarchique, on prend le premier et voilà, c’est donc la même logique. Mais si on a une taxonomie hiérarchique on peut se retrouver dans ce cas de figure, avec plusieurs « branches » :
Cat 1 > Cat 2 > Article.
Cat A > Cat B > Cat C > Article.
Dans ce cas, le fil d’Ariane va regarder chaque branche et prendra celle qui contient le plus de termes (ici A B C donc). Et si dans votre article vous n’avez coché que « Cat C », alors A et B apparaitront quand même automatiquement.

Et bien sûr tout ceci est également filtrable.

Autre comportement concernant spécifiquement les catégories cette fois : dans WordPress nous sommes obligés d’avoir au moins une catégorie attachée aux articles. Or si on n’a pas besoin de catégorie sur le site, on se retrouve bloqué avec cette catégorie par défaut. Ce serait bête de la faire apparaitre dans le fil d’Ariane, donc si le site ne comporte qu’une seule catégorie, elle n’apparaitra pas.

Personnalisations

Je ne vais pas détailler tous les filtres de ce fil d’Ariane car ils sont nombreux (13 filtres et 2 actions), mais je vais donner quelques exemples.

Filtrer le séparateur :

12345

add_filter( 'mash_breadcrumb_separator', 'my_breadcrumb_separator' );

function my_breadcrumb_separator() {
	return ' <span class="breadcrumb-separator" aria-hidden="true">></span> ';
}

Supprimer les lien vers l’accueil au début :

1

add_filter( 'mash_breadcrumb_home_label', '__return_false' );

Modifier les « brins » (les éléments) :

0102030405060708091011121314151617181920212223

add_filter( 'mash_breadcrumb_items', 'my_breadcrumb_items' );

function my_breadcrumb_items( $items ) {
	if ( whatever ) {
		return $items;
	}

	/*
	 * Provide an array with the following keys:
	 * "label":      (string) The link title (required).
	 * "url":        (string) The link URL (required).
	 * "title_attr": (string) The title attibute (required).
	 * "escaped":    (bool)   If true, won't `esc_html()` the label (facultative).
	 */

	$items[] = array(
		'label'      => 'Zora la rousse',
		'url'        => 'https://example.com/zora-la-rousse/',
		'title_attr' => '',
	);

	return $items;
}

Faire apparaitre une étiquette plutôt que les catégories sur la single d’un article :
Ici on filtre un tableau contenant des « taxonomy names ». Par exemple on devrait avoir ça par défaut pour un article :

1234

array(
	'category',
	'post_tag',
)

Pour que les étiquettes soient utilisées il faudra mettre la taxonomie en début de tableau, ou retourner un tableau ne contenant qu’elle.

123456789

add_filter( 'mash_breadcrumb_post_taxonomies', 'my_breadcrumb_post_taxonomies', 10, 2 );

function my_breadcrumb_post_taxonomies( $taxonomies, $current_item ) {
	if ( is_singular( 'post' ) ) {
		return array( 'post_tag' );
	}

	return $taxonomies;
}

Conclusion

J’espère que vous pourrez mettre ce fil d’Ariane en œuvre facilement et qu’il vous satisfera, le lien de téléchargement vous attend dans la sidebar. Pour ma part, comme dit plus haut, je n’ai pas de problèmes avec, il s’adapte facilement. Il faut vraiment des cas extrêmes sinon.
Il y a bien sûr des cas où il ne peut pas s’adapter, notamment quand on utilise des endpoints par exemple (on ne peut pas détecter leur existence), comme le fait WooCommerce, il faut utiliser les filtres dans ces cas.

PS pour @Raherian : ne regarde pas le code sinon tu vas avoir une attaque. Mais si vraiment tu y tiens, alors prévois un écran 27 pouces 4K orienté horizontalement.