Rendre son site internet disponible en plusieurs langues

Dans ce guide, nous allons voir les différentes étapes pour rendre votre site disponible dans une autre langue. 

Cela vous permettra d'augmenter la visibilité de votre site et votre nombre de visiteurs.

Pour simplifier la compréhension de ce guide, nous allons présenter la mise en place la plus répandue sur SiteW, à savoir rendre un site français disponible en anglais.

Bien évidemment, vous pouvez adapter ou répéter les étapes de ce guide dans la langue de votre choix, et autant de fois que vous le souhaitez, pour rendre votre site complétement multilingue !

Préparer la page Arrière-plan

Comme indiqué dans l'éditeur, les modules ajoutés à cette page Arrière-plan seront visibles sur toutes les pages. 

Dans le cas d'un site en plusieurs langues, il faut donc éviter que des modules d'une langue se retrouvent sur les pages d'une autre langue.

1. Pour commencer, rendez-vous dans votre onglet Pages, puis sur votre page Arrière-plan.

2. Sélectionnez tous les modules contenant du texte.

Pour sélectionner plusieurs modules, vous avez deux méthodes possibles : 

• Maintenez la touche Ctrl de votre clavier, puis cliquez sur chaque module que vous souhaitez ajouter à la sélection.
• Maintenez le clic gauche de votre souris et faites un rectangle autour des modules concernés.

Dans les deux cas, dans votre panneau de gauche, vous pourrez constater qu'il affiche une liste des modules sélectionnés.

3. Vous devez, pour l'instant, ignorer vos modules Menu car nous y reviendrons un peu plus tard dans ce guide. Néanmoins, profitez-en pour le renommer, afin de lui donner un nom clair tel que " Menu FR ". Cela rendra les étapes suivantes plus claires.

Pour cela, sélectionnez simplement le menu et dans le panneau de gauche, compléter le champ Nom du menu. 

4. Dupliquez-les vers vos pages françaises actuelles.

Si vous souhaitez qu'un module soit présent sur plusieurs pages de la même langue, dupliquez-le sur chaque page concernée.

Pour dupliquer un ou plusieurs modules, ici aussi, vous avez deux méthodes possibles : 

• Si vous n'avez qu'un module de sélectionner, cliquez sur les trois points " ... " ouvrant le menu contextuel du module, puis cliquez sur Dupliquer.
• Sinon, tout en bas à gauche de votre éditeur, cliquez sur la petite croix, puis cliquez sur Dupliquer.

Dans les deux cas, dans votre panneau de gauche, vous pourrez constater qu'il affiche une liste des pages sur lesquelles les modules sélectionnés peuvent être dupliqués.

5. Supprimez de la page Arrière-Plan les modules que vous venez de dupliquer.

À ce stade, il ne vous reste désormais que quelques éléments sur votre page Arrière-plan : Votre module Menu, vos modules Image ou modules Icône que vous souhaitez voir apparaitre sur chaque page et votre pied de page.

6. Pour ce pied de page, nous allons nous rendre sur chacune de vos pages actuelles (sauf la page Arrière-plan), et, dans le pied de page, faire un clic droit > Personnalisation. 

7. Dans le panneau de gauche, cliquez sur le menu déroulant du pied de page et sélectionnez le choix : Personnalisation de cette page seulement.

Veillez à bien définir votre pied de page ainsi sur toutes vos pages en français.

8. Enfin, retournez sur votre page Arrière-plan, puis dans son pied de page, faites un clic droit > Personnalisation et cette fois-ci, décochez simplement la case Afficher le pied de page.

Vos pages

Vos pages en français possèdent désormais les modules que vous souhaitez conserver dans cette langue. Votre pied de page de chaque page est défini sur Personnalisation de cette page seulement et votre page Arrière-plan est vide de tout module contenant du texte, hormis votre module Menu.

Il est désormais temps d'attaquer la copie de vos pages.

1. Rendez-vous sur votre onglet Pages, puis cliquez sur les trois points "..." à droite du nom d'une page et cliquez sur Dupliquer.

2. Nommez cette page dans son équivalent anglais (dans notre exemple ci-dessous, Accueil devient Home) et surtout, décochez la première case concernant le module Menu déjà présent qui est le menu que nous vous avons invité à renommer en Menu FR. 

En revanche, laissez bien la case du Menu mobile coché.

3. Répétez ceci pour chaque page à créer en anglais.

Ajoutez un lien pour vos visiteurs

Il faut désormais que vos visiteurs puissent facilement naviguer sur votre site d'une langue à une autre. L'un des systèmes les plus intuitifs reste, à ce jour, l'utilisation d'un drapeau des langues disponibles.

1. Rendez-vous sur votre page Accueil et ajoutez un module Image. Puis, dans le panneau de gauche, cliquez sur Choisir une image.

