Comment internationaliser votre site WordPress

Publié: 2022-03-10
Résumé rapide ↬ WordPress est actuellement entièrement localisé dans plus de 65 langues et propose des traductions partielles pour 95 paramètres régionaux supplémentaires. Si vous n'avez pas encore internationalisé votre site Web WordPress, il est probablement temps de le faire.

Le 30 septembre 2017, la communauté internationale WordPress s'est réunie pendant 24 heures pour traduire l'écosystème WordPress. Pour la troisième fois, #WPTranslationDay a fusionné un marathon de traduction d'une journée avec des événements numériques et des jours de contributeurs conçus pour promouvoir la valeur de la création d'expériences accessibles pour les utilisateurs mondiaux, mieux connue sous le nom de "localisation".

En tant que communauté open source, nous devons tous nous efforcer de localiser nos contributions open source. Avant de pouvoir transcrire vos actifs numériques, vous devez cependant internationaliser votre base de code.

Les termes « internationalisation » et « localisation » sont souvent utilisés de manière interchangeable, bien qu'ils représentent techniquement deux aspects différents du processus de traduction.

  • L'internationalisation (I18N) est le processus d'internationalisation ou d'adaptation de votre thème ou plugin pour le traduire dans n'importe quelle langue du monde.
  • La localisation (L10N) est le processus ultérieur de localisation ou de traduction de vos outils internationalisés dans une langue donnée.

WordPress est actuellement entièrement localisé dans plus de 65 langues et propose des traductions partielles pour 95 paramètres régionaux supplémentaires. L'utilisation internationale continue d'augmenter à mesure que de nouvelles localisations sont introduites.

Statistiques de WordPress.org
Statistiques de WordPress.org ( Grand aperçu )
Plus après saut! Continuez à lire ci-dessous ↓

Les utilisateurs non anglophones de WordPress ont dépassé les utilisateurs anglophones en 2014, et ils continuent par inadvertance à diluer le pourcentage du gâteau des utilisateurs anglophones en 2017 alors que des efforts comme #WPTranslateDay se développent.

Alors que WordPress devient de plus en plus accessible linguistiquement, la connaissance de I18N & L10N est essentielle pour que les développeurs de plugins et de thèmes prospèrent dans l'économie mondiale de WordPress. Pour les entreprises qui évoluent, ces compétences de développement peuvent ouvrir des portes sur les marchés étrangers. L'accessibilité du Web, y compris l'accessibilité linguistique, est bonne pour les affaires et meilleure pour les gens.

Dans la continuité de #WPTranslationDay , voici un guide mis à jour pour internationaliser vos plugins et thèmes WordPress.

Voici un bref aperçu du processus que nous allons explorer aujourd'hui.

  • Découverte
    • Apprenez à connaître les fichiers de traduction
      • Fichier POT
      • Fichier PO
      • Fichier MO
    • GlotPress et modules linguistiques
    • Sauvegardez et préparez votre environnement
  • Plug-in I18N
    • En-tête du plugin
    • Charger le domaine de texte
    • Audit des chaînes
    • Générer un fichier POT
  • Thème I18N
    • En-tête de thème
    • Charger le domaine de texte
    • Audit des chaînes
    • Générer un fichier POT
  • Javascript I18N
  • Ressources supplémentaires

Découverte

Apprenez à connaître les fichiers de traduction

WordPress utilise la bibliothèque GNU gettext pour faciliter I18N.

Tout d'abord, familiarisons-nous avec les fichiers de traduction gettext générés tout au long du processus.

Fichier de modèle d'objet portable (POT)

Au cours du processus I18N, nous utiliserons un outil pour trouver des chaînes internationalisées et générer un fichier POT contenant tout le texte traduisible dans vos plugins et votre thème.

Fichier d'objets portable (PO)

En apparence, il n'y a pas de différences notables entre un fichier POT et un fichier PO . Ils sont syntaxiquement identiques et ne se différencient que par leurs objectifs.

Après avoir généré un fichier POT, les chaînes de texte doivent être interprétées par un traducteur dans votre langue préférée. Le fichier PO contiendra éventuellement des chaînes de texte dans votre langue maternelle, ainsi que les traductions appropriées.

Fichier objet machine (MO)

Enfin, le fichier PO est converti en un document lisible par machine ou un fichier Machine Object. Ce fichier vivra dans votre répertoire de thème ou de plugin pour que WordPress puisse l'appeler lorsqu'il sera temps de servir une version traduite.

Sauvegardez et préparez votre environnement

