Webflow - Intégration / Configuration

Guide vidéo : Vous voulez une explication rapide et facile sur la façon de configurer votre site Webflow avec Weglot? Consultez notre tutoriel vidéo pour voir comment intégrer Weglot sur votre site web Webflow!



Ce compte vous permet de visualiser et de gérer toutes vos traductions. Créez simplement un compte Weglot ici


2. Entrez votre nom de domaine et les langues que vous souhaitez (~ 1 minute)

Dans cette étape, vous devez entrer votre nom de domaine et les langues que vous souhaitez. 

**N'AJOUTEZ PAS VOTRE NOM DE DOMAINE TEMPORAIRE se terminant par .webflow.io.

NOTE: Si vous n'avez pas encore acheté votre propre nom de domaine, et que vous n'avez qu'un domaine .webflow.io, cliquez sur "Utiliser l'intégration Javascript" si vous êtes encore dans la phase de test de votre site. Vous pourrez ajouter votre nom de domaine plus tard.

Par exemple:

  • le domaine est weglot-translate-wbflow.com
  • la langue originale est l'anglais
  • la langue traduite est le français

Cliquez sur le bouton "Next" pour passer à l'étape suivante.


3. Configurez les sous-domaines dans les enregistrements DNS (~ 5 minutes)

C'est l'étape où vous configurez votre DNS pour créer et connecter les sous-domaines.

Dans la configuration de votre compte Weglot, vous verrez les entrées DNS suivantes à ajouter (Note: cet exemple est pour la configuration du français):

Pour les besoins de cet exemple, nous utilisons Google Domains comme notre fournisseur de nom de domaine. La plupart des autres fournisseurs d'hébergement ressembleront à celui-ci. N'hésitez pas à nous contacter à support@weglot.com si vous avez besoin d'aide pour cette étape.

Maintenant, allez sur le compte de votre fournisseur de nom de domaine et sur la section ou la page où vous pouvez gérer le DNS (par exemple, dans Google Domains, il est situé sous un onglet sur la barre de menu de gauche appelé DNS).

À ce stade, vous devriez être en mesure de créer de nouvelles entrées dans la section DNS sur votre écran (dans notre exemple, cela se trouve dans dans la section "Custom resource records"). Sélectionnez CNAME comme type d'entrée.

Entrez "fr"(pour ceux qui ajoutent le français) dans la section "Name" et "websites.weglot.com" dans la section "Data".

Si vous avez des problèmes pour trouver ou comment mettre à jour vos enregistrements DNS, nous pouvons vous aider. Il vous suffit de nous écrire à support@weglot.com.

Une fois que vous avez ajouté et sauvegardé les entrées, retournez sur la page Weglot. Vous pouvez cliquer sur "Check DNS" et une icône verte cochée devrait apparaître: cela signifie que tout a été configuré avec succès (Cela peut parfois prendre quelques minutes ou même 10, donc ne soyez pas alarmé si l'icône verte cochée n'est pas encore apparue à côté de votre enregistrement DNS). Cliquez sur "Next".

4. Installez la bibliothèque Weglot (~ 3 minutes)

Il s'agit de l'étape finale, au cours de laquelle vous ajouterez le bouton de changement de langue à votre site Webflow et personnaliserez certains des paramètres de l'application.

C'est simple et rapide, il vous suffit de suivre les étapes suivantes (également illustrées dans le GIF ci-dessous).

  • Allez dans votre espace d'administration Webflow, puis cliquez sur "Settings" > "Custom Code" (le dernier onglet à droite)
  • Allez dans "Head Code", et vous devriez voir un champ intitulé "Add code at the end of the <head>tag:"
  • Copiez-collez le snippet JavaScript qui vous a été fourni sur votre compte Weglot. Il ressemblera à celui qui suit, mais assurez-vous d'ajouter votre clé API réelle au lieu de "YOUR_API_KEY" :
<script type="text/javascript" src="https://cdn.weglot.com/weglot.min.js"></script>
<script>
    Weglot.initialize({
        api_key: 'YOUR_API_KEY',
    });
</script>
  • Cliquez sur le bouton vert, "Save Changes".
  • Publiez vos modifications en cliquant sur le bouton bleu en haut à droite.

Vous avez terminé!

C'est fait! Allez sur votre site web, et vous verrez le bouton de changement de langue apparaître tout en bas à droite. Attendez quelques minutes pour s'assurer que vos sous-domaines sont correctement configurés, puis essayez de changer la langue et vous verrez vos pages traduites.

Bonus: nous avons créé des sélecteurs de langue Webflow que vous pouvez cloner et ajouter à votre site Web! Découvrez-les avec notre Webflow UI Kit.

Vous avez encore besoin d’aide ? Contactez-nousContactez-nous