2. Si vous avez vous-même l'image d'un drapeau anglais que vous souhaitez charger et utiliser, vous pouvez le faire depuis l'onglet Mes fichiers Cloud du gestionnaire d'images. Sinon, rendez-vous dans l'onglet Fichier Public sur gestionnaire d'images et tapez tout simplement "drapeau" dans la barre de recherche. Cliquez ensuite sur Chercher et choisissez l'image de votre choix.

3. Votre drapeau anglais désormais visible, cliquez sur Choisir un lien dans le panneau de gauche.

4. Dans la fenêtre de gestion des liens, cliquez sur l'onglet Pages et sélectionnez la page Home. Enfin, cliquez sur Sauvegarder et mettre à jour.

5. Rendez-vous maintenant sur votre page Home et faites la même chose, mais cette fois-ci, en choisissant un drapeau français amenant vers votre page Accueil.

6. Répétez ce processus pour chacune de vos pages dans les deux langues.

Notez que, dans notre exemple, nous ne laissons qu'un drapeau par page, mais certains sites préfèrent constamment afficher les deux drapeaux, quelque que soit la page, pour une navigation encore plus fluide.

2 petites astuces pouvant vous faire gagner du temps

• Vous pouvez désormais naviguer sur vos pages directement via les liens que vous venez de créer en maintenant la touche Majuscule de votre clavier + clic gauche.
• Copiez-collez ou dupliquez votre module Image contenant votre drapeau français sur chaque page en anglais (et vice-versa) et modifiez simplement le lien afin de ne pas avoir à repasser par le gestionnaire d'images pour chaque drapeau.

Vos menus

Vous souvenez-vous lorsque nous disions que nous reviendrions sur les modules Menu ? Eh bien, c'est maintenant. ;) 

1. Rendez-vous sur une de vos pages en français et sélectionnez votre module Menu en français. Cliquez ensuite sur Gérer les pages dans le panneau de gauche.

2. Dans la seconde colonne, décochez les pages en anglais. Normalement, celles-ci sont déjà décochées dans la première colonne si vous aviez bien décoché le "menu FR " lors de la création des pages. Cliquez ensuite sur Mettre à jour pour valider ces modifications comme indiqué ci-dessous.

3. Vos pages en anglais n'affichent actuellement aucun menu : c'est que vous avez parfaitement suivi ce guide. 👌 Rendez-vous donc sur une page en anglais et ajoutez un module Menu.

4. À l'inverse de l'étape 2. ci-dessus, cliquez sur Gérer les pages puis décochez toutes les pages en français, et cette fois-ci dans les deux colonnes, puis cliquez sur Mettre à jour. Profitez-en pour le nommer "Menu EN", par exemple.

Pour la configuration de votre menu en mode mobile, vous allez voir dans l'étape suivante que c'est encore plus simple !

Définir la langue de chaque page

Plus qu'une dernière étape avant de vous lancer dans les personnalisations et les traductions de votre site multilingue.

1. Rendez-vous dans votre onglet Pages, puis cliquez sur les trois points " ... " à droite du nom d'une page et cette fois-ci, cliquez sur Référencement.

2. Descendez tout en bas de l'onglet Général et, dans la rubrique Langue de la page, définissez celle-ci en français et faites de même pour toutes vos pages en français.

3. Faites la même chose pour vos pages en anglais en choisissant, dans la rubrique Langue de la page, l'anglais.

4. Sauvegardez votre site dans le coin supérieur droit de l'éditeur.

Vous pouvez vous rendre sur la version mobile de votre site pour vérifier que les pages affichées dans chaque langue sont bien celles définies.

Astuce MultiLangue

Vous pouvez également définir une page en multi-langue, afin qu'elle soit présente dans votre menu, quelques soit la langue.

Faites traduire vos textes par l'IA !

Désormais, vous pouvez également utiliser notre outil d'intelligence artificielle pour traduire vos textes.

Pour cela, sélectionnez le texte à traduire et, dans la barre d'outil, cliquez sur Améliorer par l'IA.

Vous arriverez sur une première fenêtre, vous proposant plusieurs options : ici, nous allons voir la fonction Traduire le texte.

Sur la page suivante, vous pourrez choisir entre plusieurs langues parmi l'anglais, l'espagnol, l'allemand, l'italien et bien sûr, le français.

Pour faire suite à ce guide, nous allons ici choisir la langue anglaise.

Après quelques secondes d'attente, notre IA vous propose une version traduite de votre texte, que vous pouvez choisir d'accepter ou de refuser.

Félicitations ! 

Votre site multilingue est désormais correctement configuré. Il ne vous reste plus qu'à modifier les modules de ces nouvelles pages afin de traduire leurs contenus.