Catégories
Site web - général Thème WordPress

WordPress thème – Comment traduire un thème WordPress en français

Wordpress theme Comment traduire un thème WordPress

Vous avez trouvé un thème WordPress que vous aimez, mais il est en anglais. Voici une façon simple de faire la traduction d’un thème WordPress qui est déjà prêt pour « l’internationalisation » I18n (I18n qui est l’abréviation pour l’internationalisation)

Comme par exemple les thèmes qu’on trouve chez Woo Themes. Ces thèmes ont déjà un fichier .PO qu’on peut utiliser pour la traduction dans la langue de notre choix.

Je vais faire un exemple ici en utilisant un thème gratuit de Woo Themes qui s’appelle Bueno

J’ai d’abord téléchargé le thème WordPress et je l’ai installé sur un wordpress version 3.1 en français. Comme on peut le voir il y a certains textes en anglais :
texte du site bueno qui est en anglais

Éditer le fichier .po avec Poedit

Pour que ces textes s’affichent en français j’édite  le fichier bueno.po, du thème WordPress. Ce fichier est dans le répertoire LANG (wp-content/themes/bueno/lang) et je modifie le fichier avec le logiciel Poedit (disponible pour Windows, Mac et linux) que vous pouvez télécharger gratuitement.

fichier Bueno.po du thème wordpress woothemes

Fichier bueno.po dans poedit

Faire la traduction de chacun des éléments

Cliquez sur le premier élément de la liste, ensuite allez dans le bas de l’écran puis cliquez dans la case vide et entrez le texte en français. Exemple : % Comments devient % Commentaires (s’il y a des signes comme % ou autre ne faut pas oublier de le inscrire).

Traduction dans Poedit

Traduction avec Poedit

IMPORTANT : Lorsqu’on traduit en français il faut tenir compte des accents. Généralement les sites web WordPress utilisent l’encodage UTF-8 par défaut. Il faut donc remplacer les caractères accentués par leur équivalent UTF-8.

Les principaux accents hmtl utf-8  c’était mal formulé (merci à Jef) ==> Les accents et caractères spéciaux en ASCII sont :

  • é => é
  • è => è
  • ê => ê
  • à => à
  • ù => ù
  • un espace vide =>  

Vous trouverez une liste plus longue sur le site scriptol.fr. M.A.J. mai 2012 : 2e référence proposée par Jef  www.w3schools.com/tags/ref_charactersets.asp

Enregistrement du fichier qui a été traduit

Une fois qu’on a terminé la liste de tous les éléments à traduire, il s’agit d’enregistrer le fichier sous le nom fr_FR (pour une traduction en français). Le nom de fichier est important car c’est un standard. Si vous voulez voir les noms de fichiers pour d’autres langues que le français, vérifiez sur le site de WordPress.

Poedit va enregistrer deux fichiers : fr_FR.po et fr_FR.mo. et il faut les copier dans le répertoire wp-content/themes/bueno/lang/ (soit au même endroit que le fichier bueno.po). Si vous désirez utiliser mes fichiers de traduction ils sont à vous : fr_FR.rar

Note : J’utilise Filezilla pour transférer les fichiers via FTP.

Télécharger le fichier dans le répertoire lang

Si vous utilisez déjà WordPress en version française vous devriez maintenant voir les textes en français. Facile hein? 🙂

Traduction terminée

Si vous n’utilisez pas WordPress en version française

Si vous ne voyez toujours pas le texte en français, vous pouvez télécharger les 4  fichiers fr-FR (fr_FR.mo, fr_FR.po, ms-fr_FR.mo, ms-fr_FR.po) pour convertir votre version de WordPress en français.

  1. Ensuite il faut copier les 4 fichiers dans le répertoire wp-content/languages/
  2. Éditer le fichier wp-config.php et recherchez : define (‘WPLANG’,  »);
  3. Remplacer par : define (‘WPLANG’, ‘fr_FR’);

Note : le fichier wp_config.php est directement dans le répertoire racine souvent nommé public_html.

MISE-À-JOUR 17 août 2012

Merci à Mikel Aralar pour son commentaire. J’ajoute cette information importante

Juste un truc. La modification des fichiers .po ne suffit pas à traduire un site. Ce sont des fichiers texte. La magie de Poedit consiste à compiler à l’instant le fichier .mo concerné.

