12-Dossier MULTILANGAGE

un site MULTILINGUE avec Web Acappella
dossier par Clochar
CREER un SITE en 2 LANGUES :
en français et en anglais par exemple
le nombre maximum de langues pour un site pris en compte par WA est de 6
la méthode reste la même si on voulait créer un site en plus de 2 langues
Le principe est que les pages en français sont reproduites avec tous leurs objets et leurs mises en
page, mais que les zones de texte et les titres des boutons sont rendus vierges pour l'on puisse y
taper les textes en anglais . Ce n'est pas le programme qui les traduit comme certains rêveurs
pourraient l'espérer; bien que le programme traduise automatiquement le texte de certains éléments
figés dans la langue choisie, comme les boutons préformartés, (exemple: bouton "Envoyer" du
formulaire de contact qui devient "Send" en anglais)
Vouloir créer son site dès le départ dans les 2 langues, en faisant conjointement les pages en français
et en anglais est irréaliste, car toutes les corrections que l'on fait, dans un va et vient permanent, au fil
de la construction du site seraient à recommencer aussi dans la deuxième langue. Ce n'est donc que
lorsque le site est fini et fonctionne comme l'on veut en français, que l'on peut songer à le traduire
dans une autre langue.
Par précaution faire une sauvegarde du site en français avant de commencer les opérations.
SOMMAIRE
1. Il faut commencer par activer la fonctionnalité multi langage sur le site ..
2. Pour chaque page que vous voulez commune aux 2 langues.....................
3. Les boutons de changement de langue ........................................................
4. Doubles boutons de navigation pour site en 2 langues ..............................
5. Double zone HTLM ..........................................................................................
6. Autres objets mis en double ..........................................................................
2
3
4
5
6
6
Annexe:
7
la méthode GOOGLE
ALLEZ D'ABORD VOIR EN FIN DE DOSSIER
LA METHODE GOOGLE QUI NE DEMANDE AUCUN TRAVAIL
Dossier: Un site multilingue
1
maj 05/10
1 . IL FAUT COMMENCER PAR ACTIVER LA FONCTIONNALITE MULTI
LANGAGE SUR LE SITE
Cliquez dans le menu « Site Web » -« Propriétés du site Web » Le deuxième bouton de cette fenêtre ouvre l'onglet « Gestion du multi langage » qui vous permet de
choisir les langues dans lesquelles vous voulez publier votre site et aussi d'indiquer en dessous la
langue par défaut de votre site (ici le français) qui doit être obligatoirement la langue dans laquelle
vous avez construit le site. Vous pourrez ensuite changer cette préférence, si vous le voulez, quand
le site en anglais sera lui aussi complètement terminé
Cliquez d'abord sur la case « Activer la gestion du multi langage ».
Puis choisissez en cliquant sur le bouton + la langue "Anglais" (vous pouvez en ajouter, en enlever
avec le bouton - et déterminer leur ordre de priorité en les déplaçant avec les flèches haut et bas).
Cette langue sera appliquée sur des éléments pré-formatés comme par exemple le bouton "Envoyer"
du formulaire de contact qui deviendra "Send".
Ce paramétrage met en place la fonctionnalité pour les langues choisies, mais les pages ne
sont pas mises en multi langage ; il faut choisir une par une celles qui auront une version dans
chaque langue; des pages ne comportant que des images par exemple pourraient ne pas avoir des
versions différentes suivant les langues choisies; bien que, la plupart du temps, toutes les pages aient
leurs versions dans les différentes langues.
Après cette activation on va voir apparaitre dans la colonne de gauche au
dessus de l'explorateur de pages les drapeaux français et américain (?) en
grisé (cette zone précédée de l'icone multi langue est appelée barre de
multilangage
Cette barre des langues vous permet d'activer le multi langage sur une page et de passer aisément
d’une langue à l’autre lors de l’édition du site.
Cette barre est uniquement visible lorsque le multi langage est activé sur votre site.
De plus, le menu contextuel qui apparait par un clic droit sur la page va alors comporter
des fonctions supplémentaires liées à ce multi langage
Toute nouvelle page qui sera créée à partir de cet instant sera par défaut considérée comme en
multilangage.
Par contre toutes les pages déjà crées sont considérées comme n'étant pas en multilangage et il
faudra les déclarer une par une comme étant en multilangage ; c'est ce qui va être notre cas puisque
les pages de notre site sont déjà toutes créées.
Dossier: Un site multilingue
2
maj 05/10
2 . POUR CHAQUE PAGE QUE VOUS VOULEZ COMMUNE AUX 2 LANGUES:
Ouvrir la page qui n'est pour l'instant qu'en français et
* en cliquant sur le premier icone qui est devant les drapeaux français et
américain ......Ouvrir l'onglet du multilangage
* et cocher la case: "Activer le multi langage.sur la page courante" ( il n'y a pas à définir les langues
puisqu'elles l'ont été dans les Préférences du Site. Par défaut cette case n'est pas cochée et la page
reste éditée dans la langue principale.
Dans la barre de langues, les drapeaux français et américain sont
maintenant en couleurs.
Les blocs de textes en français sont alors effacés et il n'y a
plus que les zones de texte mais vierges.
LA PAGE EN FRANCAIS SEMBLE PERDUE ;si vous
cliquez sur le drapeau français, les zones restent toujours
vierges
Vous allez d'abord récupérer cette page en français,
* cliquez sur le drapeau français, puis ensuite faites un clic
droit dans la page ; ce qui fait apparaitre un menu.
* Cliquez alors sur "Remplir le texte de la page à partir d'une
autre langue".
* Dans la fenêtre qui suit, sélectionnez "Langue par défaut" et
cliquez sur OK pour valider.
OUF! Vous venez de récupérer votre page en français.
Maintenant dans la barre de langue, cliquez sur le drapeau
anglais ; les zones de texte ainsi que les textes des boutons
redeviennent vierges, pour que l'on puisse y mettre leur
traduction anglaise.
Donc maintenant taper votre texte en anglais sans oublier de
traduire en anglais les textes des boutons de navigation.
Remarque 1
Si vous vouliez par la suite qu'exceptionnellement une page ne soit pas commune aux 2 langues il
faudra pour cette page : par clic droit, aller dans Propriétés de la page et décocher "Activer le multi
langage sur la page courante"; la page n'existera plus, alors, que dans la langue par défaut.
Remarque 2
Si vous voulez qu'un élément de la page n'apparaisse que dans la page en français (ou en
anglais), faites un clic droit sur l'elément et choisir "Masquer l'élément en anglais (ou en
français)" . C'est une nouvelle fonctionnalité introduite par l'activation du multilangage.
Masquer l'élément en "français" signifie que l'élément n'apparait pas sur la version française.
Cette fonctionnalité est très importante par la suite
Remarque 3
Vous aurez un petit problème récurrent, c'est que les textes, une fois traduits, peuvent ne pas avoir la
même longueur et donc les zones de texte devront être calculées pour le texte le plus long pour ne
Dossier: Un site multilingue
3
maj 05/10
pas avoir à refaire votre mise en page en redimensionnant les zones ou les boutons (ce qui est
toujours possible).
En général, les textes en français sont plus longs que les textes en anglais.
3 . LES BOUTONS DE CHANGEMENT DE LANGUE
Ces boutons de langue servent uniquement à changer la langue sur la page sur laquelle on se
trouve
Pour que le visiteur puisse choisir la langue qu'il veut utiliser sur la page où il est, il doit disposer de
boutons avec les drapeaux des langues utilisées.
Or ces boutons de langue ou drapeaux ne sont pas insérés de manière automatique dans les pages;
C'est à nous de les créer.
On trouvera des images de drapeaux ICI http://www.webacappella.fr/crbst_38.html
On insère dans la page un bouton pour chaque langue:
un bouton qui passe la page en version française
et un autre qui passe la page en version anglaise.
Pour cela, il se trouve, qu'avec l'activation du
multilangage, est désormais apparue une nouvelle
rubrique dans le paramétrage d'un lien: le changement
de langue
Le lien du bouton de langue pour la version française sera
d'abord choisi en cliquant sur changement de langue ; ce
qui fera apparaitre, en dessous, un choix secondaire pour
indiquer le type de fenêtre (en général celle sur laquelle on
se trouve donc la fenêtre courante) et pour la langue ; on
choisira Français.
Pour le bouton de langue de la version anglaise on fera de
même
On met ces boutons drapeaux, en général, sur toutes les pages:
Mais on peut aussi choisir de les mettre uniquement sur la page d'accueil (voir plus bas l'obligation de
mettre alors des doubles boutons pour changer de page)
Dossier: Un site multilingue
4
maj 05/10
Pour naviguer à travers le site nous avons sur les pages les boutons de navigation que nous avions
déjà mis lors de la création du site en français, et dont nous avons traduit le titre pour la version
anglaise.
Mais nous allons voir que cela ne suffit souvent pas.
4 . Doubles BOUTONS de NAVIGATION pour SITE EN 2 LANGUES
Supposons dans un premier temps que toutes nos pages possèdent les 2
boutons de changement de langue
Quand on est sur une page en français et que l'on veut la version
anglaise on clique sur le drapeau anglais et on obtient la page en
anglais. Jusque là tout va bien!
Maintenant, quand sur cette page en anglais, on clique sur un
bouton de navigation, pour aller sur une autre page, on est bien
dirigé vers la bonne page mais en version FRANCAISE
Car il est impossible de configurer les liens des boutons afin
de rediriger le visiteur vers la page ET la langue souhaitées.
Ainsi, si le visiteur est Français, aucun problème, il va visiter le site
en français et tout va fonctionner. Par contre, s'il est anglais, il arrive
sur le site en français par défaut et il clique évidemment sur le
drapeau anglais. La page d'accueil en anglais se charge et les
boutons sont en anglais (par exemple: le titre du bouton Produits
ayant été traduit par vous en Products). Quand le visiteur anglais
souhaite ensuite, aller voir la page "Products", il clique sur le bouton
et là, il est redirigé vers la bonne page, mais EN FRANCAIS (langue
par défaut) et s'il veut la page en anglais, il doit recliquer sur le
drapeau anglais situé sur la page française "Produits" (en espérant
qu'on n'a pas oublié de l'y mettre)...
Pour résumer, le bouton a bien changé de langue dans la version
anglaise mais il redirige toujours vers la page en français ( langue
par défaut).
Solution:
Il faut se servir de la propriété de masquage, obtenue avec le clic droit de la souris sur le bouton,
Pour cela, il faut aussi créer les boutons de navigation, en double, sur les pages (un bouton pour
chaque langue):
Sur la page il y aura donc une série de boutons de navigation réservés pour le français et une autre
série de boutons réservés pour l'anglais
- pour la version en français on utilise les boutons de la première série
puis on fait un clic droit sur ces boutons "français" et on choisit "Masquer l'élément en anglais"
puis on fait un clic droit sur ceux de la deuxième série "les anglais" et on choisit "Masquer l'élément en
français"
- pour la version en anglais: on utilise alors les boutons de la deuxième série, seuls visibles
maintenant
donc dans notre exemple
a/ dans la page en français nous créons 2 boutons Produits et Produits; puis on crée un lien sur le
premier bouton vers la page Produits en français et on masque le second bouton
b/ dans la page en anglais les 2 boutons apparaissent, on masque le premier, on traduit le titre du
deuxième en Products et on y crée un lien vers la page Produits en version anglaise
le lien vers les pages se paramètre dans l'inspecteur : onglet "lien", puis "lien vers une page du site"
et, en bas de l'inspecteur dans la nouvelle rubrique, Langue apparue elle aussi avec la mise en
place du multilangage, qui permet de choisir la version de la page vers laquelle on veut rediriger.
Remarque 1
Dossier: Un site multilingue
5
maj 05/10
Les boutons drapeaux peuvent toujours être aussi mis sur les pages pour changer de langue en cours
de navigation.
Remarque 2
Grace aux doubles boutons, notons qu'un bouton peut renvoyer sur des pages totalement différentes
selon la version; par exemple: une page avec des adresses en France pour les Français et une page
avec des adresses en Angleterre pour les Anglais.
5 . DOUBLE ZONE HTLM
Quand une zone de code html est insérée dans la page en français, c'est la même zone que l'on va
retrouver sur la page en anglais
Or, sur la page en français nous aurons fait l'affichage du résultat en français et ce résultat restera en
français sur la page en anglais; Si on modifie le résultat en le traduisant en anglais, dans le code
HTML, sur cette page en anglais, on le modifiera automatiquement aussi sur la page en français
puisque c'est toujours la même zone
De même si on supprime la zone de code html d'une page (français ou anglais) elle se retrouve
supprimée sur l'autre page.
Comme dans le cas précédent, il faut créer 2 zones HTML identiques et se servir de la propriété de
masquage, obtenue avec le clic droit de la souris dans la zone du code Html,
Sélectionner la première zone sur la page en français puis faites "Masquer l'élément en Anglais" ce
qui fera disparaitre la zone concernée sur la page en anglais. Sur l'autre page en anglais, la deuxième
zone HTML avec le même code (mais ou l'affichage du résultat est en anglais) est masquée dans
l'autre langue. Ainsi on obtient 2 zones de code sur chaque page une affichée et une masquée.
le code peut ainsi aussi adapter, l'affichage des résultats au pays ; par exemple un résultat de
distance sera donné en kms pour les Français et en miles pour les Anglais
Astuce pour utilisateurs expérimentés.
La variable "$wa_var.LANG" peut être utilisée n'importe où dans un code HTML et sera remplacée par
le code langue de la page courante. cela peut permettre de faire une seule zone HTML ou l'on
programme un affichage différent en fonction de la langue utilisée.
6 . AUTRES OBJETS MIS EN DOUBLE
La technique du doublage des objets peut évidemment s'appliquer à tous les objets qui renvoient par
un lien sur une autre page.
Le problème que l'on va rencontrer c'est celui des places vides laissées par les objets masqués ; ce
qui va nous demander de les disposer astucieusement.
Un menu dynamique est quasi impossible a mettre en double sur une page.
On devra faire 2 maquettes différentes une pour les pages en français et une pour les pages en
anglais.
Dossier: Un site multilingue
6
maj 05/10
LA METHODE GOOGLE
TRADUCTION GOOGLE AUTOMATIQUE d'un site
NE FONCTIONNE QU'AVEC LES SITES PUBLIES EN HTML
Cette méthode est ultra simple et ne nécessite pratiquement aucun travail, alors que l'effet est
bluffant, mais elle ne fonctionne malheureusement pas avec les sites publiés en flash.
Pour avoir une version de votre site en une langue étrangère, faites appel au service de traduction
Google. http://translate.google.com/translate_tools?hl=fr
Il suffit alors d'inclure dans votre maquette (ou page)un petit script qui
mettra à l'écran la petite boite suivante ci contre
Suivre les instructions pour créer le script
En cliquant sur "Select language" un menu déroulant s'ouvre et on choisi la langue.
Le site est instantanément traduit AUTOMATIQUEMENT mais avec ce que cela représente d'à peu
près. Cependant , la traduction n'est pas mauvaise surtout si les textes de votre site sont écrits avec
des phrases courtes et simples.
ATTENTION les fichiers à visualiser (par exemple un fichier PDF) et les titres "clichés" sous forme
d'images ne sont pas traduits.
Voir comme exemple:
Dossier: Un site multilingue
http://www.maison-salamandre.com
7
maj 05/10