Notez que cet article a été écrit pour la première fois il y a plus de 2 ans, mais n'est pas nécessairement obsolète.
Pour traduire une extension Chrome, on crée d’abord un répertoire _locales dans le répertoire de l’extension. Dans ce répertoire, on crée des sous-répertoires que l’on nomme avec le code de la langue. Par exemple, en pour l’anglais, fr pour le français: Google localecode. Dans chaque sous-répertoires, on crée un fichier messages.json qui contient les chaines traduites pour chaque langue.
Dans le fichier manifest.json, on ajoute la clé default_locale:
|
1 2 3 4 5 |
... "default_locale": "fr", ... |
La structure d’un fichier de langue messages.json est la suivante:
_locales/fr/messages.json
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
{ "extName": { "message": "xbs Convertisseur/Uploader pour Youtube", "description": "Nom de l'extension" }, "titlePopup": { "message": "xbs Youtube", "description": "Titre de 'browser_action' du Manifest" }, "stringPopup": { "message": "Télécharger des vidéos de Youtube ou les convertir en fichiers audios", "description": "Phrase dans popup.html" } } |
À chaque clé primaire correspond un message (la traduction) et une description destinée au traducteur.
Dans un fichier json comme manisfest.json, on appelera la traduction avec __MSG_message__. Par exemple, pour le fichier précédent, le manisfest.json pourra contenir:
|
1 2 3 4 5 |
... "description": "__MSG_extName__", ... "default_title":"__MSG_titlePopup__", ... |
Dans un fichier javascript:
|
1 2 3 4 5 |
... var extName = chrome.i18n.getMessage( 'extName' ); var titlePopup = chrome.i18n.getMessage( 'titlePopup' ); ... |
Dans un fichier HTML, il faut créer une fonction javascript qui permettra de traduire la chaine. Par exemple, dans popup.html:
|
1 2 3 4 5 |
<body> <p>__MSG_stringPopup__ | <a href="http://murviel-info.com">Murviel-Info</a></p> <script type="text/javascript" src="js/i18n.js"></script> </body> |
Et le script i18n.js qui se charge de trouver la chaine traduite:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
var i18n = function() { //Localize by replacing __MSG_***__ meta tags var objects = document.getElementsByTagName('html'); for( var j = 0; j < objects.length; j++ ) { var obj = objects[j]; var valStrH = obj.innerHTML.toString(); var valNewH = valStrH.replace( /__MSG_(\w+)__/g, function( match, v1 ) { return v1 ? chrome.i18n.getMessage( v1 ) : ""; }); if( valNewH != valStrH ) { obj.innerHTML = valNewH; } } } i18n(); |
Et hop, on traduit allègrement notre extension Chrome.
