Strapi, un CMS open-source populaire pour la gestion de contenu, permet aux développeurs d'intégrer facilement des fonctionnalités de traduction.

Dans cet article, nous explorerons les solutions de traduction disponibles dans Strapi, en nous concentrant sur la mise en place d'un système de traduction automatique et en effectuant un test comparatif entre deux plugins de traduction disponibles sur la marketplace Strapi : Localazy et Translate.

Installation d'un module de traduction depuis la marketplace Strapi

La marketplace Strapi est une plateforme qui permet de parcourir le catalogue de plugins / modules Strapi. Ces plugins permette d'étendre les fonctionnalités natives du CMS. Développés par la communauté Strapi ou par des développeurs tiers, ces extensions couvrent divers domaines tels que l'authentification, la gestion de médias, la personnalisation de l'interface utilisateur, etc.

Dans le contexte de la traduction automatique, le marketplace Strapi offre plusieurs modules permettant d'intégrer des services de traduction directement dans votre application Strapi. Ces modules facilitent la gestion du contenu multilingue en automatisant la traduction des textes, réduisant ainsi le temps et les efforts nécessaires pour rendre votre site accessible à un public international.

Étapes d'installation d'un module de traduction

1/ Accéder au marketplace Strapi
- Connectez-vous à votre tableau de bord Strapi.
- Naviguez vers la marketplace en cliquant sur l'icône appropriée dans la barre latérale ou en utilisant le menu principal.

Menu principal du tableau de bord de Strapi

2/ Rechercher un module de traduction
- Dans la barre de recherche, tapez des termes comme "translation", "multilingual", ou "traduction".
- Parcourez les résultats pour trouver le module de traduction qui correspond à vos besoins.

Recherche des plugins de traduction dans le marketplace de Strapi

3/ Sélectionner un module de traduction
- Lisez les descriptions pour évaluer les différentes options disponibles.
- Pour cet article, nous utiliserons les modules Localazy et Translate comme exemples.

4/ Installer le module
- Cliquez sur le module que vous souhaitez installer pour accéder à sa page de détails.
- Suivez les instructions spécifiques fournies sur la page.

5/ Configurer le module
- Après l'installation, redémarrez votre serveur Strapi.
- Accédez aux paramètres du plugin via l'interface d'administration de Strapi.
- Suivez les instructions de configuration pour connecter le plugin à un moteur de traduction (Google Traduction, DeepL, etc.), configurer les langues cibles et ajuster les options spécifiques du plugin.

6/ Utiliser le module de traduction
- Une fois configuré, le plugin de traduction sera disponible dans votre interface Strapi.
- Vous pourrez commencer à traduire automatiquement votre contenu en sélectionnant les langues cibles et en déclenchant le processus de traduction.

Comparaison et installation des plugins Strapi Localazy vs Translate

Installation et configuration du plugin Localazy pour Strapi

Installez le plugin en lançant la commande npm install @localazy/strapi-plugin@latest && npx @localazy/strapi-plugin dans un terminal :

Après avoir lancé la commande npm run build, la panneau d'administration de Localazy est disponible dans le tableau de bord de Strapi :

Cliquez sur le bouton "Login with Localazy" pour créer un compte sur Localazy ou vous connecter à votre compte existant.

Vous serez alors en mesure :
- d'envoyer le contenu de votre back-office vers votre compte Localazy
- ou récupérer le contenu traduit depuis Localazy dans votre back-office

Prenez soin de configurer Localazy en spécifiant quel type de contenu et quelles clés sont concernés par les traductions :

Vous retrouvez votre contenu et pouvez gérer les traductions de chaque entrée indépendamment depuis un tableau de bord dédié :

Installation et configuration du plugin Translate pour Strapi

Installez le plugin en lançant la commande npm install strapi-plugin-translate dans un terminal, puis buildez le projet en lançant la commande npm run build. Une fois le projet buildé, vous pouvez relancer le serveur de développement avec npm run develop.

Translate fonctionne de concert avec les moteurs de traduction DeepL ou LibreTranslate : le premier propose un plan gratuit, tandis que le deuxième est payant et permet un remboursement dans les 7 jours si non satisfait. Les configurations relatives à chacun des moteurs est disponible sur la page de documentation du plugin :

Après vous être créé un compte sur le moteur de traductions de votre choix, vous devrez ajouter sa configuration à votre projet dans le fichier config/plugins.js (récupérez votre clé API et renseignez-la dans la configuration), et installer le provider correspondant :

deepl : npm install strapi-provider-translate-deepl
libretranslate : npm i strapi-provider-translate-libretranslate

Créez votre contenu :

et rendez-vous dans l'onglet Translate du tableau de bord. Vous verrez ici votre contenu dans votre locale par défaut, le contenu dans les autres locales en attente de traduction, ainsi que votre consommation d'API :

Il vous suffit alors de cliquer sur l'icône "globe" pour lancer la traduction automatique de votre contenu international

De retour dans le gestionnaire de contenu, vous trouverez votre contenu fraîchement traduit :

Comparaison des deux solutions

Translate

Translate présente l'avantage d'une configuration simple et d'une interface utilisateur intuitive et interne au back-office de Strapi. Cependant, le choix du moteur de traduction reste limité.

Localazy

Localazy à l'avantage de laisser le choix entre de nombreux moteurs de traduction. Cependant, si sa configuration est simple, son interface dédiée hors du back-office de Strapi nécessite de jongler entre les deux interfaces et peut amener à écraser des contenus modifier dans l'une des interfaces et non synchronisé.