Introduction
Quand vient le moment de penser à se positionner dans les moteurs de recherche, on pense immédiatement à SEO, pour “Search engine optimization“. Derrière ce nom barbare se cache bien l’un des principaux aspects de référencement par les moteurs de recherche, dont Google. Pour qu’un moteur de recherche puisse vous classer dans une certaine catégorie, il a besoin d’une liste de mots clés qu’il récupère de différentes manières, dont la simple lecture de l’URL.
Si l’URL de la page comporte certains mots comme “voyages“, le nom du type personnalisé dans cet exemple, le référencement est très clair. En même temps, si l’URL comporte des paramètres de recherches comme “?s=bern&travel_country=suisse“, alors là, il ne va pas comprendre le mot “travel_country“. La première règle du SEO va s’occuper de corriger ces URL pour les réécrire de manière plus lisible.
Petit rappel
Pour ceux d’entre vous qui me suivent depuis le début, nous avons créé un formulaire de recherche sur la page d’archives, avec Elementor. Celui-ci construit à la volée, un URL qui va filtrer les publications selon les critères demandés.
Le code ci-dessous va donner un URL qui ressemble à ceci :
https://www.fuyens.ch/voyages/?search=bern&travel_country=suisse&travel_month=janvier&travel_year=2010&travel_taxonomy=culturel&travel_order=desc
L’URL est constitué du nom de domaine, du type de publications et de tous les critères qui commence par un point d’interrogation, séparés par des “&“. Ce qui n’est pas très lisible et surtout, qui ne signifie pas grand chose aux yeux d’un moteur de recherche.
// Set up redirect url with query vars
$redirect_url = home_url('voyages' . '/');
$search_text ? $redirect_url .= rawurldecode('?search=' . $search_text) : $redirect_url .= rawurldecode('?search=');
$travel_country ? $redirect_url .= rawurldecode('&travel_country=' . $travel_country) : $redirect_url .= rawurldecode('travel_country=');
$travel_month ? $redirect_url .= rawurldecode('&travel_month=' . $travel_month) : $redirect_url .= rawurldecode('travel_month=');
$travel_year ? $redirect_url .= rawurldecode('&travel_year=' . $travel_year) : $redirect_url .= rawurldecode('travel_year=');
$travel_taxonomy ? $redirect_url .= rawurldecode('&travel_taxonomy=' . $travel_taxonomy) : $redirect_url .= rawurldecode('travel_taxonomy=');
$travel_order ? $redirect_url .= rawurldecode('&travel_order=' . $travel_order) : $redirect_url .= rawurldecode('travel_order=');Correction de l’URL
L’URL, une fois corrigé, devrait plutôt ressembler à ceci :
https://www.fuyens.ch/voyages/search/bern/country/suisse/month/janvier/year/2010/type/culturel/order/desc/
La plupart des développeurs, designers, informaticiens vont créer un site en anglais, parce que l’anglais est la langue du web en général. Dans un deuxième temps, le site et les publications sont traduites dans d’autres langues.
En français, on peut aussi traduire les mots en anglais, comme “country”. Fuyens.ch tient compte de ceci et utilise le plugin “Polylang” pour la traduction des URL de l’anglais vers le français. Mais ceci est un autre chapitre.
Voici le code pour corriger l’URL :
// Set up redirect url with query vars
$redirect_url = home_url('voyages') . '/' . 'search');
$search_text ? $redirect_url .= rawurldecode('/' . $search_text . '/') : $redirect_url .= rawurldecode('/');
$travel_country ? $redirect_url .= rawurldecode('country' . '/' . $travel_country . '/') : $redirect_url .= rawurldecode('country' . '/');
$travel_month ? $redirect_url .= rawurldecode('month' . '/' . $travel_month . '/') : $redirect_url .= rawurldecode('month' . '/');
$travel_year ? $redirect_url .= rawurldecode('year' . '/' . $travel_year . '/') : $redirect_url .= rawurldecode('year' . '/');
$travel_taxonomy ? $redirect_url .= rawurldecode('type' . '/' . $travel_taxonomy . '/') : $redirect_url .= rawurldecode('type' . '/');
$travel_order ? $redirect_url .= rawurldecode('order' . '/' . $travel_order . '/') : $redirect_url .= rawurldecode('order' . '/');Réécriture de l’URL
Maintenant, si la syntaxe de l’URL ressemble à ceci, WordPress ne va rien y comprendre et ouvrir une page d’erreur 404, page non trouvée.
Pour que WordPress comprenne votre requête, il va falloir la corriger pour revenir à ce qui était initialement écrit. Et oui, l’URL a été corrigé une fois pour que la lecture soit plus agréable aux êtres humains que nous sommes, ainsi qu’aux moteurs de référencement qui aiment aussi les mots plutôt que des syntaxes, puis doit revenir dans sa forme primaire pour que WordPress puisse rediriger le visiteur proprement sur la bonne page.
Pour ceci, WordPress a prévu une fonction dont le nom, “add_rewrite_rule“, parle d’elle-même.
Dans le code ci-dessous, quelques points importants :
- La règle de réécriture s’exécute au chargement initial du site, sur l’action “init“.
- La règle de réécriture doit toujours commencer par une fonction de remise à zéro appelée “flush_rewrite_rules“.
- Mis à part la ligne 5, seuls les lignes 15 et 16 sont essentiels. Tout le reste n’est que commentaires. En réalité, ces deux lignes n’en font qu’une seule, séparées par une virgule. Il ne faut surtout pas essayer de casser la ligne, sinon elle risque de ne pas fonctionner.
Regex
Pour réécrire un URL, l’utilisation de Regex, est très approprié. Regex permet de remplacer à la volée un schéma de recherche comme dans un outil de “rechercher – remplacer“.
Pour vérifier la syntaxe d’une expressions Regex, on peut utiliser un outil en ligne comme https://regex101.com/.
Quelques explications
Il y a deux chaînes de caractères dans une expression Regex, la première (ligne 15), est le schéma de recherche, la deuxième (ligne 16), est la chaîne de caractères qui va la remplacer. Voici quelques explications.
- Important, l’URL transformé doit toujours commencer par “index.php“, qui est la page par défaut.
- Puis, on écrit en clair ce à quoi l’URL doit correspondre, à savoir : “?post_type=voyages&search=“.
- A la suite, on va utiliser une variable dynamique en écrivant : “$matches[1]“, pour première variable. Cette variable va remplacer le groupe entre parenthèses “([^/]*)“, qui signifie littéralement tous les caractères jusqu’au prochain slash “/“. Les “/?” situés avant et après le groupe signifient un slash optionnel. En effet, le visiteur peut très bien ne pas avoir entré de mot de recherche pour la variable “search“.
- Puis, on recommence avec les paramètres “country, month, year, type et order“. Tous ces paramètres sont des groupes non capturés, au contraire de “search“, représentés par un “?:“, placé avant.
- On finit l’expression Regex par le numéro de page dont la syntaxe est “(?:page/([0-9]+))?“. Cette dernière signifie d’ajouter le mot “page” ainsi qu’un chiffre allant de 0 à 9, à la fin de l’URL. Ça fonctionne aussi si l’on est sur la 10ème page.
// Rewrite rules for the travels search bar
function travels_rewrite_rules() {
// Flush the rules
flush_rewrite_rules();
// Regex
// ([^/]*) = All characters until next /
// /? = Optional /
// (?:page/([0-9]+))/?$ = Literally 'page/[page_number]' with optional / and positioned at the end of the search.
// Page is a non captured-group (?:)
// Rule with query search string as first match
// country as second match, travel month as third match, travel year as fourth match, taxonomy as fifth match, page as sixth match
add_rewrite_rule ('voyages/search/?([^/]*)/?(?:country)/?([^\/]*)/?(?:month)/?([^\/]*)/?(?:year)/?([^\/]*)/?(?:type)/?([^\/]*)/?(?:order)/?([^\/]*)/?(?:page/([0-9]+))?/?$',
'index.php?post_type=voyages&search=$matches[1]&travel_country=$matches[2]&travel_month=$matches[3]&travel_year=$matches[4]&travel_taxonomy=$matches[5]&travel_order=$matches[6]&paged=$matches[7]', 'top');
}
add_action ('init', 'travels_rewrite_rules');Voilà pour la réécriture des URL. Ça demande un peu de compréhension du langage d’expressions Regex, mais une fois celui-ci maitrisé, la méthode de rechercher et remplacer toutes sortes de chaînes de caractères sera un atout majeur.
Le prochain chapitre continue le plan de pages dont mon blog parlait dans la publication du même nom. Plutôt que de parler de la création d’une publication unique, pour afficher son contenu, le sujet va s’étendre sur la création et la personnalisation d’une zone de commentaires.
