Traduire des sites créés avec des mises en page par glisser-déposer

Depuis la version 3.2, WPML peut traduire les entités créées par d’autres extensions et thèmes. Dans cet article, nous montrons comment traduire des mises en page. L’idée est d’utiliser une seule mise en page pour toutes les langues et de ne traduire que les textes qu’elle contient.

Introduction à Layouts

L’extension Layouts est un éditeur par glisser-déposer pour les mises en page. Layouts fonctionne avec des thèmes basés sur Bootstrap et produit des conceptions réactives. Elle fait partie du paquet Toolset d’extensions de développement WordPress.

Layouts conçoit des pages entières, du premier au dernier pixel. En soi, Layouts est assez simple, car elle n’inclut pas d’éléments de contenu sophistiqués. Layouts n’a pas besoin d’une bibliothèque énorme (et parfois surchargée) d’éléments de page, car elle fonctionne avec le reste des extensions Toolset. Les cellules de Layouts peuvent afficher du contenu dynamique de votre site et de vos formulaires. Au lieu de choisir une cellule dans une bibliothèque et de la personnaliser, les extensions Toolset vous permettent de créer facilement vos propres cellules sans aucune programmation.

Traduire des sites basés sur Layouts

Les mises en page que vous créez incluront généralement du texte « statique » et du contenu dynamique. Par exemple, regardez notre exemple de « site d’entreprise ».

Les éléments dynamiques incluent la liste des services et les articles vedettes. Ils sont créés à l’aide de Views. Une vue (View) est comme une WP_Query avec un modèle d’affichage. Étant donné que WPML utilise des hooks sur les requêtes et leur fait charger le contenu dans la bonne langue, vous n’avez rien à faire pour traduire Views. Exactement la même vue chargera le bon contenu dans la langue affichée.

Les éléments statiques sur cette page sont les en-têtes. Les textes « Our Services » et « Features Articles » font partie de la mise en page. Ils ne proviennent d’aucun contenu dynamique. Lorsque vous utilisez la même mise en page pour la page d’accueil dans une autre langue, vous souhaitez que ces textes apparaissent traduits. C’est là qu’intervient la traduction des paquets de WPML. C’est une nouvelle API que nous avons ajoutée à WPML 3.2 et qui est ouverte à tous les autres auteurs.

L’extension Layouts crée des paquets pour WPML. Un paquet pour une mise en page inclura tous les textes statiques qui se trouvent dans la mise en page et qui nécessiteront une traduction. Ces paquets ressemblent beaucoup au contenu WordPress normal que vous traduisez à l’aide de l’éditeur de traduction de WPML. Vous verrez tous les champs qui nécessitent une traduction.

De cette façon, vous créez une seule mise en page et l’utilisez pour toutes les langues de votre site. Vous ne traduisez que les textes statiques et tout le contenu dynamique s’affiche dans la bonne langue.

Envie d’essayer ?

Nous avons créé un site de test où vous pouvez expérimenter avec les extensions Toolset et WPML. Pour l’utiliser, lancez votre site de formation privé et gratuit.

Nous avons déjà créé le contenu de test pour vous, afin que vous puissiez expérimenter avec Layouts et le processus de traduction.

La langue par défaut du site est l’anglais et il est entièrement traduit en espagnol. Nous avons ajouté du contenu en français, mais n’avons pas traduit les mises en page en français.

Suivez la vidéo avec ces étapes :

1. Créez le site de formation sur discover-wp.com
2. Visitez la page d’accueil de votre site et passez au français. Vous remarquerez que tous les éléments dynamiques sont bien en français, mais que les textes statiques sont toujours en anglais.
3. Commencez par jouer avec Layouts et voyez comment cela fonctionne.
4. Accédez à WPML->Gestion de traduction. Dans l’onglet « Tableau de bord de traduction », dans la section Filtres, sélectionnez « Layouts » dans la liste déroulante Type.
5. Sélectionnez la mise en page Home et envoyez-la à la traduction vers le français (elle est déjà traduite en espagnol).
6. Accédez à WPML->Traductions et localisez le travail Layout-Home, puis cliquez sur « Prendre et modifier ».
7. Traduisez les textes. Besoin d’aide ? Utilisez cet aide-mémoire de traduction pour les textes principaux de la page :

   Anglais	Français
   Our Services	Nos services
   Featured articles	Articles Vedettes
   Testimonials	Témoignages
   Company Overview	Présentation de l’entreprise
   Recent News	Nouvelles récentes

   
   N’oubliez pas de cliquer sur « La traduction est terminée » à côté de chaque champ et sur la case à cocher « La traduction est terminée » tout en bas de la page, juste au-dessus du bouton « Enregistrer ».
8. Visitez à nouveau votre page d’accueil française. Vous devriez maintenant voir tout traduit, y compris les textes statiques.
9. Expérimentez à nouveau en modifiant la mise en page. Vous verrez vos modifications s’appliquer à toutes les langues du site. Si vous modifiez ou ajoutez des textes, vous devrez mettre à jour la traduction, en commençant par le tableau de bord de traduction.

Les étapes ci-dessus s’appliquent à la traduction des mises en page à l’aide de notre site de référence. Le site est fourni avec toutes les extensions nécessaires préinstallées.

Si vous souhaitez suivre les étapes sur votre propre site, consultez la documentation « Comment traduire Layouts » sur wp-types.com. Vous y trouverez la liste de toutes les extensions requises et d’autres exemples.

Et ensuite ?

Évidemment, si vous avez aimé éditer avec Layouts, vous êtes plus que bienvenu pour acheter Toolset et l’utiliser pour vos projets réels.

Nous voulons voir beaucoup plus d’extensions et de thèmes offrir une traduction facile pour les structures complexes. Si vous utilisez des constructeurs de pages, des formulaires et d’autres éléments « non WordPress », nous vous encourageons à contacter les auteurs de ces extensions et thèmes. Parlez-leur de cette possibilité dans WPML. Nous sommes très intéressés par l’idée de travailler avec d’autres auteurs et d’intégrer l’API de traduction de paquets.

Laissez vos commentaires ici et nous vous répondrons.