{"id":180,"date":"2020-10-06T15:13:42","date_gmt":"2020-10-06T15:13:42","guid":{"rendered":"https:\/\/cinnk.com\/index.php\/2020\/10\/06\/site-multilingue-joomla\/"},"modified":"2020-10-06T15:13:42","modified_gmt":"2020-10-06T15:13:42","slug":"site-multilingue-joomla","status":"publish","type":"post","link":"https:\/\/cinnk.com\/fr\/site-multilingue-joomla\/","title":{"rendered":"Site Multilingue Joomla!"},"content":{"rendered":"

Joomla 3 propose nativement un syst\u00e8me multilingue tr\u00e8s complet. Dans ce chapitre, nous allons cr\u00e9er un site avec 4 langues, le fran\u00e7ais<\/em> (qui sera la langue par d\u00e9faut), l’anglais<\/em>, l\u2019allemand<\/em> et l’arabe<\/em> (qui se lit de droite \u00e0 gauche).<\/p>\n

Le site utilis\u00e9 pour cet exemple est une installation de Joomla! neuve ne comportant aucune donn\u00e9e d’exemple.<\/p>\n

 <\/p>\n

Installer les packs de langue sur votre site<\/h2>\n

Pour commencer, nous allons devoir installer les packs de langue Joomla! correspondant aux langues que comportera le site. Depuis la version 2.5.7 de Joomla!, l’installation des packs de langue a \u00e9t\u00e9 simplifi\u00e9e et se fait directement depuis l\u2019administration.<\/p>\n

Pour cela, connectez-vous \u00e0 l\u2019administration du site, et rendez-vous dans Extensions \u2192 Gestion<\/em> des langues et cliquez sur le bouton Installation de langues. <\/p>\n

\"installation-de-langues\"<\/p>\n

La page suivante s’affiche :<\/p>\n

\"Installer<\/a><\/p>\n

Installation de langues<\/em><\/p>\n

Vous n’avez qu’\u00e0 cocher les langues que vous souhaitez (dans notre exemple le fran\u00e7ais, l’anglais, l\u2019allemand et l’arabe) et \u00e0 cliquer sur le bouton Installer.<\/p>\n

\"installer2\"<\/p>\n

 En retournant dans  Extensions \u2192 Gestion<\/em> des langues vous devriez avoir la page suivante avec les 4 langues install\u00e9es et le fran\u00e7ais comme langue par d\u00e9faut (si le fran\u00e7ais n’est pas la langue par d\u00e9faut, il suffit de cliquer sur l’\u00e9toile jaune).<\/p>\n

\"Gestionnaire<\/a><\/p>\n

Gestionnaire de langues<\/em><\/p>\n

Nous allons maintenant cr\u00e9er les langues de contenu. Pour cela, cliquez sur l’onglet contenu du menu de gauche. Actuellement, seule une ou deux langues est\/sont disponible(s). Pour cr\u00e9er une nouvelle langue de contenu, cliquez sur le bouton nouveau.<\/p>\n

\"nouveau\"<\/p>\n

 La page suivante s’affiche. Remplissez les param\u00e8tres \u00e0 l’aide du tableau ci-dessous afin de cr\u00e9er une langue de contenu pour chaque langue install\u00e9e sur le site.<\/p>\n

\"nouvelle-langue-de-contenu\"<\/a><\/p>\n

Nouvelle langue de contenu<\/em><\/p>\n

 <\/em><\/p>\n\n\n\n\n\n\n\n\n
 <\/td>\nFran\u00e7ais<\/td>\nAnglais<\/td>\nAllemand<\/td>\nArabe<\/td>\n<\/tr>\n
Titre<\/td>\nFran\u00e7ais <\/td>\nEnglish (UK)<\/td>\nGerman<\/td>\nArabic Unitag<\/td>\n<\/tr>\n
Titre natif<\/td>\nFran\u00e7ais<\/td>\nEnglish (UK)<\/td>\nDeutsch<\/td>\nArabic Unitag<\/td>\n<\/tr>\n
Code de langue<\/td>\nfr<\/td>\nen<\/td>\nde<\/td>\nar<\/td>\n<\/tr>\n
Pr\u00e9fixe d’image<\/td>\nfr<\/td>\nen<\/td>\nde<\/td>\nar<\/td>\n<\/tr>\n
Tag de Langue<\/td>\nfr-FR<\/td>\nen-GB<\/td>\nde-DE<\/td>\nar-AA<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

 <\/p>\n

Menus<\/h2>\n

Bien, toutes nos langues de contenu sont cr\u00e9\u00e9es, nous allons maintenant cr\u00e9er les menus et \u00e9l\u00e9ments de menu associ\u00e9s \u00e0 chaque langue.<\/p>\n

 <\/p>\n

Cr\u00e9ation des menus<\/h3>\n

Rendez-vous dans Menu \u2192 Gestion<\/em> des menus. Actuellement, vous n’avez qu’un seul menu (Main Menu) qui ne contient qu’un seul \u00e9l\u00e9ment de menu (Accueil).
Cochez ce menu, et cliquez sur le bouton Modifier.<\/p>\n

\"modifier\"<\/p>\n

 Afin d’\u00e9viter les confusions, renommez ce menu \u201cMenu Principal \u2013 Tout\u201d et donnez lui le type \u201cmainmenutout\u201d. Puis enregistrez et fermez.<\/p>\n

Cliquez ensuite sur le bouton nouveau.<\/p>\n

\"nouveau\"<\/p>\n

 La page suivante s’affiche. Remplissez les param\u00e8tres \u00e0 l’aide du tableau ci-dessous afin de cr\u00e9er un nouveau menu pour chaque langue install\u00e9e sur le site.<\/p>\n

\"nouveau-menu\"<\/a><\/p>\n

Nouveau menu<\/em><\/p>\n

 <\/em><\/p>\n\n\n\n\n\n\n
 <\/td>\nFran\u00e7ais<\/td>\nAnglais<\/td>\nAllemand<\/td>\nArabe<\/td>\n<\/tr>\n
Titre<\/td>\nMenu Principal<\/td>\nMain Menu<\/td>\nHauptmen\u00fc<\/td>\n\u0627\u0644\u0642\u0627\u0626\u0645\u0629 \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629<\/td>\n<\/tr>\n
Type du menu<\/td>\nmenuprincipal<\/td>\nmainmenu<\/td>\nhauptmenu<\/td>\narabicunitag<\/td>\n<\/tr>\n
Description<\/td>\nMenu principal de la partie fran\u00e7aise du site<\/td>\nMenu principal de la partie anglaise du site<\/td>\nMenu principal de la partie allemande du site<\/td>\nMenu principal de la partie arabe du site<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

 <\/p>\n

Nous avons d\u00e9sormais nos quatre menus, un par langue plus le menu principal du site :<\/p>\n

\"Gestionnaire<\/a><\/p>\n

Gestionnaire de Menus<\/em><\/p>\n

 <\/p>\n

Cr\u00e9ation des \u00e9l\u00e9ments de menu<\/h3>\n

Cr\u00e9ons maintenant un \u00e9l\u00e9ment de menu par d\u00e9faut dans chaque menu. L’\u00e9l\u00e9ment de menu par d\u00e9faut du \u201cMenu Principal \u2013 Tout\u201d est d\u00e9j\u00e0 cr\u00e9\u00e9, il s’appelle \u201cAccueil\u201d. Ce lien de menu est attribu\u00e9 \u00e0 toutes les langues, Joomla! en a besoin mais il ne sera pas affich\u00e9 sur le site.<\/p>\n

Cliquez sur menu principal puis sur le bouton Nouveau, la page suivante s’affiche :<\/p>\n

\"Nouvel<\/a><\/p>\n

Nouvel \u00e9l\u00e9ment de menu<\/em><\/p>\n

1<\/strong><\/span> – Choisissez Articles \u2192 Blog des articles en vedette
2<\/span><\/strong> – Accueil
3<\/strong><\/span> – Menu Principal
4<\/strong><\/span> – Oui
5<\/span><\/strong> – Fran\u00e7ais
Une fois que tout est rempli, cliquez sur le bouton Enregistrer & Nouveau<\/p>\n

Cr\u00e9ez maintenant l’\u00e9l\u00e9ment de menu pour la langue anglaise :<\/p>\n

1<\/span><\/strong> – Choisissez Articles \u2192Blog des articles en vedette
2<\/strong><\/span> – Home
3<\/strong><\/span> \u2013 Main Menu
4<\/strong><\/span> – Oui
5<\/strong><\/span> – English<\/p>\n

Cliquez sur le bouton Enregistrer & Nouveau et cr\u00e9ez l\u2019\u00e9l\u00e9ment de menu pour la langue allemande :<\/p>\n

1<\/strong><\/span> – Choisissez Articles \u2192Blog des articles en vedette
2<\/strong><\/span> – Home
3<\/strong><\/span> \u2013 Hauptmen\u00fc
4<\/strong><\/span> – Oui
5<\/strong><\/span> – German<\/p>\n

Cliquez sur le bouton Enregistrer & Nouveau et cr\u00e9ez l\u2019\u00e9l\u00e9ment de menu pour la langue arabe :<\/p>\n

1<\/strong><\/span> – Choisissez Articles \u2192Blog des articles en vedette
2<\/strong><\/span> – \u0645\u0646\u0632\u0644
3<\/strong><\/span> \u2013 Arabic Unitag
4<\/strong><\/span> – Oui
5<\/strong><\/span> – \u0627\u0644\u0642\u0627\u0626\u0645\u0629 \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629<\/p>\n

Chaque langue poss\u00e8de d\u00e9sormais son \u00e9l\u00e9ment de menu par d\u00e9faut. En cliquant sur le menu Menu de votre administration, vous devriez avoir l’image suivante :<\/p>\n

\"El\u00e9ment<\/a><\/p>\n

Les 4 \u00e9l\u00e9ment de menu par d\u00e9faut<\/em><\/p>\n

 <\/p>\n

Association des \u00e9l\u00e9ments de menu<\/h4>\n

Maintenant que nos \u00e9l\u00e9ments de menu sont cr\u00e9\u00e9s, nous allons les associer entre eux. Pour cela, rendez-vous dans Extensions \u2192 Gestion des Plugins<\/em> et \u00e9ditez le Plugin Syst\u00e8me \u2013 Filtre de langue<\/em>.<\/p>\n

 <\/p>\n\n\n\n
\"Plugin<\/a><\/td>\nActivez simplement le plugin, puis r\u00e9glez les deux param\u00e8tres \u201cChangement de langue automatique\u201d et \u201cAssociations d’\u00e9l\u00e9ments\u201d sur oui.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

 <\/p>\n

Cliquez ensuite sur le bouton Enregistrer & Fermer
Retournez ensuite dans Menu \u2192 Menu Principal<\/em> et \u00e9ditez l’\u00e9l\u00e9ment de menu \u201cAccueil<\/em>\u201d.
Un nouvel onglet est affich\u00e9 dans le menu sup\u00e9rieur \u201cAssociations\u201d. Cliquez sur cet \u00e9l\u00e9ment de menu et appliquez les r\u00e9glages suivants :<\/p>\n

\"Association<\/a><\/p>\n

Association d’\u00e9l\u00e9ments de menu<\/em><\/p>\n

Cliquez ensuite sur le bouton Enregistrer & Fermer.<\/p>\n

\"enregistrer-fermer\"
D\u00e9sormais, un petit chainon s’affiche sur la ligne de cet \u00e9l\u00e9ment indiquant qu’il est associ\u00e9 avec les trois liens de menu concern\u00e9s.<\/p>\n

{loadposition pub-formation-video}<\/p>\n

Modules<\/h2>\n

Cr\u00e9ation des modules affichant les menus<\/h3>\n

Nous allons maintenant cr\u00e9er les modules qui vont afficher ces menus sur le site. Pour cela, rendez-vous dans Extensions \u2192 Gestion des modules<\/em>.<\/p>\n

Logiquement (si vous \u00eates parti d’un Joomla! vierge) vous ne devez avoir que 3 modules. Editez le module \u201cMenu Principal\u201d, renommez-le en \u201cMenu Principal \u2013 Tout\u201d puis d\u00e9sactivez-le.<\/p>\n

\"Gestionnaire<\/a><\/p>\n

Gestionnaire de modules<\/em> <\/p>\n

Cliquez sur le bouton nouveau et choisissez \u201cMenu\u201d, la page suivante s’affiche :<\/p>\n

\"Menu<\/a><\/p>\n

 <\/p>\n

Nous allons cr\u00e9er un module pour chaque menu :<\/p>\n

Le module fran\u00e7ais :<\/p>\n