Avant de modifier tout balisage, faites une sauvegarde de votre plugin, thème ou de votre site entier (tout ce que vous internationalisez !) et mettez de l'ordre dans vos environnements de développement.

Assurez-vous de faire un audit rapide des plugins si vous envisagez de localiser votre site Web. Supprimez ou désactivez tous les plugins que vous n'utilisez plus activement. Cet audit rapide vous fera gagner du temps à long terme.

Internationalisez vos plugins

EN-TÊTE DU PLUG-IN

Tout d'abord, nous allons mettre à jour l'en-tête du plugin. Plus précisément, le domaine de texte et le chemin de domaine .

Exemple d'en-tête de plugin

 /* Plugin Name: My Rad Plugin Plugin URI: https://myradplugin.com Description: Custom Plugin That Makes My Site Rad Author: Rad Plugin Creator Version: 1.0 Author URI: https://radplugincreator.com Text Domain: rad-plugin Domain Path: /languages/ */

Domaine de texte

Le domaine de texte est un identifiant unique permettant à WordPress de reconnaître tout le texte appartenant à un plugin et doit correspondre au slug du plugin .

Ceci est particulièrement important si votre plugin est hébergé sur WordPress.org ; ceux-ci doivent correspondre pour que GlotPress importe correctement les traductions de votre plugin.

Dans notre exemple, le fichier du plugin est nommé rad-plugin.php et le domaine texte est rad-plugin

Vous avez peut-être déjà défini un domaine de texte. Si vous ne le faites pas, n'oubliez pas d'utiliser des traits d'union et non des traits de soulignement.

Chemin de domaine

Le chemin de domaine est le dossier dans lequel les fichiers de traduction finalisés vivront. Vous devez créer un nouveau dossier dans le répertoire du plugin, tel que /languages/ , et mettre à jour le chemin de domaine, afin que WordPress sache exactement où rechercher les fichiers de traduction.

CHARGER LE DOMAINE TEXTE

Ensuite, nous allons charger le domaine de texte en ajoutant la fonction suivante à notre code.

load_plugin_textdomain()

 load_plugin_textdomain( $domain, $abs_rel_path, $plugin_rel_path );

Si un fichier de traduction est disponible pour la langue de l'utilisateur, la fonction de chargement de domaine de texte indiquera à WordPress de le livrer.

Paramètres

  • $domain — domaine de texte (obligatoire)
  • $abs_rel_path — false (facultatif, obsolète)
  • $plugin_rel_path — /languages/ (facultatif, il s'agit du chemin relatif vers le répertoire contenant vos fichiers de traduction. Dans notre exemple, /languages/. À partir de la version 4.6, WordPress recherchera ces fichiers dans le répertoire /languages/ du plugin, si cela n'est pas spécifié.)

Exemple de plug-in Rad

Pour charger le domaine de texte, nous allons nous connecter à l'action 'plugins_loaded'.

 add_action( 'plugins_loaded', 'rad_plugin_load_text_domain' ); function rad_plugin_load_text_domain() { load_plugin_textdomain( 'rad-plugin', false, dirname( plugin_basename( __FILE__ ) ) . '/languages/' ); }

AUDIT DES CHAÎNES

L'étape suivante consiste à envelopper toutes les chaînes de texte du plugin dans les fonctions de traduction.

Les fonctions de traduction les plus courantes sont __() pour renvoyer une chaîne traduite et _e() pour renvoyer une chaîne traduite.

Exemple de plug-in Rad

 __() $text = __( 'Super Rad!', 'rad-plugin' );

Cette fonction fonctionnera pour les traductions simples. Il prend en compte deux paramètres ; la chaîne de texte et le domaine de texte .

 _e( 'Super Rad!', 'rad-plugin' );

Cette fonction renvoie simplement la valeur. Sinon, cela fonctionne exactement comme la fonction précédente.

Il existe une multitude de fonctions de traduction supplémentaires qui doivent également être utilisées le cas échéant.

Autres fonctions de base

 __() _e() _x() _ex() _n() _nx() _n_noop() _nx_noop() translate_nooped_plural()

Fonctions de date et de nombre

 number_format_i18n() date_i18n()

Fonctions d'échappement

N'oubliez pas d'échapper toutes les données en cours de sortie à l'aide des fonctions d'échappement suivantes.

 esc_html__() esc_html__() esc_html_x() esc_attr__() esc_attr_e() esc_attr_x()

Dans notre exemple Rad, nous pourrions avoir une ligne de code de plugin qui ressemble à ceci :

 function create_section() { esc_html_e( 'Below are your settings for Rad Plugin', 'rad-plugin' ); }

