Obtenir un rendez-vous

Nous avons reçu votre message et vous contacterons bientôt.

Merci d'avoir choisi prositeweb, votre agence de développement web à Montréal. Veuillez nous appeler au +1 (514) 548-2165 si vous avez besoin d'un soutien immédiat.

Guide détaillé pour traduire son site web avec l’API de traduction Google ou JavaScript?


Ajoutez la vérification captcha de Google avec notre plugin

L'extension est disponible en téléchargement sur notre site web.

Télécharger

L’API de traduction Google est un moyen très rapide que vous pouvez utiliser pour rendre votre contenu accessible à diverses personnes dans le monde. En effet, il existe des milliers de langues à travers le monde. D’où des potentiels clients perdu s’ils ne sont pas en mesure de lire notre contenu. Dans cet article, nous regardons deux approches différentes qui peuvent vous aider à faire la traduction de votre site web. Nous verrons également les avantages et les inconvénients de ces approches. Pour finir, nous allons donner notre point de vue et nos recommandations pour facilement proposer un contenu de qualité.

Les deux approches de la Traduction Google pour proposer le contenu en différentes langues

Google propose deux possibilités que les utilisateurs peuvent utiliser pour traduire leur contenu:

  • L’utilisation de la librairie JavaScript qui permet d’ajouter un bouton de traduction sur votre site web
  • Les API de traduction Google.

Dans le premier cas, l’utilisateur pourra afficher votre site web en n’importe quelles langues proposé par Google. Toutefois, dans le second cas, vous avez plus de flexibilité dans ce que vous souhaitez afficher comme langue, nous allons parler de ces deux possibilités et faire une comparaison.

1 – Utilisation de la librairie JavaScript

Pour faire la traduction sur votre site web à l’aide de la libraire JavaScript, vous devez tout simplement inclure le code JavaScript sur votre site internet. Ensuite avec une ligne de code JavaScript, vous allez faire apparaitre une option de sélection de langues. Les utilisateurs pourront ainsi utiliser l’outil de sélection de langue pour traduire le contenu de votre site web.

Exemple de code de la librairie JavaScript pour la traduction Google


<!DOCTYPE html>
<html lang="fr-CA">
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta charset="UTF-8">
    <link rel="profile" href="//gmpg.org/xfn/11">
    <meta name='robots' content='index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1' />
    <title>Page de traduction test</title>
    </head>
<body>

<h1>Bienvenue sur Prositeweb</h1>

<p>Votre agence web à Montreal.</p>


<div id="traduction_site_web"></div>

<script>
function matraduction() {
  new google.translate.TranslateElement({pageLanguage: 'fr'}, 'traduction_site_web');
}
</script>

<script src="//translate.google.com/translate_a/element.js?cb=matraduction"></script>
</body>
</html>

