Traduire un site Webflow, étape par étape
Du choix des langues à la publication : la méthode la plus simple pour un site Webflow multilingue.
Webflow propose sa propre solution de traduction, Localize, intégrée au Designer. Elle convient bien aux équipes qui veulent adapter chaque langue à la main : images, mise en page, contenus du CMS. Si ton besoin est plus simple — que ton site existant soit lisible dans d’autres langues, sans le reconstruire — un script de traduction suffit.
Avant de commencer
- Fais la liste des langues dont tu as vraiment besoin. Mieux vaut deux langues soignées que dix approximatives.
- Repère ce qui ne doit pas être traduit : ton nom de marque, des noms de produits, des prix.
- Note ton domaine de production et ton domaine
.webflow.io, pour tester avant de publier.
Installer le script
- Dans le tableau de bord Lingo, ajoute ton site avec ses deux domaines et choisis tes langues.
- Copie la ligne de code fournie.
- Dans Webflow, ouvre Project Settings → Custom Code et colle-la dans Head Code.
- Enregistre, puis publie.
Le code personnalisé ne s’exécute pas dans le Designer : ouvre le site publié pour voir le sélecteur de langue.
Protéger ce qui ne doit pas changer
Dans le Designer, sélectionne l’élément et ajoute la classe notranslate, ou l’attribut personnalisé translate avec la valeur no. Pour un nom de marque répété partout, le glossaire est plus rapide : une seule ligne, et le terme n’est plus jamais traduit.
Un sélecteur à ton style
Le sélecteur flottant fonctionne tel quel. Si tu préfères des liens dans ton menu, crée-les dans le Designer et donne-leur l’attribut data-lingo-lang avec le code de la langue (en, es…). Le lien actif reçoit la classe lingo-active, que tu peux styler comme n’importe quelle classe Webflow.
Relire
Parcours chaque langue une fois, page par page. Les corrections se font dans le tableau de bord et s’appliquent immédiatement à tout le site.