CRÉER UN FICHIER POT

La dernière étape consiste à créer un fichier POT. Il existe différents outils disponibles pour générer ce type de fichier, mais pour ce didacticiel, nous nous en tiendrons aux recommandations du codex WordPress et utiliserons Poedit, une interface graphique facile à utiliser pour gérer les traductions.

Remarque : Si votre plugin ou thème est déjà dans le référentiel WordPress.org, vous pouvez ignorer ce processus et générer un fichier POT à partir de la page d'administration. Dans ce cas, il n'est pas nécessaire de générer un fichier .po pour chaque langue. L'introduction de GlotPress et des modules linguistiques en 2015 a simplifié le processus de traduction ; tout ce qui est nécessaire pour GlotPress est le fichier .pot, qui sera importé par WordPress.org et servi aux traducteurs via le tableau de bord translate.wordpress.org. Des collaborateurs du monde entier utiliseront ce tableau de bord pour fournir des traductions le #WPTranslateDay.

Télécharger Poedit

Configurer Poedit

Propriétés de traduction

Commencez par aller dans Fichier > Nouveau . Sélectionnez ensuite la langue maternelle de votre plugin et appuyez sur OK .

Grand aperçu

Ensuite, sélectionnez Catalogue > Nouveau . Entrez le nom du projet, la version, le contact et la langue.

Grand aperçu

Chemins

Sélectionnez ensuite l'onglet Sources Paths . S'il s'agit d'un nouveau fichier, vous devrez d'abord enregistrer le fichier.

Suivant notre exemple, nous sélectionnerions Fichier > Enregistrer sous pour enregistrer en tant que fichier .po dans le répertoire /languages/ à l'intérieur de rad-plugin. Encore une fois, le nom du fichier doit correspondre au slug de votre plugin.

 rad-plugin.po

Après l'enregistrement, entrez le chemin relatif vers le répertoire où vos fichiers de traduction vivront. Dans ce scénario, languages ​​.

Grand aperçu

Mots clés

Sélectionnez l'onglet Mots-clés sources . Cliquez sur l' icône + pour ajouter les noms de fonction appropriés.

Grand aperçu

Aide-mémoire

 __ _e _x _ex _n _nx _n_noop _nx_noop translate_nooped_plural number_format_i18n date_i18n esc_html__ esc_html__ esc_html_x esc_attr__ esc_attr_e esc_attr_x

Ensuite, vous pouvez cliquer sur OK puis sur Fichier > Enregistrer .

Poedit enregistrera à la fois un fichier .mo et un fichier .po. Vous pouvez créer le fichier .pot en copiant le fichier .po et en ajoutant une extension .pot. Les utilisateurs internationaux peuvent utiliser le modèle de fichier .pot pour traduire les chaînes dans leur langue.

Internationalisez votre thème

Le processus d'internationalisation de votre thème est pratiquement identique à I18N pour les plugins. Nous commencerons par vérifier l'en-tête du thème et finirons par générer un autre fichier POT.

EN-TÊTE DU THÈME

Vérifiez l'en-tête de votre thème pour vous assurer que votre domaine de texte et votre chemin de domaine sont définis.

Exemple d'en-tête de thème

 /* Theme Name: Rad Theme Author: Rad Theme Author Text Domain: rad-theme Domain Path: /languages/ */

CHARGER LE DOMAINE TEXTE

L'étape suivante consiste cette fois à charger un domaine de texte dans le fichier functions.php de votre thème.

load_theme_textdomain()

 load_theme_textdomain( 'radtheme', get_template_directory() . '/languages' );

Pour que ces fichiers se chargent, vous devez les enregistrer avec l'action after_setup_theme.

 add_action( 'after_setup_theme', 'rad_theme_setup' ); function rad_theme_setup() { load_theme_textdomain( 'radtheme', get_template_directory() . '/languages' ); }

AUDIT DES CHAÎNES

Il est temps pour un autre audit de cordes ! Vous devez être familiarisé avec les fonctions de traduction de base à ce stade.

Jetons un coup d'œil à quelques traductions plus délicates.

Espaces réservés

Les variables PHP comme l'exemple ci-dessous ne seront pas traduites correctement sans l'utilisation d'espaces réservés.

 echo "We added $count rad points.";

printf() & sprintf()

Ces fonctions utilisent des espaces réservés tels que %s ou %d pour les entiers, pour interpoler une chaîne de texte avec un contenu dynamique.