Mais voilà, pour que cela se produise il faut que Poedit soit correctement configuré. Donc, si vous modifiez le fichier .po et ça ne marche pas :

Ouvrir dans Poedir « Fichier/Préférences ». Dans la nouvelle fenêtre, choisir « Éditeur ». Cocher la première option « Compiler automatiquement les fichiers .mo lors de l’enregistrement ». Et voilà !

Je me permets de faire cette remarque parce que j’ai suivi les explications de Annie Bergeron, sans obtenir de résultat. Après je me suis aperçu que Poedit, tout fraichement chargé dans mon ordinateur, n’avait pas la case « Compiler automatiquement… » cochée. Peut-être que quelqu’un d’autre trouvera le même problème.

Ressources :

  • Thèmes Bueno – thème WordPress gratuit – Les thèmes Woothemes sont des thèmes WordPress qui sont très bien fait et qui sont peu cher, je vous les recommande.
  • Mes fichiers de traduction du thème : fr_FR.rar
  • Poedit
  • FileZilla
<a title= »Wordpress theme – Woo themes » href= »http://www.woothemes.com/ » target= »_blank »>
Catégories
Plugin WordPress Site web - général Site Web WordPress Thème WordPress

Utilisez les polices Google sur votre blog WordPress – Google Fonts Web

polices habituellement utilisées sur le WebGoogle Fonts Web permet d’utiliser des polices différentes et moins restrictives que : Verdana, Arial, Georgia et la non moindre Comic. Les polices Google peuvent être utilisées gratuitement alors pourquoi s’en priver.

Il y a deux façons d’installer et utiliser les polices Google sur votre blog WordPress. Personnellement je préfère le faire manuellement.

  1. Manuellement en copiant le code indiqué par Google
  2. Vous pouvez aussi installer ce plugin – WP Google Fonts 

 

Voici une marche à suivre pour installer les polices Google – Google fonts Web manuellement

Choisir votre police sur le site de Google Fonts Web

Google fonts Web Bouton Quick useGoogle fonts - sélection par NomMoi j’aime bien choisir en mettant le nom des polices en sélectionnant FONT NAME dans la boîte « Preview text ».

Lorsque j’ai fait mon choix de police, je clique sur Quick use pour obtenir les codes à insérer sur mon blog WordPress. Dans mon exemple j’ai choisi la police Raleway ultra-light 100.

Information sur la police « Google Fonts Web » qu’on a choisie

Google Fonts impact du temps de chargement de la pageOn peut avoir une idée temps de chargement de la page lorsqu’on utilise cette police. Dans le cas de Raleway, il n’y a pas un impact majeur sur le temps de chargement. Je vous conseille de ne pas mettre plus que 2 polices diffiérentes afin de ne pas nuire en temps de chargement de la page. De toute façon la modération à toujours meilleur goût, trop de polices différentes ne seraient pas très esthétiques.

Insérer le code dans votre thème WordPress

Il y a deux façons d’insérer le code dans votre thème WordPress :

  1. Soit en copiant le code HTML (onglet STANDARD dans l’interface Google Fonts Web) dans votre fichier header.php. Trouvez le tag <header> et coller le code tout de suite après le tag.
    Code google fonts Web - HTML
  2. Copier le code dans votre feuille de style CSS (onglet @IMPORT dans l’interface Google Fonts Web) juste après les informations du modèle « template » (généralement dans le fichier styles.css)
    Google fonts Web - IMPORT css

Appliquer la police Google à une balise de votre page

Voici un exemple sur perspective-jardins.com j’ai appliqué la police Raleway au menu, j’ai donc collé le code dans me fichier css pour la balise #nav a :

Code Google fonts Web appliqué à la balise #nav a
Vérifier l’affichage

Perspective-jardin AVANT

Perspective-jardin avant Google fonts Web

Perspective-jardin  APRÈS

 

Perspective-jardin après Google fonts Web

 

Dites-moi si vous avez essayé les polices Google déjà où si vous allez l’utiliser dans un site web futur.
Peut-être avez-vous utilisé Typekit ou autres services semblables?

Catégories
Site web - général Site web - Tutoriels Site Web WordPress

