Badge Webflow Award Winner 2023

Traduction multilingue de son site Webflow avec Weglot : tutoriel

Publié le 
7/11/2021
Modifié le 
24/4/2023
Temps de lecture : 5 min
weglot-digidop-multilingue-website
Écrit par
Florian Bodelot avec un T-shirt Digidop

Florian Bodelot

Co-fondateur

Tutoriel guidé pas à pas de Digidop pour l'intégration de Weglot pour traduire son site web en multilingue.

Points clés à retenir

C’est quoi Weglot ?

Weglot est une technologie sans code "nocode" qui vous permettra de traduire facilement un site web en plusieurs langues.

L'outil propose différents forfaits pour chaque utilisateur en fonction du nombre de langues vers lesquelles il doit traduire et de la quantité de mots sur votre site. Weglot propose une version gratuite qui permet de traduire jusqu'à 2000 mots vers une autre langue.

Les avantages de Weglot ? Notre avis

Nous avons choisis d’utiliser Weglot pour la traduction automatique de nos sites Webflow car l’outil offre :

· une équipe avec un support technique super réactif

· traduction automatique super qualii ! (traduction manuelle disponible)

· utilisation très simple

· un seo multilingue avec la traduction de vos url, meta et tittle pour optimiser le seo de votre site dans toutes langues: site multilingue Weglot

Utiliser Weglot pour son site web étape par étape

🎁 Code promo Weglot -20% : DIGIGLOT

1 - Créer un compte Weglot

  1. Cliquez sur le bouton essayez gratuitement
  2. Remplir le formulaire (mail et mot de passe)
  3. Cliquez sur “create an account”
  4. Validez votre compte en confirmant votre email ( Pas de mails ? Jettez un oeil dans les spams)

2 -  Créer un projet

  1. Donner lui un nom, par exemple : Le site de Digidop
  2. Choisissez votre technologie de site web : Webflow
  3. Cliquez sur : Next

3 - Paramètrage DNS ou Javascprit

Choisir une des deux options de traduction Weglot (DNS ou Javascript)

3-1 Avec paramètrage DNS ( SEO friendly 🙂 )

  1. Entrez votre domain url, exemple : digidop.fr
  2. Le language d’origine de votre site internet, exemple : Français
  3. Le ou les languages de destination, de traduction exemple : Anglais, Espagnol, Allemand.
  4. Ajouter les DNS dans vos paramètres de nom de domaine (GoDaddy, OVH, GoogleMydomains, etc..
  5. Pour quels raisons ? Pour créer des sous domaines de votre site traduit dans les langues. Cela permet de traduire votre site en optimisant le référencement multilingue
  6. CNAME record :  websites.weglot.com
  7. Tester vos réglages ✅
  8. Copiez-coller le code dans votre "custom code" dans la partie "End of the <!-- fs-richtext-ignore --><head tag>" Voir les paramètres settings du cms (Webflow/Wix/Wordpress)
  9. ⚠️ Attention ⚠️ n'oubliez pas de personnaliser votre API key : WG_123456789 à remplacer
<script type="text/javascript" src="https://cdn.weglot.com/weglot.min.js">
<script>Weglot.initialize({ api_key: 'wg_123456789' });</script>

3-2 Avec Javascript publier sur webflow.io (nous le conseillons quand votre site est en phase de développement/test)

  1. Cliquez sur le bouton intégration Javasprit
  2. Choisissez les languages de traduction
  3. Copier-coller le code dans votre custom code (⚠️ Personnaliser votre API key )
  4. Qualifiez votre site avec les 3 paramètres complémentaire et cliquez sur : Go to my translations.

Bravo !🥳 Votre site est traduit. 🇧🇷 🇪🇸  

Simple et rapide à utiliser = un vrai outil nocode ⚡️

4 - Activer la traduction automatique en fonction des paramètres linguistique de votre internaute

Rediriger automatiquement les internautes de votre site en fonction de leurs paramètres linguistiques. (Un visiteur anglais aura la version en "EN" de votre site automatiquement) C'est très simple. Il vous suffit d'aller activer l'auto-switch. 3 clics pour accéder à la page:

Settings > General > Auto-switch ✅

BONUS - Personnaliser le widget de traduction sur votre site Webflow

1- Supprimer le container Weglot

Rapide à configurer :  Settings > Language switcher > custom css > ajouter le code ci-dessous 👇

Suppression du container par défaut de traduction Weglot
.weglot-container { display:none; }

2- Ajouter un container personnalisé 100% webflow native et 100% customisable

Finsweet (comme souvent) à mis en place une ressource incroyable. Des design rapide et simple à configurer. Découvrez le tutoriel et le contenu qui est duplicable dans le Webflow Showcase.

Besoin d'aide pour la création de site web sur webflow ? Notre agence peut vous aider.

Traduire les paramètres SEO dans Weglot

Pour ce faire, vous pouvez lire notre tutoriel pour traduire les paramètres SEO dans Weglot !

Choisir Weglot c'est intégrer un outil de traduction facile à installer et d'excellente qualité. L'outil réponds au bonne pratique concernant le référencement naturel et de nombreux guide existent pour vous accompagner pas à pas dans son utilisation. Connecter avec Webflow (vs Wordpress) pour une utilisation 100% native, sans plugin.  

Code promo -20% aux abonnements Weglot

Oui, le digital doit être accessible à tous et le coût des outils ne doit pas être un frein à vos investissements ! Cadeau, un code promo Weglot dans dans notre espace partenaire😁 # WeglotPartner

projet Flomodia by Digidop
projet Coudac by Digidop
projet Heka by Digidopprojet Flaw by Digidopprojet Morfo by Digidop