dans l’exemple ci-dessus, on utilise la librairie de traduction de Google pour inclure la traduction sur le site web (//translate.google.com/translate_a/element.js). Ensuite, on fait la création d’une fonction de JavaScript qui permettra d’initialiser le formulaire de sélection des langues « matraduction». Dans la fonction d’initialisation, on transmet l’identifiant qui servira de sélection  « traduction_site_web».

Le code ci-dessus est largement suffisant pour faire la traduction de votre site web avec la librairie JavaScript de Google.

[voir_demo title= »Voir un exemple d’utilisation de la librairie de Google ou télécharger »  demo = »googletranslationjs.php »]

Quelques avantages de la librairie JavaScript de Google

La librairie JavaScript de traduction peut avoir plusieurs bénéfices. Nous allons les énumérer ci-dessous.

Votre site web peut être accessible facilement en plusieurs langues

Comme nous avons pu constater, avec très peu d’effort, vous pouvez permettre à n’importe quel visiteur à travers le monde de lire votre contenu.

Une intégration très facile.

Pour ajouter une telle fonctionnalité sur votre site web, vous avez uniquement besoin de quelques notions en HTML. Même si vous n’êtes pas un informaticien, vous pouvez faire du copié et collé.

C’est 100 % gratuit

Nous parlerons plus tard de l’option avec API. Mais, ce que l’on peut voir c’est qu’intégrer le module de langue sur son site web est gratuite. Vous n’avez pas à payer de frais d’utilisation.

Quelques inconvénients de la librairie JavaScript de traduction

Voici quelques inconvénients.

Ce n’est pas flexible

Utiliser Google pour faire la traduction demande une certaine révision par la suite. En effet, la traduction que la solution de Google propose n’est pas toujours précise et c’est parfois à la limite hors du contexte. Or, lorsque vous utilisez la libraire JavaScript, vous n’avez pas la possibilité de faire des ajustements sur le texte qui les clients voient sur le site web.

Vous êtes contraint d’utiliser le logo de Google sur votre page

Le logo de Google s’affiche pour préciser que le texte est traduit par le la traduction Google. Ce qui dans certains (cas) n’est pas toujours professionnel.

Si vous voulez avoir des conseils dans le choix d’un bon module de traduction pour votre site web, contactez-nous.

Ce n’est pas adapté à un meilleur référencement pour les moteurs de recherche

À moins de faire des ajustements un peu avancer avec la programmation, le contenu que vous proposez ne peut pas être facilement indexé par les moteurs de recherche. Généralement, plusieurs compagnies souhaiteraient avoir des liens unique par langue. Or, avec la traduction JavaScript de Google, le contenu s’affiche avec des langues différentes sur la même page.

2 – Utilisation de Google Translate api

Google Translate API vous donne beaucoup plus option que la librairie JavaScript. En effet, vous pouvez l’utiliser pour intégrer le module de traduction et mieux, ajustez votre contenu pour votre site web. C’est l’option idéal si vous souhaitez être plus professionnel et mieux contrôler ce que vos clients lisent. Dans cette section, nous allons votre comment intégrer Google Translate api dans son projet web. Nous allons nous focaliser aux sites web qui utilise PHP. Pour être en mesure d’utiliser cette approche, vous devez avoir :

  1. Un serveur web avec un accès aux lignes de commande
  2. Une connaissance en PHP
  3. Un compte Google Cloud Console
  4. Vous devez également avoir quelques notions and la gestion des bases de données MySQL

Avant de vous lancer dans cette approche, il est important de noter que L’API Google Translate n’est pas toujours gratuite. Le coût dépend du taux d’utilisation. Par conséquent, lors de l’utilisation, vous devez vous rassurer de faire très attention aux requêtes.

Étapes d’utilisation de Google Translate api

  • Créez l’API pour la traduction via le compte Google Cloud Platform.
  • Téléchargez les SDK (PHP) sur GitHub
  • Utiliser l’exemple que vous trouverez dans le README pour voir comment appliquer la traduction.

À des fins d’optimisation, vous pouvez créer une base de données pour sauvegarder les textes que vous avez traduit. Cela vous permettra d’économiser dans les requêtes afin d’éviter des frais d’utilisation.

Créez votre clé API pour la traduction Google

Création de compte.

Pour créer votre clé API, vous devez partir sur le site web Google Cloud AI pour la traduction.

Comment traduire son site web avec API de traduction Google ou Traduction Google ?

Ensuite, vous devez vous connecter ou créer un compte. En principe, si, vous avez un compte Gmail, vous pourrez l’utiliser pour accéder au compte Google Cloud. Dans un premier temps, il faudra faire la configuration d’une méthode de paiement. Les essais sont gratuits pour une certaine période. vous devez vous référer aux conditions générale de Google pour en savoir plus.

Une fois votre compte créé, vous aurez accès à un écran semblable à ceci :

Exemple d'ecran de Google Cloud

Vous devez ensuite cliquer sur l’icône juste à côté du Logo pour créer un projet.

Il sera tout simplement question de cliquer sur le bouton « Nouveau projet » et ensuite, vous devez Donner :

  1. Un nom à votre projet,
  2. Un compte de facturation
  3. votre organisation
  4. votre zone

Le champ 3 et 4 sont généralement remplis automatiquement par des données que vous avez fourni lors de la création de votre compte.

Créer un compte google cloud

Quand vous cliquerez sur le bouton « Créer », la plateforme va faire la configuration de votre nouveau projet. Vous allez donc pouvoir générer votre clé API.

Générez la clé API.

Pour générer la clé API, vous devez cliquer sur l’icône à Gauche du logo (les trois barres horizontales) et ensuite, cliquez sur l’onglet Marketplace. La plateforme de Google va alors vous rediriger vers la liste des API de Google.

Google cloud Marketplace

Recherchez dans la barre l’API de traduction avec le mot clé « translate ». Vous verrez apparaitre dans la liste « Cloud Translation API ». Pour la suite, vous devez cliquer sur cet API et activer.

Choisir le type de clé et faire une restriction

Une fois que vous aurez créé et activé la clé, il faudra faire le choix du type de clé et restreindre. Dans cette partie, il sera tout simplement question d’aller dans l’onglet API et services, et créer l’identifiant que vous souhaitez utiliser pour votre projet. Avant de le faire, vous devez vous rassurer que vous avez bien sélectionné votre nouveau projet (regarder dans l’onglet en haut droite du logo de Google Cloud). Pour générer un type de clé,

  • cliquez sur les trois barres en haut (gauche du logo)
  • Sélectionnez API et services
  • Ensuite, cliquez sur l’onglet Identifiants

La plateforme Google Cloud vous propose généralement 3 types d’identifiants:

  • La clé API
  • L’ID Client OAuth
  • Le compte de service

Dans le cas de l’AI de Traduction Google, nous avons besoin de la clé API. En fonction de l’approche que vous prendrez, vous pourriez également utiliser l’ID Client OAuth.

Clé API traduction Google

Cliquez maintenant sur le bouton « CREATE CREDENTIALS». Vous devez dans le menu déroulant cliquer sur Clé API. La plateforme va générer une clé que vous devez l’utiliser pour votre projet.

Configuration de l’API

Pour rendre fonctionnelle cette clé, vous devez :

  • configurez l’écran d’autorisation OAuth avec des informations concernant votre application (Vous verrez la notice en haut de votre page). Vous devez cliquer sur le bouton à droite et suivre les instructions
  • Ensuite, vous devez faire une restriction de la clé et la protéger contre l’utilisation en dehors du cadre, vous voulez fixer. Dans ce cas, il faut juste cliquer sur votre nouvelle clé, ajoutez votre URL ou IP du site web.

Pour finir, sélectionner « Restreindre la clé », en bas de la page. Dans les options de restriction, vous devez sélectionner. En effet, avec une clé API, il est possible de l’utiliser sur différent site internet. Par conséquent, une personne qui tomberait sur cette clé pourra en faire usage dans son projet. Ainsi, il est important de restreindre son utilisation pour éviter les frais abusifs. Aussi, vous pouvez utiliser votre clé pour différents types de projets (Ajouter une carte sur votre site web, l’authentification ou la traduction). C’est également pour cette raison que vous devez limiter dans la configuration. Restreindre vous aidera , par exemple, à mieux évaluer le quota d’utilisation.

[the_call_to_action title= »Avez-vous besoin d’un service de professionnel web pour votre site multilingue ? » action_text= »Contactez-nous » action_type= »modal »  action_link= »exampleModal » data_title= »Obtenez le lien de téléchargement l’extension directement dans votre courriel » data_action = »telechargement » data_link= »prositeweb_paiement »]

Utilisation du traducteur Google API sur son site web.

Nous allons dès à présent voir comment ajouter la clé API dans son projet web. En effet, pour être en mesure d’intégrer Google Translate API dans un projet web, il faut impérativement créer la clé comme nous avons vu plus haut. Pour ce qui suit, voici les étapes à suivre:

  • Téléchargez les codes sources de Google Translate (SDK) sur GitHub
  • Suivre la documentation pour voir comment l’implémenter dans votre projet web
  • Ajoutez votre clé API pour activer la possibilité de faire la traduction.

Nous voyons ensemble ce qu’il y a lieu de faire.

Téléchargez les codes sources de Google Translate (SDK) sur GitHub

Pour cette partie, vous devez avoir accès aux lignes de commande pour faire la configuration et télécharger toutes les composantes. En effet, le code de GitHub vous permet d’avoir les elements de base. Cependant, lorsque vous exécuterez les requêtes dans votre ligne de commande, vous pourriez facilement télécharger les elements pour finaliser votre projet. Vous pouvez, par exemple, utiliser puTTY pour connecter à votre serveur via les lignes de commande. Il est également important de dire que pour simplement manœuvrer les codes, vous devez installer la commande composer sur votre serveur web. Vous trouverez via ce lien une documentation qui peut vous aider dans ce processus.

Installation et configuration de Google Cloud PHP Translate

  • Visitez le site web GitHub où se situe le code Google Cloud PHP translate
  • Au niveau de la documentation README.md, vous verrez les instructions à suivre pour installer les codes

Un résumé ci-dessous:

  • Installer Composer pour gérer les dépendances (ressources que vous avez besoin pour le projet)
  • Faire une installation des composantes de Cloud Translate
$ composer require google/cloud-translate

Le site vous recommande pareillement d’installer toute la suite si vous le souhaité.

$ composer require google/cloud

Si vous avez installé Composer sur votre serveur, vous ne devriez pas avoir de problème lors de l’exécution des requêtes ci-dessus.

Créer d’un code exemple pour utiliser Google Cloud Translate

Quand vous aurez fait l’installation des composantes sur votre site web, vous pourrez les inclure dans votre projet. En effet, pour inclure les composantes à votre projet, il suffira d’utiliser « require » de PHP pour appeler le fichier autoload.php. Ce dissous un exemple.

require 'vendor/autoload.php';

Le code de traduction pourrait être semblable à ce que vous avez ci-dessous.


<?php 
require 'vendor/autoload.php';

use Google\Cloud\Translate\V2\TranslateClient;

$translate = new TranslateClient([
    'key' => 'your_key'
]);

// Translate text from english to french.
$result = $translate->translate('Hello world!', [
    'target' => 'fr'
]);

echo $result['text'] . "\n";

// Detect the language of a string.
$result = $translate->detectLanguage('Greetings from Michigan!');

echo $result['languageCode'] . "\n";

// Get the languages supported for translation specifically for your target language.
$languages = $translate->localizedLanguages([
    'target' => 'en'
]);

foreach ($languages as $language) {
    echo $language['name'] . "\n";
    echo $language['code'] . "\n";
}

// Get all languages supported for translation.
$languages = $translate->languages();

foreach ($languages as $language) {
    echo $language . "\n";
}
?>

Vous devez remplacer « your_key » dans l’expression ci-dessous par votre clé API que vous avez créé plus haut.

$translate = new TranslateClient([ 'key' => 'your_key' ]);

Quelques recommandations

  • Afin d’utiliser les ressources de façon optimale, vous pouvez, par exemple, faire la traduction et insérer les données dans une base de données. Cela vous aidera à économiser dans les requêtes et par conséquent les coûts.
  • Vous pouvez étendre l’utilisation de l’API à plusieurs types d’applications. Par exemple, vous pourriez l’utiliser pour créer une extension WordPress, Joomla ou Magento.
  • Ayez en tête que l’utilisation de l’API de Traduction Google peut avoir un coût si vous dépassez la limite de requête gratuite. Ainsi, lors de la programmation, vous devez prendre cela en considération.

Quelques alternatives la traduction Google API.

Utiliser une approche de développement peut valoir la peine si vous faites du développement sur mesure. En effet, plusieurs gestionnaires de contenu comme WordPress, Magento ou Shopify offre déjà la possibilité d’intégrer les ressources tierces pour faire la traduction. À cet effet, avant de vous lancer dans le développement, vous devez explorer sur le marché pour voir s’il n’y a pas de solutions qui cadrent avec votre besoin. Il sera tout simplement question d’évaluer le pour et le contre avant de prendre vos décisions. Ci-dessous quelques exemples de solutions alternatives.

WPML

L’extension WMPL est un outil de traduction pour les sites web WordPress. C’est une solution à laquelle vous pouvez vous abonner pour faire la traduction de votre site web sous WordPress. Cette solution présente ses avantages et ses inconvénients. Cependant, cela peut vous aider à mieux vous focaliser sur votre entreprise.

Weglot

C’est également un autre outil de traduction des sites web WordPress.

Conclusion

Traduire un site web peut-être relativement facile si vous avez les bons outils. En effet, plusieurs solutions sont à votre disposition pour vous assister dans votre processus. Si vous souhaitez travailler avec des experts en la matière pour accomplir un travail de qualité,contactez-nous dès aujourd’hui.

Partager :

npgilblas

Agence de création de site web à Montréal

Voici les 10 meilleurs outils de création de site web WordPress (selon notre sondage)
27 octobre 2022
Comment et pourquoi convertir vos photos en format WebP?
16 novembre 2022

Avez-vous un projet en tête? Contactez notre Agence web pour une évaluation gratuite.

Si vous recherchez une agence web basée à Montréal capable de vous accompagner en développement Backend et Frontend, Contactez-nous.