Comment améliorer la lisibilité sur WordPress – offrez une expérience de lecture confortable

J’ai découvert une façon vraiment confortable de lire des articles Web sur le blog de Jeffrey Zeldman. Il utilise le service Readability qui permet, entre autres de lire les articles dans une mise en page simple qui élimine tous les éléments de la page sauf le texte et les photos.

Site web Readability - améliore la lisibilité

J’ai donc cherché à trouver une solution similaire pour mon blog WordPress et je l’ai trouvée chez labnol.org. Donc dans le but d’offrir une expérience de lecture améliorée j’ai suivi la marche à suivre, pour un blog WordPress, offerte par Amirt Agarwal. Voici la traduction (libre) :
Étape 1 : Ajouter une nouvelle Page via le tableau de bord WordPress : PAGE > AJOUTER
Le titre de cette page : lecture conviviale

ajouter une page dans le tableau de bord WordPress

Étape 2 : Il faut modifier le PERMALIEN et mettre /read/ et cliquer sur le bouton PUBLIER
NOTE : Ne mettez aucun texte pour cette page.

Étape 3 : Ouvrir le fichier .htaccess et ajouter cette ligne de code (au début du fichier) :

RewriteRule ^read/([0-9]+)/?$ /read/?u=$1 [QSA,L]

Étape 4 : Téléchargez le fichier page-read.php.txt (ma version en français) ou la version originale (anglais) dans le répertoire du thème que vous utilisez. Dans mon cas j’ai copié le fichier dans le répertoire /wp-content/themes/canvas2/
Ensuite il faut renommer le fichier page-read.php

Image de Filezila - fichier page-read.php

Étape 5 : La dernière étape consiste à insérer un lien pour permettre à l’internaute de voir notre version « reader-friendly« . Il faut bien connaître votre thème pour savoir à quel endroit il faut mettre ce fameux lien. Généralement c’est dans le fichier single.php où il faut insérer le code suivant :
ma version en français :

<a href="/read/<?php the_ID(); ?>/">
Lire cet article en mode confort "Reader-Friendly" </a>

version originale :

<a href="/read/<?php the_ID(); ?>/">Read story without the clutter</a>

Est-ce que vous voulez implémenter cette solution? ou peut-être utiliser Readability?

Catégories
Plugin WordPress Site web - général Site Web WordPress Thème WordPress

WordPress: thème français? Traduire un thème wordpress avec Codestyling Localization

Il y a longtemps que je voulais changer le thème de mon blog WordPress. Eh voilà c’est fait! J’ai fait l’achat d’un thème chez WooThemes, il s’agit du thème Canvas.

Thème WordPress Canvas de WoothemesTous les thèmes chez Woothemes utilisent les fonctionnalités GNU gettext (qui est la technologie de « localization » de WordPress) qui permettent de traduire les thèmes dans la langue de notre choix. Chaque thème comprend son fichier (en_GB.PO) qui contient tous les termes anglais à traduire. L’avantage de cette méthode est que la traduction n’affecte pas les fichiers modèles (templates) donc si on doit mettre le thème à jour nos traductions ne sont pas exposées aux mises à jour (en fait nous n’avons pas à  refaire la traduction lorsque WooThemes publie une version actualisée du thème) .

Plugins Codestyling Localization

Tel que proposé par WooThemes, j’ai utilisé le plugin Codestyling Localization pour faire la traduction du thème Canvas.

Une fois, le thème installé et activé le plugin, il suffit d’aller dans le menu OUTILS > LOCALISATION

Codestyling Localization-menu

 

Ensuite, on clique sur le menu THÈMES (ici je veux traduire mon thème Canvas, mais on peut aussi l’utiliser pour traduire autre chose comme un plugin).Codestyling Localization-menu-themes

 

On ajoute la langue de notre choix en cliquant sur le menu AJOUTER UNE NOUVELLE LANGUE. Codestyling Localization-menu-langue

Dans la boîte de dialogue, j’ai choisi fr_CA car je n’ai pas trouvé fr_FR. J’ai donc créé le fichier fr_CA.PO mais je suis allée modifier le nom du fichier par la suite pour fr_FR.PO. Car j’utilise la version de WordPress en français et le code dans mon fichier de configuration est fr_FR.