Exemple de thème Rad

 /* Translators: %d is the number of rad points added */ printf( esc_html__( 'We added %d rad points.', 'rad-plugin' ), $count );

Pluriels

La fonction _n() peut gérer des traductions de chaînes plus complexes comme les pluriels, mais elle n'est pas recommandée en raison de ses limitations dans les logiciels de traduction. Au lieu de cela, vous pouvez écrire une simple instruction if pour faire la distinction entre les mots au singulier et au pluriel.

Exemple de plug-in Rad

 If ( 1 === $rad_points_found ) { $message = __( '1 rad point', 'rad-plugin' ); } else { /* Translators: %s is the number of rad points found */ $message = sprintf( __( '%s rad points' , 'rad-plugin' ) , $rad_points_found ); }

GÉNÉRER LE FICHIER POT

Le processus de génération de fichiers POT de thème est le même que pour la génération de fichiers POT de plug-in. Découvrez quelques méthodes ci-dessous.

Ligne de commande

Avec WordPress Trunk et le package gettext GNU installés, vous pouvez passer cette étape en toute simplicité en exécutant le script makepot.php dans la ligne de commande.

Ouvrez la ligne de commande et accédez au répertoire des outils I18N.

 cd wpdev/tools/i18n/

Le script devrait ressembler à ceci :

 php path/to/makepot.php wp-theme path/to/rad-theme rad-theme.pot

Le script fera son travail et le fichier fini, rad-theme.pot , se retrouvera dans le répertoire courant.

Tâches de grognement

Une autre méthode pour créer un fichier POT consiste à exécuter des tâches Grunt en utilisant grunt-wp-i18n ou grunt-pot. Les exécuteurs de tâches comme Grunt peuvent automatiser de nombreuses tâches fastidieuses, telles que la génération de fichiers POT.

Pour créer votre fichier POT, assurez-vous d'abord que node.js est installé. Ensuite, installez Grunt dans votre répertoire de langue via la ligne de commande, et c'est parti. Maintenant, vous pouvez rapidement exécuter ces commandes I18N et créer votre fichier de traduction sans quitter le confort de la ligne de commande.

Javascript I18N

Si vous êtes un développeur de thèmes ou de plugins moderne, il est probable que vous utilisiez JavaScript pour gérer certains composants de votre projet. wp_localize_script est une fonction efficace pour extraire les données PHP à fournir à vos scripts, et c'est le seul moyen de traduire JavaScript à l'intérieur de WordPress.

WP_LOCALIZE_SCRIPT()

Cette fonction nous permettra de localiser les chaînes côté serveur en PHP et de fournir des chaînes de texte en tant qu'objet JavaScript au script.

 wp_localize_script( $handle, $name, $data );

PARAMÈTRES

  • $handle — le descripteur de script pour lequel les données doivent être disponibles (obligatoire — doit correspondre au descripteur du script auquel ces données sont destinées, voir l'exemple ci-dessous)
  • $name — nom de l'objet devant contenir les données (obligatoire — doit être unique)
  • $data — un tableau de données à transmettre au script (obligatoire) .

EXEMPLE DE PLUGIN RAD

 add_action( 'wp_enqueue_scripts', 'rad_theme_scripts' ); function rad_theme_scripts() { wp_enqueue_script( 'rad-theme-script', get_template_directory_url() . '/js/rad-theme-script.js' ); wp_localize_script( 'rad-theme-script', 'rad-I18n', array( 'message' => __( 'Super Rad!', 'rad-theme' ), ) ); }

ACCÉDER AUX DONNÉES EN JAVASCRIPT

L'extrait de code simple ci-dessous est un exemple de la façon d'accéder à ces données dans votre fichier JavaScript.

 alert( rad-I18n.message );

Ressources supplémentaires

  • I18N pour les développeurs WordPress
  • Manuel du thème WordPress : Internationalisation
  • Manuel du plugin WordPress : Internationalisation
  • WordPress.tv : I18N

Envelopper

Toutes nos félicitations! Vous venez d'internationaliser votre thème et/ou plugin, le rendant accessible aux personnes de toutes les langues maternelles. Que votre projet soit distribué via le référentiel WordPress ou développé sur mesure pour le site Web de votre organisation, il n'y a qu'un avantage à internationaliser vos fichiers dès le départ.

  • Rendez vos contributions open source accessibles dans le monde entier.
  • Créer des conversations avec de nouveaux clients sur les marchés étrangers.
  • Gagnez du temps et réduisez les mises à jour laborieuses à l'avenir.

Toujours internationaliser.