Une fois le fichier fr_CA.PO créé je suis allée le renommer pour fr_FR.PO en uilisant FileZilla. (NOTE le fichier PO se trouve dans le répertoire /wp-content/themes/canvas/lang/

Une fois le fichier renommé on voit que la langue est maintenant Français /France. Il suffit de cliquer sur RESCANNER pour que Codestyling Localization « scan » le thème Canvas.

Codestyling Localization-scan

Une fois le scan terminé, il faut cliquer sur MODIFIER (juste à gauche de Rescanner) pour arriver sur l’interface qui permet de traduire tous les termes anglais.

Codestyling Localization interface de traduction

 

Pour chaque terme anglais qu’on veut traduire en français, il faut cliquer sur MODIFIER (juste sous la colonne ACTIONS)

Codestyling Localization-traduction-editionOn répète cette action pour tous les termes qu’on veut traduire.

Dernière étape :

Une fois qu’on a terminé, il faut générer un fichier .mo en cliquant sur le bouton générer le fichier .mo.

Codestyling Localization générer le fichier .mo

 

Vous pouvez vérifier votre site web afin de vous assurer que la traduction a bien fonctionné.

Mise-à-jour février 2013 :

Plusieurs ont demandé le fichier de traduction (traduction partielle) : télécharger les fichiers fr_FR.po et fr_FR.mo

Catégories
Site web - général Site Web WordPress

Passer à WordPress 3.2 oui, mais il faut MySQL 5.0 et PHP 5.2.4

Avez-vous ce qu’il faut pour passer à WordPress 3.2 et bénéficier :

des améliorations de performance

de l’éditeur plein écran « sans distraction »

WordpPress 3.2 éditeur plein écran sans distraction

WordPress 3.2 éditeur plein écran sans distraction

du nouveau « look » du tableau de bord

WordPress 3.2 nouvel interface

du thème « Twenty Eleven 1.0 »

Nouveau thème Twenty eleven pour WordPress 3.2

C’est en lisant l’article : http://wpmu.org/dont-let-wordpress-3-2-break-your-website-make-sure-you-have-mysql-5-and-php-5-2-4 que j’ai eu envie de faire l’essai de WordPress 3.2 et d’écrire ce petit article.

Mais attention avant de faire ce changement, car WordPress 3.2 a de nouvelles exigences MINIMALES : Votre hébergeur doit utiliser PHP dont la version est 5.2.4 ou plus et MySQL 5.0 ou plus. Pour vérifier si votre hébergeur a déjà ce qu’il faut vous pouvez installer le plugin health check. Dès l’activation du plugin vous obtenez un message vous informant de la version de PHP et MySQL. J’ai fait le test chez hostgator et voici la réponse :
WordPress plugin Health check réponse du serveur

Il faut aussi vérifier si les plugins que vous utilisez sur votre site web sont compatibles avec les nouvelles exigences de WordPress 3.2. en consultant les sites web des concepteurs de vos plugins.

Mise à jour simplifiée avec WordPress 3.2

Une nouvelle façon de faire les mises à jour : une excellente idée! WordPress 3.2 télécharge uniquement les fichiers qui ont été modifiés et qui ont besoin d’être changés, au lieu de TOUT télécharger. Cette amélioration va simplifier le processus de mise à jour et ainsi le rendre beaucoup plus rapide et plus fiable en diminuant la possibilité d’erreurs de téléchargement.

Internet Exploreur 6 : abandon officiel du soutien

Tout le monde le sait IE 6 ne sera même plus supporté par Microsoft (référence : http://www.theie6countdown.com/) donc ce n’est pas une très grande surprise d’apprendre que WordPress 3.2 n’offrira plus de support et les problèmes de sécurité qui affectent uniquement IE6 ne seront pas une priorité. Il n’y aura donc plus de test effectué sur IE6 et éventuellement sur IE7 qui devrait également disparaître bientôt.

La rapidité : une priorité dans les modifications apportées à la nouvelle version 3.2

Lors de mes premiers tests sur WordPress 3.2 je vois une différence. La navigation est plus rapidement, la gestion des plugins m’apparaisse plus rapide aussi. Le travail d’optimisation semble porter fruit.

Vous voulez faire le test, vous aussi? Téléchargez WordPress 3.2