Joomla- Le Guide Complet

  • Published on
    21-Jul-2015

  • View
    1.660

  • Download
    0

Transcript

Micro Application 20-22 rue des Petits Htels 75010 Paris Tl. : 01 53 34 20 20 Fax : 01 53 34 20 00http://www.microapp.comParis le 08/02/2010 01:02 Client n2334204 HAFSI Jak BP X989X 12000 FRANCE France Fiche didentit Acquisition par tlchargement : Date de la commande : 08/02/2010 00:02 Ouvrage : Joomla! Auteur(s) : MOSAIQUE Informatique Editeur : MICRO APPLICATION, SA ISBN : 978-2-3000-2219-7n de commande : 657062Respectez les droits dauteur. Lexploitation sans autorisation de tout ou partie du prsent ouvrage est un acte de contrefaon puni de 3 ans demprisonnement et de 300.000 damende. Les exceptions ce principe sont strictement limites et dfinies par la loi. Nous vous invitons en prendre connaissance. La prsente Fiche didentit fait partie intgrante de louvrage dont le contenu commence la page suivante...Copyright 2009 Micro Application 20-22, rue des Petits-Htels 75010 Paris 1re dition - Aot 2009AuteurMOSAIQUE Informatique Toute reprsentation ou reproduction, intgrale ou partielle, faite sans le consentement de MICRO APPLICATION est illicite (article L122-4 du code de la proprit intellectuelle). Cette reprsentation ou reproduction illicite, par quelque procd que ce soit, constituerait une contrefaon sanctionne par les articles L335-2 et suivants du code de la proprit intellectuelle. Le code de la proprit intellectuelle nautorise aux termes de larticle L122-5 que les reproductions strictement destines lusage priv et non destines lutilisation collective dune part, et dautre part, que les analyses et courtes citations dans un but dexemple et dillustration.Avertissement aux utilisateursLes informations contenues dans cet ouvrage sont donnes titre indicatif et nont aucun caractre exhaustif voire certain. A titre dexemple non limitatif, cet ouvrage peut vous proposer une ou plusieurs adresses de sites Web qui ne seront plus dactualit ou dont le contenu aura chang au moment o vous en prendrez connaissance. Aussi, ces informations ne sauraient engager la responsabilit de lEditeur. La socit MICRO APPLICATION ne pourra tre tenue responsable de toute omission, erreur ou lacune qui aurait pu se glisser dans ce produit ainsi que des consquences, quelles quelles soient, qui rsulteraient des informations et indications fournies ainsi que de leur utilisation. Tous les produits cits dans cet ouvrage sont protgs, et les marques dposes par leurs titulaires de droits respectifs. Cet ouvrage nest ni dit, ni produit par le(s) propritaire(s) de(s) programme(s) sur le(s)quel(s) il porte et les marques ne sont utilises qu seule fin de dsignation des produits en tant que noms de ces derniers.ISBN : 978-2-300-022197 ISSN : 1950-0289MICRO APPLICATION 20-22, rue des Petits-Htels 75010 PARIS Tl. : 01 53 34 20 20 Fax : 01 53 34 20 00 http://www.microapp.com Support technique : galement disponible sur www.microapp.comRetrouvez des informations sur cet ouvrage ! Rendez-vous sur le site Internet de Micro Application www.microapp.com. Dans le module de recherche, sur la page daccueil du site, entrez la rfrence 4 chiffres indique sur le prsent livre. Vous accdez directement sa fiche produit.2219Avant-proposDestine aussi bien aux dbutants quaux utilisateurs initis, la collection Guide Complet repose sur une mthode essentiellement pratique. Les explications, donnes dans un langage clair et prcis, sappuient sur de courts exemples. En n de chaque chapitre, dcouvrez, en fonction du sujet, des exercices, une check-list ou une srie de FAQ pour rpondre vos questions. Vous trouverez dans cette collection les principaux thmes de lunivers informatique : matriel, bureautique, programmation, nouvelles technologies...Conventions typographiquesAn de faciliter la comprhension des techniques dcrites, nous avons adopt les conventions typographiques suivantes :j gras: menu, commande, bote de dialogue, bouton, onglet. : zone de texte, liste droulante, case cocher, boutonj italiqueradio.jPolice bton : Instruction, listing, adresse internet, texte saisir.j : indique un retour la ligne volontaire d aux contraintes de la mise en page.Il sagit dinformations supplmentaires relatives au sujet trait.Met laccent sur un point important, souvent dordre technique quil ne faut ngliger aucun prix.Propose conseils et trucs pratiques.Donne en quelques lignes la dnition dun terme technique ou dune abrviation.SommaireChapitre 11.1.Le concept du CMS111.2.1.3.1.4.Techniques traditionnelles de construction de sites Internet . 13 Crer un site statique, une technique aujourdhui dpasse . 13 Comprendre les principes des sites dynamiques ............. 16 Comprendre les principes des CMS (serveur web, base de donne, code dynamique) ............................. 17 Les avantages du CMS ............................................ 17 La mise jour immdiate du site ................................. 20 Les principaux CMS du march et leurs spcificits .......... 22 Pourquoi choisir Joomla ........................................... 26 Comprendre le langage XHTML ................................. 27 Comprendre les bases dune page XHTML .................... 28 Comprendre le HTML par lexemple ............................. 30 Check-list ............................................................ 42Chapitre 22.1. 2.2. 2.3. 2.4. 2.5.Installer Joomla432.6.La conguration ncessaire ...................................... 44 Tlcharger Joomla ................................................ 45 Tlcharger et installer un serveur web local ................. 50 Installer Joomla sur un serveur web local ..................... 57 Installer Joomla chez un hbergeur ............................ 66 Les hbergements mutualiss .................................... 66 Les hbergements sur des serveurs virtuels ................... 67 Les hbergements sur des serveurs ddis .................... 67 tude de cas : Installation type chez un hbergeur ........... 68 Check-list ............................................................ 83Chapitre 33.1. 3.2.Se familiariser avec Joomla853.3.Le frontend .......................................................... 86 Le backend .......................................................... 89 Dcouvrir le gestionnaire darticles .............................. 89 Dcouvrir le gestionnaire de menus ............................. 92 Dcouvrir le gestionnaire de mdias ............................. 93 Dcouvrir le principe des templates ............................. 94 Les menus de Joomla ............................................. 97 Le menu Site/Panneau dadministration ........................ 97 Le menu Site/Gestionnaire des utilisateurs ..................... 97 Le menu Site/Gestion des mdias ............................... 984 LE GUIDE COMPLETSommaireLe menu Site/Configuration gnrale ............................ 98 Le menu Site/Dconnexion ....................................... 99 Le menu Menus/Gestion des menus ........................... 100 Le menu Menus/Corbeille de menu ............................ 100 Le menu Menus/Main menu ..................................... 101 Le menu Contenu/Gestion des articles ........................ 101 Le menu Contenu/Corbeille article ............................. 102 Le menu Contenu/Gestionnaire des sections ................ 102 Le menu Contenu/Gestion des catgories .................... 102 Le menu Contenu/Gestion de la page daccueil ............. 103 Le menu Composants/Bannire/Bannires ................... 104 Le menu Composants/Bannire/Clients ...................... 104 Le menu Composants/Bannire/Catgories .................. 105 Le menu Composants/Contacts/Contacts ................... 105 Le menu Composants/Contacts/Catgories ................. 105 Le menu Composants/Fils dactualits/Fils ................... 106 Le menu Composants/Fils dactualits/Catgories ......... 107 Le menu Composants/Sondages .............................. 107 Le menu Composants/Recherche .............................. 108 Le menu Composants/Liens web/Liens ....................... 108 Le menu Composants/Liens web/Catgories ................ 108 Le menu Extensions/Installer/Dsinstaller .................... 109 Le menu Extensions/Gestion des modules ................... 109 Le menu Extensions/Gestionnaire des plugins ............... 110 Le menu Extensions/Gestionnaire des templates ........... 110 Le menu Extensions/Gestion des langues .................... 111 Le menu Outils/Lire les messages .............................. 111 Le menu Outils/crire un message ............................. 111 Le menu Outils/Envoi massif demail ........................... 112 Le menu Outils/Validation gnrale ............................ 112 Le menu Outils/Nettoyer le cache .............................. 113 Le menu Outils/Purger les fichiers expirs du cache ........ 113 Le menu Aide/Aide Joomla! ..................................... 113 Le menu Aide/Infos systme .................................... 114 Check-list .......................................................... 1143.4.Chapitre 44.1. 4.2.Crer des articles115Utiliser les commandes de linterface dadministration ... 116 Dnir les paramtres gnraux ............................... 117 Paramtrer le nom du site ........................................ 118 Paramtrer la longueur des listes ............................... 118 Augmenter la dure de session ................................. 119LE GUIDE COMPLET 5SommaireParamtrer le fuseau horaire ..................................... 120 Changer le login et le mot de passe administrateur ....... 121 Crer des sections ............................................... 122 Crer des catgories ............................................. 125 Crer et modier des articles ................................... 128 Prvisualiser larticle dans une fentre de prvisualisation . 131 Prvisualiser larticle dans le frontend ......................... 132 Mettre en forme le contenu de larticle ......................... 134 Insrer une image dans le texte de larticle .................... 141 Crer un lien hypertexte .......................................... 143 Crer un saut de page dans le texte de larticle .............. 145 Dfinir les paramtres de larticle ............................... 149 Publier larticle en page daccueil ............................... 156 Check-list .......................................................... 1584.3. 4.4. 4.5. 4.6.4.7.Chapitre 55.1. 5.2. 5.3.Administrer les menus1595.4. 5.5. 5.6.5.7.Dsactiver les menus inutiles .................................. 160 Modier un menu existant ...................................... 162 Exploiter les diffrents lments de menu ................... 163 Les fonctionnalits daffichage des liens internes ........... 164 Crer un item de menu pointant vers une page externe .... 172 Crer un item de sparation dans un menu ................... 173 Crer un alias de menu ........................................... 174 Ajouter un item au menu ........................................ 175 Crer un nouveau menu ......................................... 177 Modier les paramtres daffichage dun menu ............ 180 Appliquer un style au menu ...................................... 180 Modifier lordre des menus ...................................... 182 Modifier la position du menu .................................... 183 Modifier le style du menu ......................................... 186 Limiter laffichage du menu certaines parties du site ...... 187 Check-list .......................................................... 187Chapitre 66.1.Utiliser les fonctionnalits natives de Joomla 189Grer les mdias .................................................. 190 Les formats dimages ............................................. 190 Optimiser et retoucher les images pour Internet ............. 192 Le Gestionnaire de mdias ...................................... 195 Grer les niveaux daccs et les utilisateurs ................ 198 Comprendre les niveaux daccs ............................... 1986.2.6 LE GUIDE COMPLETSommaireGrer les niveaux daccs ........................................ 200 Exercice pratique : Cration dun compte de niveau Auteur .. 201 Utiliser la messagerie de Joomla .............................. 210 Consulter les messages .......................................... 211 Supprimer un message ........................................... 212 crire un message ................................................. 212 Utiliser la newsletter .............................................. 213 Effectuer une mise jour de Joomla .......................... 214 Check-list .......................................................... 2166.3.6.4. 6.5. 6.6.Chapitre 77.1. 7.2.Adapter le site avec des composants217Installer un composant .......................................... 219 Faciliter la rdaction des pages avec lditeur JCE ........ 219 Installer lditeur JCE ............................................. 220 Dclarer lditeur JCE comme diteur par dfaut ............ 224 7.3. Grer un site multilingue avec le composant Joom!Fish . 225 Ajouter une langue linterface ................................. 225 Installer Joom!Fish ................................................ 228 Paramtrer la langue de rfrence .............................. 232 Accder aux paramtres gnraux ............................. 233 La traduction dun article ......................................... 236 Traduire directement des contenus ............................ 238 Paramtrer le choix de la langue utilise dans le frontend .. 239 7.4. Grer des documents avec DOCman ......................... 240 7.5. Grer des utilisateurs avec Community Builder ............ 243 7.6. Grer une galerie de photos Phoca Gallery ................. 243 7.7. Grer des newsletters avec Communicator ................. 244 7.8. Grer des groupes avec GMAccess .......................... 245 7.9. Installer de nouveaux templates ............................... 246 Rechercher des templates ....................................... 246 Installer un template tlcharg ................................. 252 Paramtrer un template .......................................... 253 7.10. Check-list .......................................................... 254Chapitre 88.1.Ajouter une boutique en ligne2558.2.Comprendre le concept de VirtueMart ....................... 256 Les points forts de VirtueMart ................................... 256 Le site officiel de VirtueMart ..................................... 257 Installer VirtueMart ............................................... 259LE GUIDE COMPLET 7SommairePremire mthode dinstallation : Installer simultanment Joomla et VirtueMart .............................................. 259 Seconde mthode dinstallation : Ajouter le composant VirtueMart un systme Joomla dj install ................ 263 Installer VirtueMart en franais .................................. 270 Installer les modules de VirtueMart ............................. 272 Dcouvrir la boutique depuis le Frontend ..................... 273 Installer les plugins de VirtueMart ............................... 274 8.3. Choisir le mode daffichage de linterface dadministration de VirtueMart ................................ 275 8.4. Dcouvrir les paramtres de conguration gnrale ...... 278 8.5. Congurer les paramtres de la boutique ................... 279 Dfinir lidentit de la boutique .................................. 280 Dfinir les informations sur la boutique ........................ 283 Dfinir lidentit du responsable contacter .................. 283 Dfinir la devise utilise et le format daffichage des prix ... 284 Saisir la description de la boutique ............................. 286 Saisir les conditions gnrales de vente ....................... 286 8.6. La TVA ............................................................... 288 Lapplication du calcul de la TVA ................................ 288 Appliquer une taxe sur les produits immatriels .............. 289 Utiliser des taux de TVA multiples .............................. 290 Crer les taux de TVA par pays ou rgion ..................... 291 8.7. Crer le catalogue de produits ................................. 292 Crer les fabricants de produits ................................. 292 Crer des catgories de produits ............................... 294 Saisir les produits ................................................. 299 La gestion des stocks ............................................ 318 8.8. Paramtrer les expditions ..................................... 318 Choisir la mthode dexpdition ................................ 319 Dfinir le poids et les dimensions dun produit ............... 320 Lister les transporteurs ........................................... 320 Ajouter un transporteur ........................................... 320 Ajouter un tarif dexpdition ..................................... 321 8.9. Personnaliser les modes de paiements ...................... 322 Activer les moyens de paiement ................................ 322 Les paiements par chques et virements ..................... 323 Les paiements par le systme Paypal .......................... 324 8.10. Consulter ltat des commandes .............................. 326 8.11. Sauvegarder le site web ......................................... 327 Sauvegarde de la base de donnes ............................ 327 Sauvegarde des fichiers .......................................... 328 8.12. Check-list .......................................................... 3308 LE GUIDE COMPLETSommaireChapitre 9Amliorer lindexation dans les moteurs de recherche3319.1. 9.2. 9.3.9.4.9.5.9.6. 9.7.Connatre les principes de fonctionnement de Google ... 332 Rfrencement naturel vs rfrencement payant .......... 335 Comprendre les principes du rfrencement naturel ...... 340 Comprendre les enjeux du rfrencement .................... 340 Comprendre les objectifs et les mthodes de rfrencement .................................................. 343 Connatre les types de rfrencement ......................... 343 Assimiler les mthodes de rfrencement naturel ........... 343 Matriser les tapes du rfrencement ......................... 344 Anticiper le fonctionnement des moteurs de recherche .... 345 Utiliser la longue trane ........................................... 346 Dterminer sa stratgie de positionnement ................. 348 Rechercher des mots-cls ....................................... 348 Utiliser des outils de mesure des mots-cls .................. 348 Optimiser son site pour le rfrencement naturel .......... 356 Indexer son site dans Google ................................... 356 Utiliser le fichier Sitemap ......................................... 356 Augmenter son PageRank ....................................... 357 Diminuer leffet Sandbox ......................................... 360 Optimiser les titres des pages ................................... 361 Activer lURL rewriting ............................................ 361 Optimiser les pages de contenus ............................... 363 Optimiser les images ............................................. 364 Utiliser la balise META description .............................. 364 Utiliser la balise META robots .................................... 365 Utiliser la balise META keywords ................................ 365 Bien choisir le nom de domaine du site ........................ 366 Utiliser des mots-cls dans les noms de dossiers et de fichiers ........................................................ 366 Grer un site multilingue .......................................... 367 tre prsent dans les rponses de recherche universelle ... 367 Avoir recours au rfrencement payant ...................... 369 Utiliser les commandes de Google ............................ 372 allintitle .............................................................. 372 allinurl ............................................................... 374 filetype .............................................................. 374 inanchor ............................................................. 375 info ................................................................... 376 intext ................................................................. 376 intitle ................................................................. 377 link ................................................................... 377 related ............................................................... 378LE GUIDE COMPLET 9Sommairesite ................................................................... 379 define ................................................................ 380 Anticiper les futures techniques de rfrencement ........ 380 Check-list .......................................................... 3819.8. 9.9.Chapitre 10Annexe38310.1. Glossaire ........................................................... 384 A ...................................................................... 384 B ...................................................................... 387 C ..................................................................... 389 D ...................................................................... 391 E ...................................................................... 392 F ...................................................................... 393 G ..................................................................... 394 H ..................................................................... 395 I ....................................................................... 395 J ...................................................................... 397 K ...................................................................... 397 L ...................................................................... 397 M ..................................................................... 398 N ..................................................................... 399 O ..................................................................... 399 P ...................................................................... 400 R ...................................................................... 401 S ...................................................................... 402 T ...................................................................... 403 U ..................................................................... 404 V ...................................................................... 405 W ..................................................................... 405 X ...................................................................... 405 Z ...................................................................... 406 10.2. Adresses Internet utiles ......................................... 406Chapitre 11Index40910 LE GUIDE COMPLETLe concept du CMSTechniques traditionnelles de construction de sites Internet .................................... 13 Comprendre les principes des CMS (serveur web, base de donne, code dynamique) .................................................................................................................. 17 Comprendre le langage XHTML ....................................................................................... 27 Check-list ............................................................................................................................... 42Chapitre 1Le concept du CMSMme sil est dusage de comparer Internet une toile daraigne, limage nest que partiellement fonde En effet, les arachnides ont pour habitude de tisser seules Or la toile du Web, qui stend toujours plus chaque jour, est luvre dun nombre important et croissant dacteurs. Webmestres, informaticiens, scientiques, journalistes, blogueurs, marchands, passionns en tous genres de sujets en tous types ; chacun deux, chacun de nous, tisse, tout instant, une maille supplmentaire, participant ainsi ce fantastique accroissement de la mise en ligne des connaissances technologiques, culturelles et artistiques, rvolution majeure de la dernire dcennie. Chaque jour voit de nouvelles techniques natre, des habitudes changer, des internautes plus curieux mais aussi, forcment, plus presss de savoir, dcouvrir, essayer et galement laisser leur propre trace dans la mmoire sans n du rseau. Plus question, en effet, de se limiter la consultation passive de sites construits uniquement avec des textes et des images. Musiques, lms, forums, chats, messageries instantanes, rponses aux articles sont les lments constituants du Web moderne. Noublions pas le commerce lectronique Cette rvolution dans la rvolution, fonctionnalit balbutiante hier, parfaitement mature aujourdhui, capable de faire vaciller certaines grandes structures commerciales, construites sur des techniques de vente traditionnelles, et qui payent cher lerreur de ne pas avoir anticip la vague dferlante du commerce en ligne. Passionnant mais bouillonnant, pourvoyeur de richesses intellectuelles et nancires pour certains, de rves et de dsillusions pour dautres, le Web est sans merci et ne laisse pas place linefficacit. Que lon soit rdacteur ou commerant, on ne cre plus aujourdhui des pages comme on le faisait il y a encore quelques annes. Performance et rentabilit sont les matres mots de la russite, en matire de gestion du contenu rdactionnel, qui ne peut plus soprer de faon artisanale. Et cest tout naturellement en rponse ce besoin de productivit que sont ns les systmes de gestion de contenu. Lobjectif de ce livre est de vous prsenter Joomla. nos yeux, Joomla est le systme de gestion de contenu le plus abouti et le plus polyvalent. Il est capable, par exemple, de se transformer en forum de discussion, en galerie dimages et surtout, comme vous le dcouvrirez dans la seconde partie de cet ouvrage, en site de commerce lectronique.12 LE GUIDE COMPLETTechniques traditionnelles de construction de sites InternetChapitre 1Quest-ce quun systme de gestion de contenu ? Avant de pouvoir rpondre cette question, il est ncessaire de revenir sur les techniques traditionnelles de ralisation dun site Internet.1.1. Techniques traditionnelles de construction de sites InternetPour comprendre lintrt des systmes de gestion de contenu, il vous faut bien diffrencier les deux familles de sites web en ligne ce jour : les sites statiques et les sites dynamiques.Crer un site statique, une technique aujourdhui dpasseToutes les pages qui composent les sites web que vous visitez, respectent des normes de conception, celles du langage XHTML, nouvelle mouture du langage HTML. Le HTML (Hypertext Markup Language) est un langage de mise en forme de documents, employ an dafficher les contenus des pages web dans les navigateurs Internet. Ce langage est une variante du SGML (Standard Generalized Markup Language). La structure du HTML est fonde sur lutilisation de "balises", instructions permettant la mise en forme des documents, essentiellement composs de textes et dimages. Lune dentre elles est fondamentale, puisquelle autorise la cration de liens "hypertextes", qui permettent, par simple clic sur une chane de caractres ou une image, douvrir une autre page. Cette fonctionnalit, qui autorise les sauts dune page une autre, est lorigine de lexpression "surfer sur le Web". En complment du code HTML, il est frquent de trouver, greffes dans les pages, des fonctionnalits complmentaires, telles que des animations sophistiques en technologie Flash, des vidos ou des morceaux de code Javascript. Ces derniers sont utiliss an de raliser des traitements impossibles en HTML, tels que des validations de donnes dans des formulaires (zones de collectes dinformations structures), des calculs ou encore certains types de menus droulants.LE GUIDE COMPLET 13Chapitre 1Le concept du CMSAutre complment aujourdhui indissociable des pages HTML, les feuilles de style en cascades (dont lextension de chiers est .ccs), traduction franaise de lexpression "Cascading Style Sheet" et dont la fonction est de grer la mise en forme des pages. Lutilisation des feuilles de style a constitu un progrs majeur car elle a simpli considrablement la lecture du code HTML."Page HTML", un abus de langageParler de "pages HTML" est aujourdhui un abus de langage puisque le HTML a t remplac par le XHTML. Cette expression est toutefois trs rpandue et nous lutiliserons dans ce qui suit pour dsigner les pages crites en langage XHTML.La mthode la plus simple, la plus ancienne galement, pour raliser un site web, est celle du "site statique". Dans un tel site, les pages sont crites par le webmestre, en langage XHTML, soit par une saisie totale du code dans un diteur de texte, tel que le Bloc-notes, soit par le biais dun logiciel de cration de pages WYSIWYG tel que Dreamweaver.diteur de texte et gnrateur de code WYSIWYGOn nomme "diteur de texte" un logiciel simple, qui peut tre compar un traitement de texte qui ne disposerait pas de fonctionnalits de mise en forme du texte. Le langage XHTML tant un langage de mise en forme de documents, cest en effet le code de la page et celui de la feuille de style laquelle elle est rattache qui contiennent les instructions de mise en forme.Figure 1.1 : Extrait du code XHTML dune page web, ici affich dans le Bloc-notes, lditeur de texte livr avec Windows14 LE GUIDE COMPLETTechniques traditionnelles de construction de sites InternetChapitre 1Le terme WYSIWYG, quant lui, est un acronyme de What You See Is What You Get. Cette expression, qui peut tre interprte par "Vous voyez ce que vous obtiendrez" est utilise pour dsigner le mode de fonctionnement des logiciels de cration de pages web, tels que le clbre Dreamweaver. la diffrence dun simple diteur de texte, ceux-ci se prsentent sous la forme dun traitement de texte simpli, disposant dune interface ddie la ralisation des mises en forme des textes et des images ainsi quaux insertions dobjets dans les pages tels que des applications en technologie Flash ou de traitements prdnis en langage Javascript. Les actions effectues sont ensuite transformes en langage XHTML, comme si ce dernier avait t tap manuellement dans un diteur de texte.Le plus souvent, la visite dun site web dbute par la page daccueil. Celle-ci se nomme quasi invariablement "Index". Si le site est construit de faon "statique" (entendez "sans utilisation dun langage de programmation gnrant les pages HTML"), elle porte lextension .htm ou .html. Les navigateurs Internet, dont la nalit est dinterprter le code des pages et dafficher le rsultat de cette interprtation, sont programms, lorsquun nom de domaine est saisi dans leur barre dadresse, pour sassurer de lexistence dune telle page et pour louvrir, dans laffirmative. Si tel nest pas le cas, le navigateur affiche un message indiquant quil ne peut afficher la page.Nom et extension dun chierLextension dun chier est le terme indiquant une courte chane de caractres ajouts aprs le nom du chier et qui indique son appartenance une famille. Ainsi, les chiers portant lextension .htm ou .html font partie de la famille des pages web statiques. Nom de chier et extension sont toujours spars par un point.La visite dun site ne commence toutefois pas obligatoirement par celle de la page daccueil, linternaute venant gnralement dun moteur de recherche, pouvant commencer son parcours depuis nimporte quelle page du site et se dplacer vers les suivantes en utilisant les liens hypertextes permettant une navigation sur le site.LE GUIDE COMPLET 15Chapitre 1Le concept du CMSPour un internaute, une autre raison de dbuter son parcours sur un site web peut tre davoir enregistr ladresse de la page dans ses Favoris, encore nomms marque-pages, qui sont des adresses de pages mmorises et stockes dans les navigateurs Internet.Comprendre les principes des sites dynamiquesDeuxime catgorie de sites web, les sites dynamiques se distinguent des sites statiques dans la mesure o les pages qui les composent sont gnres par des programmes, selon les requtes ralises par les internautes, et qui peuvent prendre des formes diverses (zones de texte, cases cocher, listes droulantes, boutons doptions, etc.). Parmi les composants techniques susceptibles de raliser de tels traitements, les plus utiliss sont incontestablement les composants open source Linux (systme dexploitation), Apache (serveur web), PHP (langage de programmation) et MySQL (base de donnes). On retrouve cette conguration chez la quasi totalit des hbergeurs. Nombreuses sont les utilisations qui peuvent tre faites des rouages du Web dynamique : commerce lectronique, en premier lieu, mais aussi forums, blogs, rseaux sociaux, jeux en ligne, pour citer les applications les plus rpandues. Lun des tournants majeurs du Web dynamique, ces dernires annes, a t sa dmocratisation. Petites et moyennes structures commerciales lont adopt, y voyant une technologie beaucoup plus efficace et bien moins coteuse que celle du traditionnel Web statique. Quant aux particuliers, nombre dentre eux lutilisent sans mme en avoir conscience, en publiant leurs articles sur des blogs, par exemple. Facilit de mise jour par interface directement accessible depuis un navigateur web, de nimporte quel poste connect Internet, aucun logiciel installer sur le PC, optimisation du rfrencement dans les moteurs de recherche sont les sduisants atouts du Web dynamique, auxquels il est difficile de rsister. Cest donc trs naturellement sur cette vague que se sont dvelopps les CMS (Systmes de Gestion de Contenu), outils de cration et de mise jour de sites, dont le principal avantage est de dlester le webmestre des16 LE GUIDE COMPLETComprendre les principes des CMSChapitre 1tches de cration des pages pour lui permettre de se concentrer sur le contenu rdactionnel du site.Figure 1.2 : Lditeur de cration de pages en ligne propos par le CMSJoomla1.2. Comprendre les principes des CMS (serveur web, base de donne, code dynamique)Les avantages du CMSLes principes de fonctionnement des systmes de gestion de contenu (dnomms CMS, pour Content Management System ou encore SGC, pour Systme de Gestion de Contenu) sont globalement toujours les mmes. Bien les comprendre est donc un atout important pour un webmestre utilisant Joomla.LE GUIDE COMPLET 17Chapitre 1Le concept du CMSLes CMS sont des systmes de publication sur Internet. Leurs mcanismes sont prfabriqus : dition du contenu des pages (textes et images), fonctionnalits en tous genres qui ncessitaient il y a peu des dveloppements spciques lors de la cration dun site, etc. Implmenter un site web au moyen dun CMS consiste donc paramtrer celui-ci. Le webmestre ayant dj cr, de toutes pices, un site statique via des techniques traditionnelles, sera immdiatement et agrablement surpris par lefficacit dune telle solution, en terme de temps de mise en place (sans les nombreux jours de dbogage et de tests). Sa seconde surprise sera certainement la facilit qui soffrira lui en ce qui concerne la mise jour du contenu ditorial et qui soprera simplement, depuis une interface dadministration en ligne. La quantit de pages quil mettra en ligne sen trouvera certainement accrue, de mme que leur qualit, puisque la tche du webmestre se limitera la rdaction du contenu rdactionnel, laquelle sajouteront quelques oprations simples de mise en forme, opres par les commandes proposes sur linterface. En outre, toute modication effectue (mise jour dun catalogue, date dvnement, modication de tarif, ) sera visible instantanment pour tout visiteur du site. Enn, et cela nest pas le moindre avantage, le webmestre, par simple mise jour de son systme de gestion de contenu, bnciera de toutes les amliorations apportes par lquipe de dveloppement du produit, presque toujours gratuitement puisque issues du monde de lopen source, soucieuse dapporter leur "bb" toutes les nouvelles fonctionnalits qui ne manqueront pas dapparatre sur Internet.Le monde de lopen sourceOn peut traduire ce terme par "source ouverte". Il dsigne les logiciels disposant dune licence autorisant la libre redistribution du produit et dont le code informatique est libre. Les programmes open source sont gnralement de bonne qualit puisque louverture du code de nombreux programmeurs favorise lamlioration des produits.18 LE GUIDE COMPLETComprendre les principes des CMSChapitre 1Ajoutons cette liste, dj longue, darguments positifs en faveur de lutilisation dun CMS, que ce dernier sinstalle en un temps record (moins dune heure en gnral) et il sera ais de comprendre pourquoi tant de personnes utilisent aujourdhui des systmes de gestion de contenu. Intressons-nous maintenant aux principes techniques qui rgissent les CMS, et particulirement Joomla Lide fdratrice est de sparer les contenus proprement parler, que reprsentent les textes, les images et, dune manire gnrale, les objets insrs dans les pages, de leur mise en forme, effectue par un choix en matire de polices de caractres, de couleurs et dhabillage graphique principalement. Les contenus sont stocks dans une base de donnes (MySql dans presque tous les cas), alors que les directives relatives la prsentation sont dans des feuilles de styles, les chiers dans lesquels sont enregistres les particularits de mise en forme des pages du site. Ainsi, il est possible, sans changer une virgule du contenu rdactionnel du site, den modier lapparence radicalement (il suffit de modier la ou les feuilles de style qui leur sont appliques).Figure 1.3 : Sur Joomla, la modication de la mise en forme seffectue par application dun "template"LE GUIDE COMPLET 19Chapitre 1Le concept du CMSVous pourrez, par exemple, utiliser des modles de prsentation diffrents en fonction des priodes de soldes, ou des ftes venir an de changer laspect de votre site, sans modier les textes et les images quil renferme.La mise jour immdiate du siteLun des principaux avantages du CMS est la mise en ligne immdiate de toute modication des pages du site. Pour bien le comprendre, il est ncessaire de commencer par dcrire le mode de fonctionnement de la publication traditionnelle dun site web.Page 1 Page 2 Page etc.PublicationPage 1 Page 2 Page etc.Version locale du siteVersion en ligne du siteOrdinateur du webmestrePlate-forme dhbergementFigure 1.4 : Schma de publication traditionnelle dun site webLorsque le site est construit et mis en ligne de faon traditionnelle, cest--dire sans utilisation dun systme de gestion de contenu (au moyen dun logiciel tel que Dreamweaver, par exemple), le webmestre construit une version "locale" du site sur son ordinateur. Il "publie" ensuite cet ensemble de chiers chez son hbergeur an que le site soit "en ligne", terme synonyme de "accessible depuis Internet". Cette mthode prsente un inconvnient majeur : toute mise jour du contenu rdactionnel du site doit tre suivie dune nouvelle publication, action chronophage, fastidieuse et rptitive. Avec un systme de gestion de contenu, les choses sont diffrentes. Les personnes en charge de la mise jour du contenu rdactionnel du site20 LE GUIDE COMPLETComprendre les principes des CMSChapitre 1voient, comme les internautes, les modications apparatre en ligne ds leur validation, cest--dire immdiatement. La phase de publication est supprime, les donnes tant stockes dans une base de donnes et non plus en tant que pages HTML indpendantes. Ce principe simplie considrablement les choses et rend les travaux de rdaction accessibles tous, y compris aux non informaticiens.Mise jour des donnesPage.phpLes modifications sont visibles immdiatement Poste du webmestreBase de donnesPlateforme dhbergementFigure 1.5 : Schma de la mise jour dun site administr avec JoomlaSur un CMS tel que Joomla, le travail collaboratif est trs facile coordonner (ce qui nest pas le cas lorsque le site est publi de faon traditionnelle. De nombreux rdacteurs peuvent ainsi travailler en mme temps la mise jour du site. On retrouve mme, dans la chane de production, les phases de soumission et de validation des articles qui caractrisent les mthodes de travail de la presse traditionnelle, sur journaux papier. Les auteurs crivent et soumettent leurs articles (qui sont stocks sur le site mais ne sont pas encore visibles des internautes), les diteurs les corrigent ventuellement, puis les valident. Quant aux administrateurs, leur rle est dassurer le bon fonctionnement du systme et de lamliorer. Tous accdent au site via un simple navigateur Internet. Les contenus et la plupart des paramtres sont stocks dans la base de donnes. Quand le site est visit par un internaute, les pages nexistent pas encore, la diffrence des pages HTML qui constituent un site statique.LE GUIDE COMPLET 21Chapitre 1Le concept du CMSElles sont cres dynamiquement, en fonction des demandes (nommes "requtes") effectues par les internautes. Un CMS ne requiert donc aucune installation logicielle sur lordinateur du webmestre. Celui-ci est, en outre, libre de travailler sous le systme dexploitation de son choix (Windows, Linux ou Mac OS). Linterface dadministration du site est affiche dans les navigateurs des auteurs, des diteurs et des administrateurs, avec des fonctionnalits plus ou moins tendues, selon le niveau hirarchique de lindividu (les administrateurs tant les seuls disposer de toutes les fonctions du systme).Les principaux CMS du march et leurs spcicitsMme si Joomla est, nos yeux, le meilleur CMS open source actuellement disponible sur le march, il nest pas le seul systme de gestion de contenu que vous pourrez tlcharger et utiliser. Voici une slection de cinq CMS trs en vogue, ayant chacun ses spcicits.DotclearDotclear est un CMS trs utilis par les blogueurs.Le phnomne des blogsUn blog est une forme de CMS, simple mettre en place, et dont la nalit est de donner son propritaire des outils rapides et efficaces pour gnrer du contenu (le site traite souvent des passions du blogueur et peut prendre la forme dun journal plus ou moins intime). On y trouve frquemment des vidos, ce qui fait de certains blogs des vritables canaux mdiatiques, parallles ceux des grands mdias traditionnels.Ce CMS est tlchargeable, ladresse http://fr.dotclear.org.22 LE GUIDE COMPLETComprendre les principes des CMSChapitre 1Figure 1.6 : Le site de tlchargement de DotclearDrupalDrupal est un CMS rpandu. Il permet la mise en ligne de contenu structur et personnalisable par lajout de modules optionnels. Vous pouvez tlcharger Drupal ladresse http://drupalfr.org/.Figure 1.7 : Le site de tlchargement de DrupalLE GUIDE COMPLET 23Chapitre 1Le concept du CMSJoomlaJoomla est un CMS incroyablement achev, fruit du travail dune quipe de dveloppement open source internationale trs efficace. Comme vous le dcouvrirez plus loin dans cet ouvrage, sa grande polyvalence autorise son emploi pour la cration de tous types de sites web (site personnel, site vitrine dentreprise, espace de tlchargement, forum, intranet, boutique de vente en ligne, etc.).Signication du mot "Joomla"Ce terme semble trouver son origine dans le mot "Jumla" qui, en swahili, signie "tous ensemble".Vous pouvez le tlcharger ladresse http://www.joomla.fr.Figure 1.8 : Le site de tlchargement de JoomlaSpipCet excellent CMS est conu comme un vritable outil de gestion dun journal dinformation en ligne. Il offre nombre de fonctions spciques au monde de la presse.24 LE GUIDE COMPLETComprendre les principes des CMSChapitre 1Spip est tlchargeable ladresse http://www.spip.net.Figure 1.9 : Le site de tlchargement de SpipWordPressWordPress est un CMS trs connu des blogueurs exigeants. Il se caractrise par une grande souplesse dutilisation qui permet galement son emploi pour la cration dun site traditionnel. Vous pouvez le tlcharger ladresse http://www.wordpress-fr.net.Figure 1.10 : Le site de tlchargement de WordPressLE GUIDE COMPLET 25Chapitre 1Le concept du CMSPourquoi choisir JoomlaUn outil trs polyvalent et robuste (Joomla peut aussi bien tre employ pour la ralisation dun simple site vitrine comme pour la construction dune boutique de commerce lectronique), une quipe de dveloppement efficace et une communaut active, assurant la prennit du produit ; voici les critres essentiels qui nous font prfrer Joomla aux autres CMS, mme si nombre dentre eux prsentent des atouts sduisants. On peut ajouter plusieurs points la liste : une gestion des droits simple et efficace, une interface conviviale et complte, un nombre impressionnant de modules complmentaires pouvant se ploguer sur le systme et lui adjoignant pratiquement toutes les fonctionnalits dont a toujours rv un webmestre, sans jamais trouver le temps de les dvelopper. Juridiquement, Joomla est un systme sous licence GNU/GPL (vous donnant le droit dutiliser gratuitement et lgalement le produit), dvelopp sous technologie PHP (en ce qui concerne le langage de programmation) et MySQL (le gestionnaire de base de donnes).Origine de JoomlaJoomla est n en 2005, du fait de dsaccords entre lquipe de dveloppement du CMS open source "Mambo", certains des dveloppeurs du projet prfrant continuer laventure avec un nom diffrent, indiquant ainsi leur rupture avec le projet initial. Quelques annes plus tard, Joomla est devenu un produit dune grande qualit, disposant de facults dadaptation nombreuses tous types de sites (par ajout de modules dextensions, correspondant chacun une fonctionnalit spcique). La version actuelle du systme est la version 1.5. Elle autorise deux mthodes daccs aux donnes : le "frontend" est la partie rserve aux internautes visitant le site et le "backend" est linterface dadministration, accessible seulement aux administrateurs. Joomla se singularise galement par sa gestion de la mise en forme des pages (polices, couleurs, images de fond, boutons, etc.) qui peut tre modie en quelques clics par application de "templates" (modles de mise en forme utilisant les feuilles de style, chiers stockant les paramtres de mise en forme).26 LE GUIDE COMPLETComprendre le langage XHTMLChapitre 11.3. Comprendre le langage XHTMLJoomla vous dcharge de la fastidieuse tche dcriture des pages HTML. Il ne vous est donc plus ncessaire de matriser ce langage pour tre le webmestre dun bon site web. Plus ncessaire, mais pas inutile Qui peut le plus peut galement le moins Lobjectif de cette section nest nullement de faire de vous un expert du HTML (ou, plus exactement, du XHTML, nouvelle version de ce langage) mais de vous permettre den acqurir les bases gnrales qui, vous le dcouvrirez rapidement, sont trs simples. Il vous sera alors possible de comprendre les rouages mis en uvre, derrire lditeur HTML de Joomla et, le cas chant, de savoir comment apprhender le travail et les recherches dinformation effectuer sil vous tait ncessaire de "ploguer" un greffon de code dans vos pages que Joomla ne saurait pas raliser. Ceux dentre vous qui voudront aller plus loin dans lapprentissage du HTML trouveront linformation ncessaire en ligne, sur le Web.Apprendre le langage HTMLRien de plus facile, linformation est la porte de quelques recherches sur Internet. Saisissez, par exemple, "tutoriel html", "didacticiel html", "guide html" ou encore "apprendre le html" dans la zone de recherche de Google. De nombreux liens vous mneront vers de trs instructifs sites web.Rien ne distingue, techniquement, une page web dune autre, puisquelle se doit dtre compatible avec la norme HTML. Quelles soient issues dun blog, dun systme de gestion de contenu, quelles soient tapes la main dans un simple diteur de texte comme le Bloc-notes ou gnres avec un diteur de sites sophistiqu tel que Dreamweaver, les pages affiches dans votre navigateur Internet sont donc normalises et obissent aux mmes rgles de structure : celles du langage XHTML. Ce dernier nest pas un langage de programmation mais un langage de mise en forme du contenu des pages web. la diffrence de la presque totalit des langages de programmation, le code HTML ne ncessite pas linstallation dun environnement (interprteur ou compilateur). Ce sont, en effet, les navigateurs qui servent dinterprteurs. Quant au code, il prend la forme dun simpleLE GUIDE COMPLET 27Chapitre 1Le concept du CMSchier texte, qui peut tre gnr par un logiciel de cration de pages HTML mais peut aussi bien tre saisi avec un simple Bloc-notes, cest--dire un diteur de texte. Certes, Joomla utilise le langage PHP pour gnrer ses pages et interroger ses bases de donnes mais ces traitements sont transparents pour le webmestre qui travaille sur le site depuis linterface dadministration et qui, par exemple, met en forme un article depuis lditeur de pages du CMS. Lors de cette opration, du code du HTML est gnr et une comprhension des rgles syntaxiques employes ne peut qutre quutile.Comprendre les bases dune page XHTMLLa structure de base du code XHTML dune page est la suivante : Quelques explications simposent.Utiliser les balises, bases de la page XHTMLLes balises (ou "tags") sont les lments syntaxiques de base des pages XHTML. Elles dnissent la mise en forme des contenus (textes et images essentiellement) puis sont interprtes par les navigateurs Internet qui affichent alors les pages sous une forme intelligible pour les humains. Conventionnellement, il est dusage de saisir les noms des balises en caractres minuscules et encadrs par les caractres "" (on parle de "chevrons"), sans ajouter despace entre le nom du tag et ces caractres. La plupart des balises vont par paires : laction dune balise de ce type prend n lorsque la mme balise, portant un nom identique prcd du caractre "/", est rencontre par le navigateur Internet, lors de sa lecture squentielle du code XHTML (on parle alors de "balise de n").28 LE GUIDE COMPLETComprendre le langage XHTMLChapitre 1Un nombre limit de balises droge toutefois cette rgle et ne ncessite pas de balises de n. Ainsi, par exemple, la balise permettant linsertion dune image ou celle utilise pour gnrer un simple saut de ligne dans un paragraphe. La syntaxe utilise est alors du type :HTML et traitements squentielsEn informatique, un traitement est dit squentiel lorsque les instructions qui le composent sont lues selon une suite ordonne, gnralement du dbut la n du code. Il existe dautres traitements, susceptibles dtre effectus par des langages de programmation : les traitements rptitifs (rptant une squence) et conditionnels (le rsultat du traitement est dtermin par une condition). XHTML nest pas adapt lexcution de ces deux derniers types de traitements, cest pourquoi XHTML nest pas considr comme un langage de programmation mais comme un langage de mise en forme de documents.Le code XHTML utilise frquemment des balises de manire imbrique : il est ainsi, par exemple, possible dindiquer quune portion de texte est en caractres italiques et quune sous-portion de celle-ci est en caractres gras. Les balises indiquant la mise en forme en gras seront alors comprises dans les balises indiquant la mise en forme en italiques. Voici un exemple de code XHTML, utilisant les balises et , permettant respectivement de dnir des titres de premier niveau et des paragraphes dans une page web :texte texteUtiliser les attributsDe nombreuses balises peuvent tre personnalises par lajout dattributs, qui sont des paramtres permettant de personnaliser les actions des balises.LE GUIDE COMPLET 29Chapitre 1Le concept du CMSCes attributs sont placs aprs le nom de la balise, entre les caractres "". Un espace sert de sparateur entre le nom de la balise et lattribut. La syntaxe gnrale des attributs est la suivante :Voici quelques exemples concrets dutilisation des attributs :(la balise affiche limage voiture.jpg, avec une largeur de 400 pixels et une hauteur de 200 pixels).Le menu du jour(La balise affiche le paragraphe en alignement centr.)Insrer des commentairesDans une page HTML, les commentaires nont pas dincidence sur laffichage dans le navigateur Internet. Ils nen sont pas moins utiles au dveloppeur de la page car ils lui servent de repres et lui permettent de placer les informations de son choix dans la page, an de rendre celle-ci plus intelligible, lors dune relecture ultrieure. Pour tre ignors lors de la lecture de la page par le navigateur Internet, les commentaires doivent tre prcds de la suite de caractres . Voici un exemple de la forme que peut prendre un commentaire dans une page :Comprendre le HTML par lexempleObservez la structure de base dune page XHTML : Le titre de la page qui sera affich dans la Barre de titre du navigateur Internet Le corps de la page, cest--dire le contenu (textes, images et objets) qui sera affich dans la fentre du30 LE GUIDE COMPLETComprendre le langage XHTMLnavigateur Internet Chapitre 1Afficher le code HTML dune page web quelconqueVous pouvez afficher le code de nimporte quelle page HTML parcourue sur le Web. Sur le navigateur Firefox, cette opration seffectue via le menu Affichage/code source de la page. Vous obtiendrez le mme rsultat sous le navigateur Internet Explorer par le menu Affichage/Source.La balise indique le dbut de la page alors que la balise fermante indique la n. Ce sont donc ces deux balises qui encapsulent tout le code de la page. La balise ouvrante et la balise fermante contiennent, quant elles, len-tte, cest dire essentiellement les instructions non affiches dans la page, lorsque celle-ci est ouverte dans un navigateur. Bien que non visibles, ces informations nen sont pas pour autant inutiles. Elles permettent, par exemple, dafficher un titre dans la barre de titre du navigateur (cela est le cas de la paire de balises et ). On place galement dans la zone den-tte des balises utilises par les moteurs de recherche, telles que la balise , dont le rle est de transmettre aux moteurs de recherche une description du contenu de la page. La paire de balises et renferme, comme son nom lindique, le corps de la page, cest--dire toute la partie visible dans la fentre du navigateur. Il nest donc pas tonnant de trouver des centaines ou des milliers de balises imbriques lintrieur de cette paire de balises. Puisque le langage XHTML est un langage interprt, un simple diteur de texte (tel que le Bloc-notes de Windows) et un navigateur, mme non connect Internet, vous suffisent pour raliser le petit exercice qui suit et qui vous permet de comprendre le principe dcriture et daffichage dune page web.1 Lancez le Bloc-notes de Windows en utilisant le bouton Dmarrer/Tous les programmes/Accessoires/Bloc-notes.LE GUIDE COMPLET 31Chapitre 1Le concept du CMSFigure 1.11 : La fentre du Bloc-notes de Windows2 Saisissez le code suivant : Voici une phrase afficher. Figure 1.12 : Le code de la structure de base dune page XHTML, saisi dans le Bloc-notes de Windows3 Enregistrez le chier, via la commande Fichier/Enregistrer sous, dans le dossier de votre choix sur votre ordinateur. Affectez, par exemple, le nom page1.html.32 LE GUIDE COMPLETComprendre le langage XHTMLChapitre 1Extension des chiers HTMLLe Bloc-notes tant un diteur de texte, il affectera par dfaut lextension .txt votre chier si celle-ci est omise, lors de lenregistrement. La page XHTML ne sera alors pas reconnue lorsquelle sera ouverte dans le navigateur. Veillez bien saisir lextension .html, aprs le nom du chier, lors de son enregistrement depuis le Bloc-notes.4 Lancez un navigateur Internet, Internet Explorer, par exemple, puis activez le menu Fichier/Ouvrir. Dans la bote de dialogue Ouvrir qui apparat, cliquez sur le bouton Parcourir et recherchez le chier page1.html prcdemment enregistr. Slectionnez ce chier, cliquez sur le bouton Ouvrir puis sur le bouton OK.Une page blanche est affiche dans le navigateur. Il sagit de votre page XHTML. Vous pouvez le vrier par la lecture de son adresse dans la Barre dadresse de votre navigateur. Elle est vierge car vous ny avez saisi aucun contenu afficher.Figure 1.13 : Le code HTML affiche une page vide5 Laissez le navigateur ouvert et retournez au Bloc-notes. Modiez le code de la page en y ajoutant un contenu textuel entre les balises et , comme dans le code qui suit : Voici une phrase afficher. LE GUIDE COMPLET 33Chapitre 1Le concept du CMSFigure 1.14 : Le code est modi dans le Bloc-notes6 Depuis le Bloc-notes, enregistrez nouveau le chier, en utilisant le menu Fichier/Enregistrer. 7 Retournez dans la fentre du navigateur, que vous aviez laiss ouverte, par la Barre des tches de Windows.Aucune modication nest visible dans le navigateur. La phrase que vous avez ajoute dans le code napparat pas. Ceci est d au fait que la page affiche actuellement est celle qui a t charge dans le cache du navigateur lors du premier essai. Il va vous falloir lactualiser.Cache du navigateur InternetCe terme dsigne une zone de mmoire intermdiaire, dans laquelle sont stockes les dernires pages et images affiches rcemment dans le navigateur. Sa fonction principale est dacclrer laffichage. Il doit tre actualis, si la page consulte a t modie, an de permettre la consultation de la dernire version du document.8 Dans Internet Explorer, cliquez sur le bouton Actualiser (ou appuyez sur la touche [F5]).Figure 1.15 : Le bouton Actualiser du navigateur Internet ExplorerLa page est actualise et la phrase apparat dans la page affiche dans le navigateur.34 LE GUIDE COMPLETComprendre le langage XHTMLChapitre 1Figure 1.16 : La page a t modieVous allez ajouter quelques balises dans le code de la page, an de bien assimiler les bases de limbrication des tags.9 Laissez le navigateur ouvert et retournez au Bloc-notes. Modiez le code de la page en y ajoutant les balises et , an quelles encadrent une zone quelconque de texte, comme dans le code qui suit (cette balise permet de mettre le texte concern en gras) : Voici une phrase afficher. Figure 1.17 : Lajout du code dans le Bloc-notesLE GUIDE COMPLET 35Chapitre 1Le concept du CMS10 Depuis le Bloc-notes, enregistrez nouveau le chier, via le menu Fichier/Enregistrer. 11 Retournez dans la fentre du navigateur, que vous aviez laiss ouverte, par la Barre des tches de Windows. Actualisez la page affiche dans le navigateur.Figure 1.18 : La nouvelle page, aprs quelle ait t actualiseVous allez maintenant placer en italique lun des mots dj en gras, au moyen de la balise .12 Laissez le navigateur ouvert et retournez au Bloc-notes. Modiez le code de la page en y ajoutant les balises et , an quelles encadrent une zone quelconque de texte, comme dans le code qui suit : Voici une phrase afficher. 13 Depuis le Bloc-notes, enregistrez nouveau le chier, par le menu Fichier/Enregistrer. 14 Retournez dans la fentre du navigateur, que vous aviez laiss ouverte, par la Barre des tches de Windows. Actualisez la page affiche dans le navigateur.36 LE GUIDE COMPLETComprendre le langage XHTMLChapitre 1Figure 1.19 : La nouvelle version de la pageVous allez maintenant utiliser une balise ayant une incidence sur la mise en forme des paragraphes. Mais auparavant, une petite exprimentation sera instructive.15 Laissez le navigateur ouvert et retournez au Bloc-notes. Modiez le code de la page en y ajoutant un retour la ligne (touche []) aprs la phrase de texte. Saisissez une ligne de texte quelconque aprs ce retour la ligne, comme dans le code qui suit : Voici une phrase afficher. Ceci est une nouvelle ligne de texte. Figure 1.20 : Un retour la ligne est cr dans le Bloc-notesLE GUIDE COMPLET 37Chapitre 1Le concept du CMS16 Depuis le Bloc-notes, enregistrez nouveau le chier, par le menu Fichier/Enregistrer. 17 Retournez dans la fentre du navigateur et actualisez la fentre.Le retour la ligne nest pas visible dans la fentre du navigateur : les deux phrases sont affiches sur la mme ligne.Figure 1.21 : Le retour la ligne napparat pas dans le navigateurCette manipulation met en vidence le fait que le navigateur, qui agit en tant quinterprteur du code XHTML, naccorde aucune valeur au retour la ligne effectu par la touche [], dans le Bloc-notes. Tout le code XHTML pourrait tre crit sur une seule ligne. Cette disposition entacherait certainement la lecture dun il humain mais nullement celle dun navigateur Internet. Vous pouvez, pour vous en convaincre, supprimer tous les retours la ligne placs dans le code : ceci ne changera rien laffichage de la page dans le navigateur. Un retour la ligne est un paramtre de mise en forme comme un autre. Or, XHTML est un langage de mise en forme de document. Lordre de retourner la ligne doit donc tre donn par une balise. Cest ce que vous allez faire au moyen de la balise , dont la nalit est de crer un nouveau paragraphe. Pour rendre la dmonstration plus pertinente, vous supprimerez mme le retour la ligne cr dans le Bloc-notes en utilisant la touche [].18 Retournez dans la fentre du Bloc-notes. Modiez le code de la page en supprimant le retour la ligne gnr par lutilisation de la touche [] et en le remplaant par une balise , comme dans le code qui suit : 38 LE GUIDE COMPLETComprendre le langage XHTMLChapitre 1 Voici une phrase afficher.Ceci est une nouvelle ligne de texte. 19 Depuis le Bloc-notes, enregistrez nouveau le chier, par le menu Fichier/Enregistrer. 20 Retournez dans la fentre du navigateur et actualisez la fentre.Cette fois, le retour la ligne, cr par la nouvelle balise, est visible dans la fentre du navigateur (voir Figure 1.22). Vous allez ajouter un attribut une balise. Pour ce faire, vous emploierez la balise la plus utilise sur le Web. Il sagit du tag (anchor), qui permet de raliser des liens hypertextes, liant ainsi les pages les unes aux autres.21 Dans la fentre du Bloc-notes, modiez le code de la page comme dans le code qui suit :Figure 1.22 : Le retour la ligne apparat dsormais dans le navigateur Voici une phrase afficher.Ceci est une nouvelle ligne de texte. Cliquez ici pour afficher la deuxime page. LE GUIDE COMPLET 39Chapitre 1Le concept du CMS22 Depuis le Bloc-notes, enregistrez nouveau le chier, par le menu Fichier/Enregistrer. 23 Toujours depuis le Bloc-notes, modiez le code de la page comme suit : Ceci est la seconde page. 24 Enregistrez le chier avec le nom page2.html, par le menu Fichier/Enregistrer sous. 25 Retournez dans la fentre du navigateur et actualisez la fentre.Figure 1.23 : La premire page, affiche dans le navigateur26 Cliquez sur le lien hypertexte, apparaissant en caractres souligns dans la page.La seconde page est affiche dans le navigateur, preuve que le lien hypertexte a fonctionn correctement.40 LE GUIDE COMPLETComprendre le langage XHTMLChapitre 1Figure 1.24 : Le lien hypertexte a permis douvrir la deuxime pageDans cet exemple, lattribut utilis est href (pour "Hypertext REFerence"). Il permet dindiquer quelle page doit tre ouverte lorsque le lien est cliqu (on parle alors de "page cible"). Vous allez maintenant utiliser une balise employe dans len-tte de la page. La balise utilise sera , qui permet daffecter un titre, affich dans la barre de titre de la fentre du navigateur.27 En haut de la fentre du navigateur, observez la barre de titre. Elle affiche ladresse de la page ouverte (ici page2.html), prcde du chemin daccs celle-ci sur votre ordinateur. Vous allez modier cet affichage. 28 Depuis le Bloc-notes, modiez le code de la seconde page comme suit : Ceci est le titre de la deuxime page Ceci est la seconde page. LE GUIDE COMPLET 41Chapitre 1Le concept du CMSFigure 1.25 : Lajout de la balise au code HTML29 Enregistrez nouveau le chier, par le menu Fichier/Enregistrer. 30 Retournez dans la fentre du navigateur et actualisez la fentre.Figure 1.26 : Le titre de la page est visible dans la Barre de titre du navigateur1.4. Check-listj jjjLes CMS ont rvolutionn, en quelques annes, le concept du site Internet. Un CMS est construit autour de trois concepts : les contenus sont stocks dans une base de donnes, les pages sont gnres dynamiquement et le webmestre dispose dune interface de mise jour qui facilite considrablement son travail. Joomla est incontestablement lun des meilleurs CMS du monde OpenSource, capable dintgrer de nombreux composants complmentaires, dont VirtueMart, le composant permettant de transformer le CMS en vritable boutique en ligne. Bien que non obligatoires, quelques notions, dans le domaine de lcriture de pages HTML, aideront le webmestre dun site Joomla dans ses travaux de mise en page.42 LE GUIDE COMPLETInstaller JoomlaLa configuration ncessaire ............................................................................................... 44 Tlcharger Joomla ............................................................................................................. 45 Tlcharger et installer un serveur web local ................................................................ 50 Installer Joomla sur un serveur web local ...................................................................... 57 Installer Joomla chez un hbergeur ................................................................................. 66 Check-list ............................................................................................................................... 83Chapitre 2Installer JoomlaDans la premire partie de cet ouvrage, vous allez dcouvrir comment raliser un site vitrine, cest--dire un site de prsentation de contenus, sans fonctionnalits spciques au commerce lectronique. Mais avant cela, il vous faut installer Joomla. Lopration est possible "en local", cest--dire sur votre ordinateur, an de pouvoir effectuer tous les tests de fonctionnement que vous jugerez utiles et aussi, bien entendu, chez un hbergeur, de sorte que le site soit accessible aux internautes.2.1. La conguration ncessaireQuil soit install en local ou chez un hbergeur, le systme doit disposer, pour fonctionner, de fonctionnalits techniques de base :j j j jle systme de gestion de contenu Joomla, un ensemble de procdures dveloppes dans le langage PHP ; un serveur web (nous utiliserons ici "Apache", le serveur web le plus rpandu) ; le moteur de langage de programmation de pages web PHP (une version postrieure la version 4.3 est requise) ; la base de donnes MySQL.Avant deffectuer linstallation de Joomla, vous devez tlcharger le systme.La trilogie Apache/PHP/MySqlApache est le serveur web le plus employ sur Internet. Il sagit dun logiciel libre pouvant tre mis en uvre sur diffrents systmes dexploitation, tels que Linux ou Windows. PHP est un langage de programmation libre, fonctionnant sur les serveurs web (par le biais dun interprteur PHP). Il permet, lorsquun internaute saisit ladresse dune page portant lextension .php, de gnrer et de retourner une page au format XHTML (format daffichage des pages dans un navigateur Internet tel que Firefox ou Internet Explorer). Cette page, qui navait pas dexistence physique avant la requte de linternaute, peut tre personnalise en fonction de celle-ci, ce que ne permet pas le XHTML traditionnel. MySql est un SGBD (Systme de Gestion de Base de donnes). Cest galement lun des logiciels libres les plus rpandus tant chez les particuliers que les professionnels.44 LE GUIDE COMPLETTlcharger JoomlaChapitre 2Vous allez donc, dans ce qui suit, tlcharger et installer ces composants.2.2. Tlcharger Joomla1 Lancez votre navigateur Internet (Internet Explorer ou Firefox, par exemple) puis connectez-vous au site http://www.joomla.fr.Figure 2.1 : Le site www.joomla.fr2 Cliquez sur le lien de tlchargement de la dernire version 1.5.x (ou ultrieure) de Joomla.Figure 2.2 : Le lien de tlchargement de la version 1.5.xLa version 1.0.xLe site http://www.joomla.fr propose encore, pour quelques mois, le tlchargement de cette ancienne version du systme. Cette option est utiliser uniquement lorsque danciens composants, ne fonctionnant pas encore sur la nouvelle version 1.5.x, doivent tre employs.LE GUIDE COMPLET 45Chapitre 2Installer JoomlaLa page Joomla! 1.5.x : packages dinstallation et patches est affiche.3 Cliquez sur le lien Joomla 1.5.x stable fr propos dans cette page.Figure 2.3 : Le lien de lancement du tlchargementLa bote de dialogue de tlchargement de chiers apparat.Figure 2.4 : La bote de tlchargement46 LE GUIDE COMPLETTlcharger JoomlaChapitre 24 Choisissez denregistrer le chier (sous Internet Explorer, cliquez sur le bouton Enregistrer).La bote de dialogue Enregistrer sous apparat.5 Dans larborescence des dossiers, prsente gauche de la bote de dialogue, placez-vous dans le dossier que vous rservez aux tlchargements puis cliquez sur le bouton Enregistrer.Le tlchargement du chier compress au format zip sopre et dure quelques instants.Figure 2.5 : Le tlchargement est terminLa compression des chiers au format .zipCette extension indique des chiers ayant subi une compression, opration visant rduire la place occupe sur lordinateur. Plusieurs chiers peuvent tre compresss en un seul. Ils doivent tre dcompresss avant usage.6 Cliquez du bouton droit sur le chier et choisissez Extraire tout, dans le menu contextuel qui apparat.La bote de dialogue Extraire les dossiers compresss apparat.LE GUIDE COMPLET 47Chapitre 2Installer Joomla7 Conservez les options proposes et cliquez sur le bouton Extraire de la bote de dialogue.Figure 2.6 : La bote de dialogue Extraire les dossiers compresssLa bote de dialogue suivante mentionne le temps restant ncessaire au systme pour effectuer la dcompression des chiers qui constituent le systme Joomla. Attendez la n de lopration.Figure 2.7 : La dcompression des chiers48 LE GUIDE COMPLETTlcharger JoomlaChapitre 2 la n du traitement, un nouveau dossier est cr. Dans larborescence des chiers, affiche depuis lExplorateur de chiers, il se trouve au mme niveau que celui du chier zipp. Ce nouveau rpertoire renferme les chiers et les dossiers de Joomla non compresss.Figure 2.8 : Les chiers de Joomla, aprs dcompression du chierConservez ces chiers sur votre disque dur ; ils vous seront utiles dans les tapes suivantes.LE GUIDE COMPLET 49Chapitre 2Installer Joomla2.3. Tlcharger et installer un serveur web localLinstallation de Joomla sur un serveur web local, cest--dire sur votre propre ordinateur, nest pas une tape obligatoire. Vous pouvez choisir de linstaller directement chez un hbergeur. Le site sera alors immdiatement en ligne et donc accessible, pour les internautes. Vous dcouvrirez plus loin dans cette section comment installer Joomla chez un hbergeur. Linstallation en local prsente toutefois des avantages :j jvous permettre deffectuer toutes les tapes dune premire installation, donc prendre en main le systme ; une fois celui-ci install, pouvoir raliser tous les essais de votre choix, plus rapidement que chez un hbergeur et sans risquer une interruption de service, inhrente une mauvaise manipulation, ou dobtenir des rsultats indsirables sur votre vritable site web (dans le pire des cas, rien ne vous empchera de tout effacer et de recommencer les oprations, chose toujours plus dlicate, plus longue et entachant limage du site, lorsque cette opration est effectue en ligne).Vous dcouvrirez plus loin comment installer Joomla chez un hbergeur. Pour que Joomla fonctionne localement, vous devez installer un serveur web (il sagira dApache), le moteur de langage PHP ainsi que le systme de gestion de base de donnes MySql. Il existe plusieurs packages de ces trois logiciels. Nous utilisons ici EasyPHP.Apache, PHP et MySql : les packages dinstallationBien quil vous soit possible dinstaller ces trois composants individuellement sur votre ordinateur, il est beaucoup plus simple davoir recours un package dinstallation. EasyPHP nest pas le seul package de ce type, tlchargeable librement sur le Web. Citons notamment XAMPP, pour "X Apache MySQL Perl PHP", quil est possible de tlcharger ladresse http://www.apachefriends.org/fr/xampp.html.1 Tlchargez le chier dinstallation dEasyPHP en vous connectant, depuis votre navigateur Internet, ladresse : http://www.easyphp.org.50 LE GUIDE COMPLETTlcharger et installer un serveur web localChapitre 22 Sur le site, choisissez la langue franaise dans la liste droulante qui vous est propose en haut de page.Figure 2.9 : Le site http://www.easyphp.org3 Cliquez sur le lien tlchargement puis sur le lien lanant le tlchargement de la dernire version dEasyPHP dans la page qui apparat.Figure 2.10 : Le lien de tlchargement4 Effectuez le tlchargement du chier dinstallation en cliquant nouveau sur le lien suivant qui vous est propos. Enregistrez le chier dans le dossier de votre choix.LE GUIDE COMPLET 51Chapitre 2Installer JoomlaFigure 2.11 : Le tlchargement du chier5 Lancez lExplorateur de chiers de Windows en cliquant du bouton droit sur Dmarrer puis en choisissant Explorer dans le menu contextuel. Lancez lexcution du chier tlcharg en double-cliquant sur son icne.Figure 2.12 : Linstallation dEasyPHP est lance par un double-clicLa bote de dialogue Avertissement de scurit apparat.Figure 2.13 : La bote de dialogue Avertissement de scurit52 LE GUIDE COMPLETTlcharger et installer un serveur web localChapitre 26 Cliquez sur le bouton Excuter de la bote de dialogue. 7 Si votre systme dexploitation est Windows Vista, une tape de validation supplmentaire est affiche. Validez cette tape en acceptant lexcution du programme.La bote de dialogue Langue de lAssistant dinstallation apparat.Figure 2.14 : La bote de dialogue Langue de lAssistant dinstallation8 Choisissez le franais puis cliquez sur le bouton OK de la bote de dialogue.La bote de dialogue Installation EasyPHP apparat.Figure 2.15 : La bote de dialogue Installation9 Cliquez sur le bouton Suivant de la bote de dialogue.LE GUIDE COMPLET 53Chapitre 2Installer Joomla10 Acceptez les termes du contrat de licence en cliquant sur le bouton doption idoine puis cliquez sur le bouton Suivant de la bote de dialogue. 11 Linstallateur vous informe quEasyPHP est un environnement de travail, et non un environnement de production. Cliquez sur le bouton Suivant de la bote de dialogue. 12 Linstallateur propose de choisir le dossier dinstallation du logiciel. Effectuez cette opration, ou conservez le dossier propos par dfaut, puis cliquez sur le bouton Suivant de la bote de dialogue.Dossier dinstallationSous Windows Vista, nous avons constat, dans certaines congurations, des problmes de fonctionnement lorsque EasyPHP est install dans le dossier dinstallation propos par dfaut de Windows (le dossier Programmes). Pour pallier ce problme, nous vous conseillons de crer un dossier diffrent (c:\autresprogrammes, par exemple), que vous rserverez linstallation dEasyPHP.13 Ltape suivante est celle de la cration des raccourcis de lancement de lapplication. Conservez les paramtres proposs par dfaut et cliquez sur le bouton Suivant de la bote de dialogue. 14 Ltape suivante rsume les paramtres prcdemment saisis. Cliquez sur le bouton Installer de la bote de dialogue.Figure 2.16 : La bote de dialogue rsumant les paramtres dinstallation54 LE GUIDE COMPLETTlcharger et installer un serveur web localChapitre 2Un tmoin davancement indique que linstallation dEasyPHP est en cours dexcution.Figure 2.17 : Linstallation est en cours lissue du traitement, une dernire bote de dialogue indique que linstallation est termine.Figure 2.18 : La dernire bote de dialogue de lAssistantLE GUIDE COMPLET 55Chapitre 2Installer Joomla15 Cliquez sur le bouton Terminer de la bote de dialogue.Vous allez lancer EasyPHP et vous assurer que le systme fonctionne.16 Cliquez sur le bouton Dmarrer de Windows puis sur Tous les programmes/EasyPHP 3.0/EasyPHP.Le dmarrage du service est symbolis par une petite icne reprsentant la lettre "e" dans la Barre des tches de Windows.Figure 2.19 : Une fois EasyPHP dmarr, son icne est visible dans la Barredes tches17 An de vrier le bon fonctionnement du service, cliquez du bouton droit sur cette icne et choisissez Administration dans le menu contextuel qui apparat.Figure 2.20 : Le menu contextuel, activ par un clic droit sur licnedEasyPHPLa page dadministration des services dEasyPHP est ouverte dans votre navigateur web.56 LE GUIDE COMPLETInstaller Joomla sur un serveur web localChapitre 2Figure 2.21 : La page dadministration des services dEasyPHPVotre serveur web local est maintenant oprationnel. Vous pouvez y installer Joomla2.4. Installer Joomla sur un serveur web localPour utiliser Joomla sur votre ordinateur, vous devez dabord copier les chiers qui composent le CMS sur votre serveur web.1 Activez lExplorateur de chiers de Windows (en cliquant du bouton droit sur Dmarrer puis en choisissant Explorer) et placez-vous dans le dossier EasyPHP 3.0, rpertoire dinstallation dEasyPHP (le dossier Programmes, si vous avez conserv les paramtres dinstallation par dfaut ou le dossier que vous avez stipul lors de linstallation, si vous avez choisi dutiliser dautres paramtres). Sous ce dossier, slectionnez le dossier www. 2 Copiez-y le dossier Joomla_1.5.10-Stable-Full_Package-French qui a t cr lors de la dcompression du chier compress portant le mme nom (ne copiez pas le dossier compress mais le dossier contenant les chiers qui ont t extraits).Particularit du dossier wwwLes sous-dossiers placs dans ce dossier correspondent chacun un site web gr par le serveur Apache, sous EasyPHP.LE GUIDE COMPLET 57Chapitre 2Installer Joomla3 Cliquez du bouton droit puis choisissez Renommez sur le nom du dossier Joomla_1.5.10-Stable-Full_Package-French, an de lui affecter un nom plus signicatif, site1joomla par exemple (nayez pas recours aux espaces, aux caractres spciaux ou accentus pour crire le nom du dossier).Figure 2.22 : Le dossier va tre renomm4 EasyPHP tant dmarr (si tel nest pas le cas, reportez-vous la section qui prcde pour plus dinformations), lancez votre navigateur Internet (Firefox, par exemple), puis saisissez ladresse 127.0.0.1 dans sa Barre dadresse (vous pouvez galement taper localhost, ces deux syntaxes ayant la mme consquence : ouvrir la page daccueil du serveur web install sur votre ordinateur).Figure 2.23 : La page daccueil de votre serveur web58 LE GUIDE COMPLETInstaller Joomla sur un serveur web localChapitre 2La page affiche dans le navigateur prsente tous les sites installs sur votre serveur web.5 Cliquez sur le lien site-1-joomla an de lancer linstallation du systme.Lorsque ladresse dun site Joomla est saisie, le systme teste si linitiation du systme a dj t effectue. Si, comme ici, tel nest pas le cas, le premier cran de linstallateur de Joomla apparat.Figure 2.24 : Linstallateur de Joomla affiche la premire tape du paramtrage initial du systme6 Slectionnez la langue franaise dans la liste Slectionnez la langue puis cliquez sur le lien Suivant, prsent dans la page, pour passer ltape suivante de linstallation.Ltape suivante consiste en une vrication des paramtres du serveur web. La partie suprieure de la page affiche une liste de paramtres devant tous tre ltat Oui, indiquant un paramtrage correct. La partie infrieure de la page, quant elle, indique ltat des paramtres recommands. Pour un fonctionnement optimal et une plus grande scurit, il est prfrable que les paramtres de votre serveur web, indiqus dans la colonne Actuel, correspondent ceux prconissLE GUIDE COMPLET 59Chapitre 2Installer Joomlapar les concepteurs de Joomla, mentionns dans la colonne Recommand. Si tel nest pas le cas, le systme pourra toutefois tre excut.Figure 2.25 : La seconde tape de linstallation7 Cliquez sur le lien Suivant.Dans ltape suivante, vous devez signier votre acceptation de la licence dutilisation de Joomla.Figure 2.26 : Lacceptation de la licence dutilisation8 Cliquez sur le lien Suivant.60 LE GUIDE COMPLETInstaller Joomla sur un serveur web localChapitre 2Ltape qui suit permet de paramtrer la base de donnes utilise par Joomla.9 Dans la liste de la zone Type de la base de donnes, choisissez mysql. 10 Dans la zone Nom du serveur, saisissez localhost. 11 Dans la zone Nom dutilisateur, saisissez root. 12 Dans la zone Mot de passe, saisissez mysql (vous ne risquez pas, dans cette installation, de crer une faille de scurit avec un mot de passe aussi simple car vous utilisez le serveur web de votre propre ordinateur, qui nest pas accessible aux autres utilisateurs ; il vous faudra, bien entendu, saisir un mot de passe quand vous publierez votre site chez un hbergeur). Sur certaines implmentations locales de Mysql, ce champ doit tre laiss vide. 13 Dans la zone Nom de la base de donnes, saisissez, par exemple, joomla1.Figure 2.27 : Ltape de paramtrage de la base de donnes14 Cliquez sur le lien Suivant.Ltape suivante vous permet de paramtrer un accs FTP, utile pour grer des problmes de publication pouvant apparatre chez certains hbergeurs, dans des conditions spciques. Cette fonctionnalit ne vous sera pas utile dans le cas prsent.Figure 2.28 : Ltape de la conguration optionnelle de laccs FTPLE GUIDE COMPLET 61Chapitre 2Installer Joomla15 Cliquez sur le lien Suivant. ltape qui saffiche, vous pouvez dnir les paramtres de conguration initiaux du site. Ces valeurs pourront tre changes ultrieurement.16 Dans la zone Nom du site, saisissez, par exemple, Site Joomla local.Cette information sera visible dans la Barre de titre du navigateur Internet depuis lequel le site est affich.17 Dans la zone Votre email, saisissez votre adresse email. 18 Dans la zone Mot de passe de ladmin, saisissez le mot de passe qui vous permettra de vous identier lors de vos accs linterface dadministration. 19 Dans la zone Confirmer le mot de passe admin, saisissez nouveau le mot de passe. 20 Cliquez sur le bouton Installer les donnes dexemple (an dinsrer dans la base de donnes quelques articles ctifs et de copier dans le site les images utilises par ces exemples). 21 Cliquez sur le lien Suivant.Figure 2.29 : Ltape dinstallation des donnes dexemple la dernire tape, il vous est indiqu que linstallation sest droule normalement. Vous tes inform que vous devez dtruire le dossier62 LE GUIDE COMPLETInstaller Joomla sur un serveur web localChapitre 2installation, dans larborescence de rpertoires du systme Joomla quevous venez de mettre en place sur votre serveur web local. Cette opration a pour but de vous protger contre une tentative ventuelle de piratage, pendant laquelle un pirate informatique pourrait excuter une nouvelle fois la procdure dinstallation an de sapproprier le site.Figure 2.30 : Le message vous indiquant que vous devez dtruire lerpertoire22 Ne fermez pas votre navigateur Internet et lancez lExplorateur de chiers de Windows (en cliquant du bouton droit sur le bouton Dmarrer, dans la Barre des tches, puis en choisissant Explorer dans le menu contextuel qui apparat). Positionnez-vous dans le rpertoire dinstallation dEasyPHP (le dossier Programmes, si vous avez conserv les paramtres proposs linstallation). Recherchez le dossier www puis, sous ce dernier, le dossier renfermant les chiers de Joomla (site-1-joomla, dans notre exemple). Sous ce rpertoire, supprimez le dossier installation en le slectionnant puis en appuyant sur la touche [Suppr] (voir Figure 2.31). 23 Retournez sous le navigateur Internet et cliquez sur le bouton Site, an daccder la partie publique du site.Vous visualisez la partie publique de votre site, cest--dire celle qui sera accessible aux internautes. Cette premire maquette utilise les donnes dexemples implmentes lors de linstallation, ainsi quune mise en forme par dfaut, modiable ultrieurement (voir Figure 2.32).LE GUIDE COMPLET 63Chapitre 2Installer JoomlaFigure 2.31 : La suppression du dossier peut galement tre effectue via le menu contextuelFigure 2.32 : La partie publique du site64 LE GUIDE COMPLETInstaller Joomla sur un serveur web localChapitre 2Vous allez maintenant accder linterface dadministration du site, cest--dire lespace qui vous est rserv et depuis lequel vous pourrez modier le site.24 Ouvrez un nouvel onglet dans votre navigateur Internet (par la commande Fichier/Nouvel onglet) et saisissez ladresse de ce dernier, en ajoutant celle-ci la chane de caractres /administrator. Dans cet exemple, le chemin daccs est http://localhost/site1joomla/administrator.La page de connexion linterface dadministration de Joomla apparat.Figure 2.33 : La connexion linterface dadministration de Joomla25 Dans la zone Identifiant, saisissez admin.Cet identiant est le nom dutilisateur cr par dfaut linstallation de Joomla. Il vous sera possible de le modier ultrieurement depuis linterface dadministration du systme, an daccrotre la scurit. Cette opration nest pas utile dans le cas prsent, car vous travaillez sur un serveur web local. Lorsque le site sera publi chez un hbergeur, il sera, en revanche, conseill de changer cet identiant.26 Dans la zone Mot de passe, saisissez le mot de passe que vous avez dni lors de linstallation. 27 Cliquez sur le bouton Connexion.La page daccueil de linterface dadministration de Joomla est affiche.LE GUIDE COMPLET 65Chapitre 2Installer JoomlaFigure 2.34 : Linterface dadministration de Joomla2.5. Installer Joomla chez un hbergeurLes socits dhbergement de sites web, communment appeles "hbergeurs" ont pour fonction de permettre aux webmestres de publier (cest--dire dposer) leurs sites web sur des serveurs. Les sites sont ainsi accessibles depuis Internet, 24 heures sur 24. En matire dhbergement, plusieurs solutions sont proposes.Les hbergements mutualissDans ce type dhbergement, le plus rpandu (et le moins coteux), un mme serveur est partag an dassurer lhbergement dun grand nombre de sites. Cet hbergement est adapt dans la majorit des cas car lespace de stockage des pages du site est largement suffisant (plusieurs gigaoctets, gnralement).66 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 2GigaoctetUn octet est une unit de mesure correspondant la quantit de stockage ncessaire pour contenir un caractre. Un kilooctet (ko) correspond 1 024 octets, soit 1 000 octets environ. Un mgaoctet (Mo) correspond 1 000 ko environ soit un million de caractres. Un gigaoctet (Go) correspond 1 000 Mo environ soit un milliard de caractres.Si le nombre dinternautes connects simultanment augmente de manire consquente (plus de 50 visiteurs), les dlais de chargement des pages deviendront plus levs et il conviendra denvisager un type dhbergement plus important.Les hbergements sur des serveurs virtuelsDans ce cas, le webmestre gre son propre serveur, dit "virtuel", cest--dire mul sur un ordinateur sur lequel plusieurs serveurs du mme type sont implments. La puissance offerte par le systme est suprieure celle dun hbergement mutualis mais moindre que celle dun serveur "ddi".Les hbergements sur des serveurs ddisIci, le webmestre administre intgralement le serveur web, ce qui demande plus de connaissances techniques de sa part. Cette solution permet la connexion simultane dun grand nombre dinternautes au site web. Le cot de ce type dhbergement est, bien entendu, plus lev. De nombreux hbergeurs proposent des systmes de ce type "cls en mains", prinstalls et faciles administrer. Les hbergements sont proposs sur systmes dexploitation Linux ou Windows. La premire catgorie est la plus adapte une installation de Joomla.LE GUIDE COMPLET 67Chapitre 2Installer Joomlatude de cas : Installation type chez un hbergeurOuvrir un compte chez un hbergeurLa quasi-totalit des hbergeurs actuels implmentent systmatiquement les technologies Apache, Php et MySql sur leurs machines. Linstallation de Joomla est donc facilement ralisable dans la majorit des cas, chez la plupart des hbergeurs. titre dexemple, voici dcrite linstallation dun systme Joomla chez lhbergeur 1and1. Vous pouvez bien entendu effectuer une procdure similaire chez dautres hbergeurs.1 Connectez-vous ladresse http://.1and1.fr.Figure 2.35 : La page daccueil de lhbergeur 1and12 Cliquez sur le lien Hbergements Linux.68 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 2La page Hbergement mutualis Hbergement Linux apparat. Plusieurs solutions dhbergements mutualiss vous sont proposes.3 Cliquez sur lhbergement de votre choix et suivez la procdure dinscription an de contracter un abonnement (choisissez le mieux adapt la taille et au taux de frquentation prvisionnels de votre site).Figure 2.36 : Le choix dun type dhbergementHbergement gratuit ou payantLe cot de lhbergement est aujourdhui assez faible (quelques euros par mois). Vous pouvez galement opter pour une solution entirement gratuite, si vous utilisez lespace offert par votre fournisseur daccs Internet (Free, par exemple). Toutefois, les plateformes dhbergement payantes mettent votre disposition des fonctionnalits dadministration plus volues et disposent de caractristiques techniques plus importantes (possibilit de dposer plusieurs noms de domaines, bandeLE GUIDE COMPLET 69Chapitre 2Installer Joomlapassante et espaces de stockage levs, trac, cration de comptes emails rattachs aux noms de domaines, etc.).Importance de la bande passante et du tracLa bande passante correspond au dbit de donnes ; cest--dire la quantit de donnes pouvant circuler sur le systme en un temps donn. Elle est quantie en bits par seconde. Une bande passante leve permet de diminuer le temps daffichage des pages du site. Le terme trac mensuel indique, quant lui, la quantit de donnes changes en un mois. Il dpend du nombre de pages visites mais aussi du poids des objets, images notamment, quelles renferment. Ainsi est-il conseill de toujours rduire la taille des chiers images affichs dans les pages, en conservant le meilleur compromis qualit/poids.Une fois le service ouvert, vous disposez dune interface dadministration vous permettant de grer votre espace chez lhbergeur. Vous allez vrier quil vous est dsormais possible daccder cette interface.4 Cliquez sur le lien Accs client.Figure 2.37 : Le lien permettant laccs votre espace dhbergementLa page Espace client apparat.5 Saisissez le code client et le mot de passe rattach, qui vous ont t communiqus par votre hbergeur an de vous permettre de vous authentier. Cliquez sur le bouton Connexion.70 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 2Figure 2.38 : La saisie du code client et du mot de passeLinterface dadministration est affiche dans votre navigateur.Figure 2.39 : Linterface dadministrationPublier les chiers de Joomla chez lhbergeurLa mise en place de Joomla chez un hbergeur est identique celle que vous avez prcdemment ralise sur votre serveur local. Vous devez toutefois disposer dun logiciel de transfert FTP an de transfrer les chiers qui constituent le CMS sur votre espace dhbergement.LE GUIDE COMPLET 71Chapitre 2Installer JoomlaLe protocole FTPCe terme, acronyme de File Transfer Protocole, dsigne lun des protocoles de communication les plus rpandus, permettant ladressage de chiers sur les rseaux TCP/IP. Il est employ dans de trs nombreuses circonstances, pour lchange et ladministration des chiers dordinateur ordinateur.1 Tlchargez puis installez sur votre ordinateur un logiciel de transfert FTP. Lun des plus utiliss de ces programmes est Filezilla. Vous pouvez tlcharger ce logiciel open source ladresse http://www.filezilla.fr ou utiliser le logiciel de transfert FTP de votre choix.Figure 2.40 : Le site de tlchargement de Filezilla2 Depuis linterface dadministration de votre espace dhbergement, affiche prcdemment dans la fentre de votre navigateur Internet, cliquez sur le lien Accs FTP, an daccder 72 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 2votre identiant FTP et son mot de passe associ (ces paramtres sont requis pour effectuer la connexion en FTP depuis le logiciel Filezilla).Figure 2.41 : Le lien permettant daccder vos paramtres FTP3 Lancez Filezilla an de vous connecter votre espace dhbergement. Dans le logiciel, saisissez ladresse de lespace dhbergement, le nom dutilisateur et son mot de passe rattach. Ces paramtres vous ont t fournis ltape 2. Cliquez sur le bouton Connexion rapide.Figure 2.42 : Adresse de lordinateur hte, nom dutilisateur et mot de passe sont des paramtres qui vous sont fournis par votre hbergeur et que vous devez entrer dans le logiciel de transfert FTP4 Dans votre espace dhbergement, gurant dans la partie droite du logiciel nomme Site distant, cliquez du bouton droit sur licne reprsentant la racine de larborescence de chiers et choisissez Nouveau dossier dans le menu contextuel qui apparat.Figure 2.43 : La cration du nouveau dossier sur le site distant5 Affectez un nom signicatif ce dossier (pour viter dventuels problmes, utilisez uniquement des caractres minuscules, sans espaces et sans accents ni caractres spciaux pour nommer le dossier).LE GUIDE COMPLET 73Chapitre 2Installer JoomlaFigure 2.44 : Un nom signicatif est affect au dossier6 Dans la partie gauche du logiciel, slectionnez le contenu du dossier Joomla_1.5.10-Stable-Full_Package-French, prcdemment cr lors de la dcompression du chier zipp du mme nom. Pour ce faire, cliquez sur le nom du dossier dans la partie suprieure gauche de la fentre de Filezilla, nomme Site local. Cliquez sur un nom de dossier ou de chier, dans la partie infrieure droite de la fentre, nomme, Nom. Utilisez la combinaison de touches [Ctrl]+[A] pour slectionner tous les chiers et tous les dossiers du dossier Joomla_1.5.10-StableFull_Package-French.Figure 2.45 : Tous les chiers et tous les dossiers du dossier Joomla_1.5.10-Stable-Full_Package-French sont slectionns7 Collez ces chiers dans le dossier cr chez lhbergeur ltape 5 (sur Filezilla, ce copier/coller seffectue en glissant les chiers slectionns de la partie gauche vers la partie droite de la fentre). Assurez-vous que le dossier cible est slectionn an dviter une ventuelle erreur de destination lors de la copie des chiers et des dossiers.74 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 2Figure 2.46 : Les chiers et dossiers sont colls par un glisser dans la partie droite de la fentrePendant lopration de copie, qui prend quelques minutes (ou plus), les chiers copis sont affichs dans la partie infrieure de la fentre de Filezilla.Figure 2.47 : Les chiers en cours de copie sont affichs dans la partie infrieure de la fentre lissue de la copie, les chiers et les dossiers publis chez lhbergeur sont visibles dans les zones Site distant et Nom, dans la partie droite de la fentre de Filezilla.Figure 2.48 : Les chiers constituant le systme Joomla, aprs leur publication chez lhbergeurLa mise en place du CMS est presque termine. Il vous reste oprer linitialisation du systme, qui seffectue de manire analogue celle que vous avez dj ralise sur votre serveur web local, quelques nuances prs.LE GUIDE COMPLET 75Chapitre 2Installer JoomlaPour accder au site, il vous faut crer un nom de sous-domaine pointant vers le dossier dans lequel vous avez dpos les chiers de Joomla, chez votre hbergeur. Pour les besoins de cet exemple, nous utilisons un sous-domaine dans ce qui suit. Vous pouvez galement employer lun de vos noms de domaines crs louverture de lhbergement pour raliser ce pointage.Domaine et sous-domaineUn domaine est un ensemble de pages web, dsign par un identiant unique, saisi dans la Barre dadresse du navigateur Internet (du type http://www.mosaiqueinformatique.fr). Un sous-domaine est une subdivision de lespace que reprsente le domaine principal, portant elle aussi une adresse unique (du type http://www .formations-informatiques-nancy.mosaiqueinformatique.fr).8 Depuis votre navigateur Internet, accdez nouveau linterface dadministration de votre espace dhbergement, comme vu prcdemment. Aprs vous tre authenti, cliquez sur le lien Configuration des domaines.Figure 2.49 : Le lien Conguration des domaines, affich dans linterface dadministration de lhbergeurLa page Aperu des domaines est affiche.9 Cliquez sur le lien Nouveau.Figure 2.50 : Le lien permettant de crer un nouveau domaine ou un nouveau sous-domaine76 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 2La page Ajouter un domaine est affiche.Figure 2.51 : La page Ajouter un domaineLa page Nouveau sous-domaine est affiche.10 Dans la zone Sous-domaine.Nom du domaine, saisissez le prxe du sous-domaine(nous utilisons "formations-informatiquesnancy", pour cet exemple). Choisissez le nom de domaine auquel est rattach le sous-domaine au moyen de la liste droulante prsente droite de la zone (en fonction du type dhbergement choisi, vous pouvez en effet disposer de plusieurs noms de domaines). Cliquez sur le bouton Crer.Figure 2.52 : La cration du sous-domaineLe nom de sous-domaine tant dsormais cr, il faut le diriger vers le dossier dans lequel vous avez dpos les chiers de Joomla.LE GUIDE COMPLET 77Chapitre 2Installer Joomla11 Depuis la page daccueil du site de lhbergeur, cliquez sur le lien Configuration des domaines.La page Aperu des domaines est affiche.12 Dans la liste des noms de domaine et de sous-domaine, affiche sur cette page, cliquez sur le lien constitu du nom de sousdomaine qui vient dtre cr.La page Paramtres pour la destination du domaine est affiche.13 la rubrique Destination, cliquez sur le bouton Modifier.Figure 2.53 : La page Paramtres pour la destination du domaine14 la rubrique Rpertoire racine, choisissez, dans la liste droulante de la zone Rpertoire existant, le nom du dossier cr prcdemment au moyen du logiciel de transfert FTP, et dans lequel vous avez dpos les chiers et dossiers dinstallation de Joomla. Cliquez sur le bouton Enregistrer.Figure 2.54 : Le choix du dossier de destination78 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 2La page alors affiche indique que lopration sest effectue correctement et que les modications effectues seront effectives dans 30 minutes environ. Il vous reste effectuer le paramtrage du systme.15 Dans la barre dadresse de votre navigateur Internet, saisissez ladresse du sous-domaine que vous avez prcdemment cr (http://www.formations-informatiques-nancy.mosaiqueinformatique.fr, dans notre exemple).Comme cela fut le cas lors de linstallation sur votre serveur web local, ladresse dun site Joomla tant saisie, le systme teste si linitialisation a dj t effectue. Puisque ce nest pas le cas, le premier cran de linstallateur de Joomla apparat.16 Slectionnez la langue franaise dans la liste Slectionnez la langue puis cliquez sur le lien Suivant, prsent dans la page, pour passer ltape suivante de linstallation.Ltape suivante est celle de la vrication des paramtres du serveur web. La partie suprieure de la page affiche une liste de paramtres devant tous tre ltat Oui, indiquant un paramtrage correct alors que la partie infrieure de la page indique ltat des paramtres recommands.17 Cliquez sur le lien Suivant.Dans ltape suivante, vous devez signier votre acceptation de la licence dutilisation de Joomla.18 Cliquez sur le lien Suivant.Ltape qui suit est celle qui vous permet de paramtrer la base de donnes utilise par Joomla. Quelques paramtres vont diffrer de ceux utiliss sur votre serveur web local.19 Dans la liste de la zone Type de la base de donnes, choisissez mysql (voir Figure 2.55).Dans la zone suivante, il vous faut saisir le nom du serveur de votre base de donnes. Ce paramtre vous sera fourni par votre hbergeur.LE GUIDE COMPLET 79Chapitre 2Installer JoomlaFigure 2.55 : Le paramtrage de la base de donnes emploie ici des informations spciques votre hbergement20 Depuis votre navigateur Internet, accdez nouveau linterface dadministration de votre espace dhbergement, comme vu prcdemment. Aprs vous tre authenti, cliquez sur le lien Administration de MySQL la rubrique Applications Web.Figure 2.56 : Le lien permettant laccs aux paramtres de la basede donnesLa page Crer et configurer une base de donnes MySQL est affiche. Les noms de vos bases de donnes, ainsi que les noms dutilisateurs et mots de passe rattachs vous y sont fournis.Copier/coller des paramtresVous pouvez gagner un temps apprciable, et viter des erreurs de saisie, en oprant des copier/coller de ces paramtres, lorsquils sont requis pendant linstallation de Joomla, plutt que de les ressaisir.21 Effectuez un copier du nom du serveur de votre base de donnes puis retournez ltape 4 de linstallation de Joomla. Collez cette donne dans la zone Nom du serveur.80 LE GUIDE COMPLETInstaller Joomla chez un hbergeurChapitre 222 Copiez de mme le nom dutilisateur de la base de donnes et collez-le dans la zone Nom dutilisateur. 23 Copiez de mme le mot de passe permettant laccs la base de donnes et collez-le dans la zone Mot de passe. 24 Copiez le nom de la base de donnes et collez-le dans la zone Nom de la base de donnes.Cration de la base de donnesEn fonction des spcicits des services dhbergements de sites proposes par les hbergeurs, il se peut que votre base de donnes ne soit pas initialise louverture du service. Vous devrez donc la crer, depuis linterface dadministration mise votre disposition par lhbergeur, avant lexcution de cette tape dinstallation de Joomla.Utilisation dun prxe de tablesSi vous disposez uniquement dune base de donnes MySql sur votre espace dhbergement, vous pouvez toutefois procder plusieurs installations distinctes de Joomla en prxant les tables. Cliquez alors sur le bouton Paramtres avancs. Dans la zone Prfixe des tables, indiquez une courte chane de caractres (du type "abc_"). Ce prxe sera ajout au dbut des noms de vos tables (les tables sont des regroupements dinformations, dans une base de donnes) et vous pourrez ainsi installer plusieurs fois le CMS, avec des noms de domaines ou de sous-domaines diffrents (pointant vers des dossiers distincts), chaque systme utilisant des tables prxe unique.Figure 2.57 : La dnition dun prxe de tables25 Cliquez sur le lien Suivant.Ltape suivante vous permet de paramtrer un accs FTP, utile pour grer des problmes de publication pouvant apparatre chez certains hbergeurs. Vous nutiliserez pas cette fonctionnalit dans le cas prsent.LE GUIDE COMPLET 81Chapitre 2Installer Joomla26 Cliquez sur le lien Suivant. cette tape, dnissez les paramtres de conguration initiaux de votre site Joomla. Ces valeurs pourront tre changes ultrieurement.27 Dans la zone Nom du site, saisissez le nom que vous dsirez affecter votre site.Cette information sera visible dans la Barre de titre du navigateur Internet depuis lequel est affich le site.28 Dans la zone Votre email, saisissez votre adresse email. 29 Dans la zone Mot de passe de ladmin, saisissez le mot de passe qui vous permettra de vous identier lors de vos accs linterface dadministration. 30 Dans la zone Confirmer le mot de passe admin, saisissez nouveau le mot de passe. 31 Cliquez sur le bouton Installer les donnes dexemple (an dinsrer dans la base de donnes quelques articles ctifs et de copier dans le site les images utilises par ces exemples). 32 Cliquez sur le lien Suivant.Vous connaissez dj la particularit de cette dernire tape, pour lavoir observe lors de linstallation de Joomla sur votre serveur local. Il vous est indiqu que linstallation sest droule normalement et que vous devez dtruire le dossier installation, dans larborescence de rpertoires du systme mis en place sur le serveur web, an de vous protger dun piratage, dans lequel la procdure dinstallation serait excute une nouvelle fois.33 Ne fermez pas votre navigateur Internet et lancez Filezilla (ou votre logiciel de transfert FTP). Connectez-vous votre espace dhbergement par le protocole FTP. En cliquant du bouton droit sur le dossier installation puis en choisissant Effacer dans le menu contextuel qui apparat, supprimez le rpertoire installation (voir Figure 2.58). 34 Retournez sous le navigateur Internet et cliquez sur le bouton Site, an daccder la partie publique du site.Comme lors de linstallation du systme sur votre serveur local, la partie publique de votre site est affiche. Votre site web est dsormais accessible aux internautes, par simple saisie de leur part de lURL du site.82 LE GUIDE COMPLETCheck-listChapitre 2Figure 2.58 : La suppression du dossier dinstallation35 Pour accder linterface dadministration de votre site Joomla, cest--dire lespace qui vous est rserv et depuis lequel vous pourrez modier le site, ouvrez un nouvel onglet dans votre navigateur Internet (par la commande Fichier/Nouvel onglet) et saisissez ladresse du site, en lui ajoutant la chane de caractres /administrator. Dans cet exemple, le chemin daccs est donchttp://www.formationsinformatiquesnancy.mosaique informatique.fr/administrator/.La page de connexion linterface dadministration de Joomla apparat.36 Dans la zone Identifiant, saisissez admin.Ce nom dutilisateur, cr par dfaut linstallation de Joomla, pourra tre chang ultrieurement pour plus de scurit.37 Dans la zone Mot de passe, saisissez le mot de passe que vous avez dni lors de linstallation. 38 Cliquez sur le bouton Connexion.La page daccueil de linterface dadministration de Joomla est affiche. Les choses srieuses peuvent commencer...2.6. Check-listj jLe CMS Joomla est tlchargeable gratuitement en ligne. Il en va de mme pour le serveur Apache et la conguration de base de donnes MySQL et PHP.LE GUIDE COMPLET 83Chapitre 2j jInstaller JoomlajCes derniers composants peuvent tre facilement installs sur votre ordinateur, des ns de tests. De nombreux hbergeurs, gratuits ou moindre cots, proposent diffrents types dhbergements. Il vous sera ais de choisir le plus adapt vos besoins. Linstallation de Joomla seffectue en quelques instants, sur votre serveur local ou chez un hbergeur grce un installateur ne ncessitant pas de connaissances spciques en programmation.84 LE GUIDE COMPLETSe familiariser avec JoomlaLe frontend ............................................................................................................................. 86 Le backend ............................................................................................................................ 89 Les menus de Joomla ......................................................................................................... 97 Check-list ............................................................................................................................. 114Chapitre 3Se familiariser avec JoomlaAvant de vous lancer dans lutilisation et la personnalisation du systme, prenez quelques instants pour en dcouvrir les principales fonctionnalits. Vous aurez ainsi une vision globale des possibilits offertes par Joomla.3.1. Le frontendCommencez votre visite par la partie publique du site (frontend), qui sera accessible aux internautes. Vous dcouvrirez ensuite linterface dadministration du systme (backend). Nous naborderons pas en dtails des nombreux lments qui composent ces deux parties, lobjectif de cette section est uniquement de vous permettre deffectuer une premire visite globale de Joomla. Depuis votre navigateur Internet, connectez-vous la page daccueil du site, en utilisant soit ladresse sur votre serveur web local (http://127.0.0.1/site1joomla/) dans notre exemple, soit celle cre chez votre hbergeur. Pour vous familiariser avec Joomla et effectuer des tests, il est plus rapide davoir recours votre installation locale (nous utiliserons cette solution dans la majorit des cas dcrits dans ce livre).Dmarrer le serveur local avant dutiliser JoomlaLorsque vous teignez votre ordinateur, il est prfrable darrter au pralable votre serveur Apache, aprs vous tre dconnect de linterface dadministration par un clic sur le bouton Dconnexion, propos en haut et droite de la fentre du backend. Pour ce faire, cliquez du bouton droit sur licne dEasyPHP, affiche dans la Barre des tches, puis choisissez Quitter, dans le menu contextuel qui apparat.Figure 3.1 : Le menu contextuel dEasyPHP86 LE GUIDE COMPLETLe frontendChapitre 3Si votre serveur Apache est arrt (vous avez teint votre ordinateur ou vous avez arrt le service), vous ne pourrez accder une version locale de Joomla quaprs avoir relanc le serveur, en cliquant sur le bouton Dmarrer puis sur Tous les programmes/EasyPHP 3.0/EasyPHP.Cette partie publique du site se compose de plusieurs lments qui pourront tre conservs ou dsactivs (dautres, non visibles ici, pourront galement tre ajouts). De mme, si la charte graphique propose par dfaut ne vous convient pas (polices de caractres, couleurs, images de fond, disposition des lments, etc.), vous dcouvrirez plus loin quelle peut, trs aisment, tre change. Voici les modules essentiels, visibles dans cette page, compose pour linstant de textes et dimages dexemples :june bannire de haut de page, intgrant un logo ;Figure 3.2 : La zone de bannire de haut de page jdes menus, horizontaux et verticaux, permettant la navigation sur le site ;Figure 3.3 : Deux menus verticaux jdiffrents composants (derniers articles, articles les plus lus, sondage, zone de recherche, formulaire didentication, indicateur du nombre de visiteurs actuellement en ligne, etc.) ;LE GUIDE COMPLET 87Chapitre 3Se familiariser avec JoomlaFigure 3.4 : Un module de ralisation de sondages et un autre affichant le nombre de visiteurs sur le site june zone daffichage de bannires publicitaires ;Figure 3.5 : Une zone est ddie laffichage de bannires publicitaires, en bas de page june zone principale affichant le contenu proprement parler de la page (textes et images).Figure 3.6 : Un exemple de contenu textuel88 LE GUIDE COMPLETLe backendChapitre 33.2. Le backendVous allez maintenant dcouvrir linterface dadministration de Joomla (backend), grce laquelle vous pourrez crer et modier tous les lments constitutifs de votre site web. Procdez ainsi :1 Depuis votre navigateur Internet, connectez-vous au backend, en utilisant soit ladresse sur votre serveur web local (http://127.0.0.1/site1joomla/administrator dans notre exemple), soit celle cre chez votre hbergeur (ladresse sera alors du type http://www.votrenomdedomaine/ administrator). Une fois encore, nous vous conseillons de raliser vos premiers tests sur votre serveur local car les oprations seront plus rapides raliser et vous pourrez vous livrer toutes les exprimentations de votre choix, sans risque daltration du bon fonctionnement de votre site rel. 2 Dans la page de connexion qui est affiche, saisissez votre identiant et votre mot de passe puis cliquez sur le bouton Connexion.Les fonctionnalits de linterface de Joomla seront dtailles dans le chapitre qui suit. Le rapide parcours que nous vous proposons ici na dautre intrt que de vous permettre de dcouvrir quelques rouages essentiels et signicatifs du systme, an de vous familiariser avec le CMS.Dcouvrir le gestionnaire darticlesCest au moyen de cette fonctionnalit que vous pourrez rdiger les articles affichs dans les pages. Ils sont essentiellement composs de textes et dimages.1 Depuis linterface dadministration cliquez sur Site/Panneau dadministration (voir Figure 3.7). 2 Cliquez sur le bouton Gestion des articles (voir Figure 3.8).LE GUIDE COMPLET 89Chapitre 3Se familiariser avec JoomlaFigure 3.7 : Laccs au panneau dadministrationFigure 3.8 : Le bouton Gestion des articlesLe gestionnaire des articles est affich (son utilisation sera dtaille plus loin dans cet ouvrage).Figure 3.9 : Le gestionnaire des articles3 Dans la colonne Titre, qui affiche les titres des articles, cliquez par exemple sur le premier lien.90 LE GUIDE COMPLETLe backendChapitre 3Figure 3.10 : Vous avez cliqu sur le premier lienLa langue des donnes dexemplesLes titres des articles affichs ici sont en anglais. Il sagit des donnes dexemples, cres lors de linstallation. Vous saurez bientt comment supprimer ces articles et ajouter les vtres, en langue franaise.Lditeur WYSIWYG darticles est affich. Vous pouvez y observer, notamment, les boutons qui vous permettront de mettre en forme vos articles (au-dessus du texte de larticle).Figure 3.11 : Lditeur darticles4 Quittez lditeur sans sauvegarder vos ventuelles modications en cliquant sur le bouton Fermer.LE GUIDE COMPLET 91Chapitre 3Se familiariser avec JoomlaFigure 3.12 : Le bouton FermerDcouvrir le gestionnaire de menusLes menus renferment les liens de navigation qui permettent aux internautes daccder aux pages composant le site. Ils peuvent prendre diffrents aspects et tre activs ou dsactivs. Il vous est galement possible de crer vos propres menus.1 Cliquez sur le menu Menu/Main menu, qui permet daccder aux items du menu principal.Figure 3.13 :Le menu Menu/Main menuLe gestionnaire dlment de menu apparat.2 Cliquez, par exemple, sur le lien Home, qui est le premier item du menu.Figure 3.14 : Le lien Home, dans le gestionnaire dlment de menu92 LE GUIDE COMPLETLe backendChapitre 3Lalias de menu est affich.3 Quittez lalias de menu sans sauvegarder vos ventuelles modications en cliquant sur le bouton Fermer.Dcouvrir le gestionnaire de mdiasAutre fonctionnalit essentielle de Joomla, le gestionnaire de mdias vous permet dimporter dans le site les images et chiers qui seront accessibles depuis les pages du site. Cliquez sur le menu Site/Gestion des mdias.Figure 3.15 : Le menu Site/Gestion des mdiasLe gestionnaire de mdias est affich. Il renferme des images copies lors de linstallation (vous pourrez y copier vos propres images). Il se compose galement de dossiers qui vous permettront dorganiser efficacement le classement des chiers.Figure 3.16 : Le gestionnaire de mdiasLE GUIDE COMPLET 93Chapitre 3Se familiariser avec JoomlaDcouvrir le principe des templatesLa possibilit de changer en un instant la mise en forme du site (au moyen des templates), sans affecter son contenu, est lune des fonctionnalits les plus tonnantes de Joomla. Voici une petite manipulation qui vous permettra den apercevoir les possibilits.TemplateCe terme anglais indique sous Joomla un modle de conception, cest-dire un ensemble dlments de mise en forme (polices, couleurs, boutons, visuels de fonds de pages, etc.) qui peuvent tre appliqus simplement et rapidement sur tout ou partie du site.1 Cliquez sur le menu Extensions/Gestionnaire des templates.Figure 3.17 : Laccs au gestionnaire des templatesLe gestionnaire de templates est affich. Il prsente la liste des templates installs sur le systme (vous dcouvrirez plus loin comment ajouter de nouveaux templates).2 Cochez, par exemple, loption place gauche du nom de template beez, affich dans la colonne Nom du Template.Figure 3.18 : Le choix du template94 LE GUIDE COMPLETLe backendChapitre 33Cliquez sur le bouton Dfaut, plac en haut et droite de la fentre du gestionnaire de templates.Vous venez de modier le modle de mise en forme appliqu votre site. Pour le vrier, cliquez sur Prvisualiser, en haut et droite de linterface dadministration de Joomla.Figure 3.19 : Le lien PrvisualiserLe frontend est ouvert dans un nouvel onglet (ou une nouvelle fentre, selon le navigateur Internet utilis).4 Cliquez sur le nouvel onglet ou ouvrez la nouvelle fentre du navigateur affichant le frontend.Le contenu (textes et images) reste inchang mais sa prsentation est radicalement diffrente grce lapplication du template.Figure 3.20 : Le frontend aprs application du templateLe retour au template dorigine se fait aussi facilement.5 Dans la nouvelle fentre du navigateur affichant linterface dadministration de Joomla, cliquez sur le menuLE GUIDE COMPLET 95Chapitre 3Se familiariser avec JoomlaExtensions/Gestionnaire des templates. Dans le gestionnaire detemplates, cochez loption place gauche du nom de templaterhuk_milkyway, affich dans la colonne Nom du Template.6 Cliquez sur le bouton Dfaut, plac en haut et droite de la fentre du gestionnaire de templates. 7 Ouvrez longlet ou la fentre du navigateur affichant le frontend puis actualisez la page en cliquant sur le bouton dactualisation du navigateur.Figure 3.21 : Le bouton Actualiser la page courante de FirefoxLactualisation dune pageLorsquune page web est ouverte dans un navigateur Internet (Firefox, Internet Explorer, Chrome, Opra, Safari, etc.), elle est stocke dans une zone de mmoire temporaire, nomme cache, du logiciel. Si la page est modie sur le serveur web, cest la page renferme dans le cache qui continue dtre affiche par le navigateur, jusqu actualisation de celle-ci (lactualisation est laction qui consiste demander au serveur web dadresser une nouvelle fois la page au navigateur).Le template dorigine est nouveau utilis.Figure 3.22 : Le nouveau template est appliqu et modie la mise en forme de la partie publique du site96 LE GUIDE COMPLETLes menus de JoomlaChapitre 33.3. Les menus de JoomlaSi lon fait abstraction des boutons prsents dans le panneau dadministration (accessible via le menu Site/Panneau dadministration) et qui sont des raccourcis vers les fonctions essentielles de Joomla, laccs aux composants du systme seffectue toujours par les menus de linterface. Les fonctionnalits qui leurs sont associes sont dcrites dans ce qui suit.Le menu Site/Panneau dadministrationCe sous-menu permet daccder au panneau dadministration, qui pourrait tre assimil une barre doutils sur certains logiciels bureautiques, tels que Word, en ce sens quil propose diffrents boutons constituant des raccourcis vers les commandes essentielles des menus, tels que laccs la gestion des articles, des sections et des catgories (ces notions sont abordes plus loin), des mdias, des menus, des langues, des utilisateurs, ou encore de la conguration globale du systme.Figure 3.23 : Les boutons composant le panneau dadministrationLe menu Site/Gestionnaire des utilisateursCe menu permet douvrir le gestionnaire des utilisateurs.Figure 3.24 : Le gestionnaire des utilisateursLE GUIDE COMPLET 97Chapitre 3Se familiariser avec JoomlaLe menu Site/Gestion des mdiasCe menu permet douvrir le gestionnaire des mdias. Il se compose de dossiers dans lesquels sont dposs les chiers mdias (images notamment) affichs dans les pages du site.Figure 3.25 : Le gestionnaire de mdiasLe menu Site/Conguration gnraleCe menu vous permet de modier tous les paramtres globaux du site (nom du site, description dans les moteurs de recherche, dure des sessions, paramtres du serveur, etc.).Figure 3.26 : Le gestionnaire de conguration gnrale98 LE GUIDE COMPLETLes menus de JoomlaChapitre 3Le menu Site/DconnexionCe menu vous permet de quitter "proprement" Joomla. Entendez par l en fermant correctement les tables de la base de donnes. lissue de lopration, vous ne serez plus connect linterface dadministration et devrez vous loguer nouveau pour accder au backend.Figure 3.27 : Aprs dconnexion, il vous faudra vous identier nouveau pour accder linterface dadministration de JoomlaEn cas de sortie anormale de JoomlaLorsque vous quittez le backend, il est ncessaire doprer par le menu Site/Dconnexion ou par le lien Dconnexion, propos en haut et droite de la fentre de linterface dadministration de Joomla, an de clturer correctement la base de donnes.Figure 3.28 : Le lien DconnexionLerreur, consistant cliquer sur le bouton Fermer de votre navigateur en oubliant de vous dconnecter, est toutefois possible, pour ne pas dire probable, sur une longue priode dutilisation. Pour pallier ce problme, les concepteurs de Joomla ont prvu une procdure de secours : le menu Outils/Validation gnrale remet les tables de la base de donnes en tat en cas de problme.LE GUIDE COMPLET 99Chapitre 3Se familiariser avec JoomlaNhsitez pas utiliser cette commande si laccs un article vous est interdit par un verrouillage de tables d au fait que lun des administrateurs du systme a quitt le backend sans se dconnecter, laissant les tables de la base de donnes ouvertes.Le menu Menus/Gestion des menusLes menus sont les lments essentiels de la navigation dans le site ; ils permettent en effet, via de nombreuses fonctions, laccs aux pages qui composent le site Joomla. Ce menu permet daccder au gestionnaire de menus du site.Figure 3.29 : Le gestionnaire de menusLe menu Menus/Corbeille de menuJoomla dispose dun systme de corbeille, analogue, dans son concept, celui de Windows, et qui repose sur le principe, lors de la suppression dun lment, de lutilisation dun espace de stockage intermdiaire, avant la suppression dnitive de litem (an de pouvoir le retrouver, si vous changez davis, sans devoir le recrer).Figure 3.30 : Le gestionnaire de corbeille de menus100 LE GUIDE COMPLETLes menus de JoomlaChapitre 3Le menu Menus/Main menuCette commande, applique ici au premier menu de la liste (Main menu), permet de grer les lments du menu (ceux-ci permettent daccder, de diffrentes faons, aux pages qui composent le site). Joomla vous permet de crer un nombre illimit de menus. Le gestionnaire dlments de menu peut tre utilis pour chacun dentre eux.Figure 3.31 : Le gestionnaire dlments de menuLe menu Contenu/Gestion des articlesLes articles sont les lments constitutifs de base des pages dun site Joomla. Le gestionnaire des articles permet daccder ceux-ci an den modier le contenu rdactionnel. Il offre galement de nombreuses fonctions de classement des articles.Figure 3.32 : Le gestionnaire darticlesLE GUIDE COMPLET 101Chapitre 3Se familiariser avec JoomlaLe menu Contenu/Corbeille articleVous retrouvez ici le mme concept de gestion de corbeille, dj dcrit prcdemment la section traitant du menu Menus/Corbeille de menu, appliqu, cette fois, la gestion des articles.Figure 3.33 : La corbeille darticlesLe menu Contenu/Gestionnaire des sectionsLes notions de sections et de catgories, dtailles plus loin, sont des points importants pour ladministrateur dun site Joomla, car chaque article appartient une catgorie, elle-mme lment dune section. Le gestionnaire de sections vous permet deffectuer toutes les oprations de cration, de suppression ou de modication de vos sections.Figure 3.34 : Le gestionnaire de sectionsLe menu Contenu/Gestion des catgoriesLe gestionnaire de catgories vous permet deffectuer les oprations de cration, de suppression ou de modication de vos catgories.102 LE GUIDE COMPLETLes menus de JoomlaChapitre 3Figure 3.35 : Le gestionnaire de catgoriesLe menu Contenu/Gestion de la page daccueilJoomla offre une possibilit trs intressante, consistant permettre laccs certains articles choisis, directement depuis la page daccueil, en plus des accs traditionnels par les menus ou les liens hypertextes, dun article vers un autre. Cette fonctionnalit vous permet, par exemple, de mettre en vidence, pour les lecteurs, vos derniers articles rcemment publis. Elle peut amliorer en outre la vitesse dindexation dun nouvel article dans les moteurs de recherche.Figure 3.36 : Le gestionnaire de la page daccueilLE GUIDE COMPLET 103Chapitre 3Se familiariser avec JoomlaLe menu Composants/Bannire/BanniresUne autre fonctionnalit intressante repose sur une gestion sophistique de bannires publicitaires. Lorsquelles sont cliques, celles-ci ouvrent alors les sites web des annonceurs.Figure 3.37 : Le gestionnaire de banniresLe menu Composants/Bannire/ClientsCe composant est complmentaire du prcdent. Il permet dadministrer vos clients (ou simples partenaires) pour lesquels des bannires publicitaires sont affiches sur le site.Figure 3.38 : Le gestionnaire des clients de bannire104 LE GUIDE COMPLETLes menus de JoomlaChapitre 3Le menu Composants/Bannire/CatgoriesCe composant est galement complmentaire des deux prcdents. Il permet de grer des catgories de bannires publicitaires.Figure 3.39 : Le gestionnaire des catgories de banniresLe menu Composants/Contacts/ContactsCe composant vous permet denregistrer les coordonnes des administrateurs du site, an de proposer aux visiteurs du site dentrer en contact avec eux par courrier lectronique.Figure 3.40 : Le gestionnaire de contactsLe menu Composants/Contacts/CatgoriesCe composant est complmentaire du prcdent. Il permet de grer des catgories de contacts.LE GUIDE COMPLET 105Chapitre 3Se familiariser avec JoomlaFigure 3.41 : Le gestionnaire des catgories de contactsLe menu Composants/Fils dactualits/FilsCe composant vous permet de stocker des listes de ux RSS, publis sur dautres sites, an de les afficher sur votre site Joomla.Figure 3.42 : Le gestionnaire des ls dactualitsLes ux RSSLes ux RSS sont des informations publies par certains sites web, tels que les journaux en ligne. Il est possible, pour les internautes et les administrateurs dautres sites de sabonner ces ux an de les106 LE GUIDE COMPLETLes menus de JoomlaChapitre 3consulter ou de les afficher dans des pages web (on parle de "syndication de contenus").Le menu Composants/Fils dactualits /CatgoriesCe composant est complmentaire du prcdent. Il permet de grer des catgories de contacts.Figure 3.43 : Le gestionnaire des catgories de ls dactualitsLe menu Composants/SondagesCe composant vous permet de crer des sondages, destins recueillir les avis des visiteurs du site.Figure 3.44 : Le gestionnaire de sondagesLE GUIDE COMPLET 107Chapitre 3Se familiariser avec JoomlaLe menu Composants/RechercheCe composant permet dafficher des informations relatives aux recherches effectues par la fonctionnalit de recherches offerte aux internautes sur le site.Figure 3.45 : Le composant daffichage des statistiques de recherches effectues sur le siteLe menu Composants/Liens web/LiensCe composant est utilis pour constituer des listes de liens vers des sites amis ou partenaires, et qui pourront tre affichs sur le site Joomla.Figure 3.46 : Le composant de gestion des liens webLe menu Composants/Liens web/CatgoriesCe composant est complmentaire du prcdent. Il permet de grer des catgories de liens web.108 LE GUIDE COMPLETLes menus de JoomlaChapitre 3Figure 3.47 : Le composant de gestion des catgories de liens webLe menu Extensions/Installer/DsinstallerCette fonctionnalit vous permet dinstaller des extensions aux fonctionnalits natives de Joomla (composants, modules, plugins, templates) qui permettent daccrotre les possibilits du systme.Figure 3.48 : Le gestionnaire dextensionsLe menu Extensions/Gestion des modulesCette fonctionnalit vous permet dadministrer les modules installs dans le systme.Figure 3.49 : Le gestionnaire de modulesLE GUIDE COMPLET 109Chapitre 3Se familiariser avec JoomlaLe menu Extensions/Gestionnaire des pluginsCette fonctionnalit vous permet dadministrer les plugins installs dans le systme.Figure 3.50 : Le gestionnaire de pluginsComposants, modules et pluginsCes trois termes dsignent tous des extensions natives ou pouvant tre ajoutes a posteriori dans Joomla. Les composants sont les plus complets et constituent de vritables applications autonomes (commerce lectronique, galerie dimages, etc.). Les modules sont des fonctionnalits plus modestes, qui ncessitent une intgration dans les pages pour exister (module daffichage des articles les plus populaires, par exemple). Les plugins sont des fonctionnalits encore plus spciques, qui amliorent gnralement un traitement (bouton dinsertion dune image, par exemple).Le menu Extensions/Gestionnaire des templatesCette fonctionnalit vous permet dadministrer les templates (modles de mise en forme) installs dans le systme.Figure 3.51 : Le gestionnaire de templates110 LE GUIDE COMPLETLes menus de JoomlaChapitre 3Le menu Extensions/Gestion des languesCette fonctionnalit vous permet de choisir la langue utilise dans le systme.Figure 3.52 : Le gestionnaire de languesLe menu Outils/Lire les messagesCette fonctionnalit, trs utile si plusieurs personnes participent ladministration du site, vous permet dadministrer un systme de messagerie interne.Figure 3.53 : Le gestionnaire de messagerieLe menu Outils/crire un messageCette fonctionnalit, complmentaire de la prcdente, permet dadresser un message un autre administrateur du site.Figure 3.54 : Le gestionnaire denvoi de messagesLE GUIDE COMPLET 111Chapitre 3Se familiariser avec JoomlaLe menu Outils/Envoi massif demailCette fonctionnalit vous sera utile si vous souhaitez adresser une newsletter un grand nombre dabonns.Figure 3.55 : Le gestionnaire denvoi massif de courriers lectroniquesLe menu Outils/Validation gnraleCette fonctionnalit vous permet de fermer "proprement" les tables de la base de donnes, si le systme a t quitt anormalement.Figure 3.56 : La validation gnrale du systme112 LE GUIDE COMPLETLes menus de JoomlaChapitre 3Le menu Outils/Nettoyer le cacheCette fonctionnalit vous permet de supprimer les chiers mis en cache (mmoire intermdiaire du site permettant dacclrer les traitements). Vous y aurez recours si le site a t profondment refondu et que vous souhaitiez voir les mises jour immdiatement appliques.Figure 3.57 : La fonction de vidage du cacheLe menu Outils/Purger les chiers expirs du cacheCette fonctionnalit permet de supprimer les chiers du cache.Figure 3.58 : La fonction de vidage des chiers expirs du cacheLe menu Aide/Aide Joomla!Cette fonctionnalit permet daccder laide en ligne de Joomla, en langue anglaise.Figure 3.59 : Laide de JoomlaLE GUIDE COMPLET 113Chapitre 3Se familiariser avec JoomlaLe menu Aide/Infos systmeCette dernire fonctionnalit permet dafficher de nombreuses informations sur le systme sur lequel est implment Joomla (infos systme, paramtres PHP, chier de conguration, permissions des dossiers, informations PHP).Figure 3.60 : Les informations systme3.4. Check-listjjjDs son installation, le site Joomla est oprationnel et le webmestre peut commencer son travail de personnalisation et de rdaction de contenus. La partie publique, ou frontend, visible des internautes, prsente des fonctionnalits et des donnes dexemples qui devront tre modies ou supprimes. Linterface dadministration, ou backend, donne accs de trs nombreuses fonctionnalits, essentiellement par un systme de menus droulants.114 LE GUIDE COMPLETCrer des articlesUtiliser les commandes de linterface dadministration ........................................... 116 Dfinir les paramtres gnraux .................................................................................... 117 Changer le login et le mot de passe administrateur ................................................. 121 Crer des sections ............................................................................................................. 122 Crer des catgories ......................................................................................................... 125 Crer et modifier des articles .......................................................................................... 128 Check-list ............................................................................................................................. 158Chapitre 4Crer des articlesJoomla met votre disposition un ensemble de fonctionnalits web 2.0 quil est temps de dcouvrir et de mettre en uvre sur votre site. Lobjet de ce chapitre est donc de vous permettre de parcourir les principales fonctions natives du systme. Elles sont nombreuses et efficaces, comme vous allez le constaterWeb 2.0Ce terme rcent dsigne un ensemble de fonctionnalits actuelles, mises en uvre sur les sites web : Web dynamique utilisant des bases de donnes plutt que des pages html statiques, changes de billets, ls RSS, rseaux sociaux, vido, audio, classements de sites cons aux internautes, rponses aux articles4.1. Utiliser les commandes de linterface dadministrationMme si laspect de linterface de Joomla sapparente celui des logiciels installs sur votre ordinateur (tels que Word ou Excel), elle est fondamentalement diffrente en ce qui concerne son mode de fonctionnement. En effet, le noyau du systme nest pas un programme install sur votre machine mais un ensemble de codes php et une base de donnes implments chez votre hbergeur ou sur votre serveur web local. Par consquent, toutes les oprations ralises se font par lintermdiaire de votre navigateur Internet. Concrtement, il ny a pas de diffrence conceptuelle entre naviguer sur un site Internet quelconque et naviguer sur le backend de Joomla, puisque celui-ci se compose dun ensemble de pages web dynamiques. Toutefois, gardez lesprit que le rle de linterface administrateur de Joomla est essentiellement de permettre la mise jour de la base de donnes quutilise le CMS et que ce traitement suit des rgles douverture et de fermeture de tables notamment. An de ne pas transgresser celles-ci, vous ne devez pas utiliser les boutons de navigation des pages rcemment visites proposs par votre navigateur Internet ; vous risqueriez de modier lordre des traitements prvus par les concepteurs du systme et crer ainsi des dysfonctionnements.116 LE GUIDE COMPLETDfinir les paramtres gnrauxChapitre 4Figure 4.1 : Les boutons Reculer dune page et Avancer dune page du navigateur FirefoxVotre navigation au sein de linterface dadministration de Joomla doit donc toujours tre ralise en utilisant les boutons et Figure 4.2 : Les boutons les menus proposs par le systme. Prcdent et Suivant du navigateur Internet Explorer Certains de ces lments sont prsents sur tous les gestionnaires, an de vous permettre de valider ou dannuler laction en cours. Il sagit des boutons suivants :jLe bouton Sauver. Utilisez ce bouton pour enregistrer votre action (la modication dun article, par exemple) et pour revenir la page parente de la page en cours. Le bouton Appliquer. Utilisez ce bouton pour enregistrer votre action tout en restant dans la page en cours (gnralement an de tester le rsultat de lopration dans un autre onglet affichant la partie publique du site). Le bouton Fermer. Utilisez ce bouton pour annuler votre action, sans lenregistrer.jjSi toutefois, par mgarde, vous avez eu recours aux boutons de navigation de votre navigateur, oprez une validation globale via le menu Outils/Validation gnrale. Notez galement que les menus ne seront pas accessibles pendant certaines oprations ncessitant dtre cltures avant toute autre manipulation. Ainsi, par exemple, les menus apparatront en gris et ne seront plus ractifs aux clics pendant la modication dun article.4.2. Dnir les paramtres gnrauxCertains paramtres gnraux ncessitent dtre dnis la cration du site, depuis le gestionnaire de conguration gnrale.LE GUIDE COMPLET 117Chapitre 4Crer des articles1 Cliquez sur le menu Site/Configuration gnrale. 2 Le gestionnaire de conguration gnrale apparat. Vous allez y effectuer les manipulations suivantes.Paramtrer le nom du siteLe nom du site est utilis diffrents endroits du site. Vous lavez dni lors du paramtrage initial du site. Vous pouvez le modier a posteriori.1 Cliquez sur longlet Site. la rubrique Paramtres du site est affiche la zone Nom du site.Figure 4.3 : La zone Nom du site2 Modiez, le cas chant, le nom du site. 3 Cliquez sur le bouton Appliquer du gestionnaire.Paramtrer la longueur des listesPar dfaut, la longueur des listes affiches dans les diffrents gestionnaires (articles, menus, modules, ) est de 20 items. Cette valeur118 LE GUIDE COMPLETDfinir les paramtres gnrauxChapitre 4peut tre modie dans les composants au moyen de la liste de la zone Affichage, propose en bas des gestionnaires.Figure 4.4 : La zone Affichage, en bas du gestionnaire darticles, propose par dfaut un affichage de 20 itemsToutefois, lorsque le nombre dlments des listes augmente, ce nombre se rvle insuffisant, obligeant le webmestre utiliser les boutons de navigation Suivant et Prcdent pour faire dler les pages de liens pointant vers les items. Nous vous conseillons donc daugmenter cette valeur son maximum.1 Cliquez sur longlet Site. 2 Dans la liste de la zone Longueur des listes, choisissez la valeur 100.Figure 4.5 : La valeur maximale de la zone est choisie3 Cliquez sur le bouton Appliquer du gestionnaire.Augmenter la dure de sessionLorsque aucune touche nest frappe pendant une dure de 15 minutes, la session du webmestre est ferme ; il lui est ncessaire de sauthentier nouveau pour accder au backend.LE GUIDE COMPLET 119Chapitre 4Crer des articlesCette fonctionnalit est une mesure de scurit apprciable, empchant une personne dutiliser le systme, si le webmestre sabsente de son poste de travail en oubliant de clturer sa session. Il peut toutefois tre plus confortable daugmenter cette valeur.1 Cliquez sur longlet Systme. 2 la rubrique Configuration des sessions, dans la zone Dure de session, saisissez par exemple 60 minutes.Figure 4.6 : La dure de session est augmente3 Cliquez sur le bouton Appliquer du gestionnaire.Paramtrer le fuseau horaireJoomla tant un systme international, il peut tre paramtr pour tous les fuseaux horaires.1 Cliquez sur longlet Serveur. 2 la rubrique Paramtres de localisation, dans la liste de la zone Fuseau horaire, choisissez si vous tes localis en France le fuseau horaire de Paris.Figure 4.7 : Le choix dun fuseau horaire3 Cliquez sur le bouton Sauver du gestionnaire.120 LE GUIDE COMPLETChanger le login et le mot de passe administrateurChapitre 44.3. Changer le login et le mot de passe administrateurComme vous lavez dcouvert lors de la phase dinstallation du systme, le nom dutilisateur par dfaut, cr par Joomla, pour le premier compte administrateur, est admin. Il est prfrable, pour accrotre la scurit dun site publi chez un hbergeur, de remplacer ce login par un nom de votre choix.1 Cliquez sur le menu Site/Gestionnaire des utilisateurs.Le gestionnaire des utilisateurs apparat.2 Dans la colonne Nom, cliquez sur Administrator, nom qui a t cr automatiquement lors de linstallation de Joomla.Figure 4.8 : Le nom Administrator est cliquLes paramtres de lutilisateur sont affichs.Figure 4.9 : Les paramtres de lutilisateurLE GUIDE COMPLET 121Chapitre 4Crer des articles3 la rubrique Dtails de lutilisateur, dans la zone Identifiant, saisissez un nouveau login. Modiez le cas chant le mot de passe en le saisissant dans les zones Nouveau mot de passe et Confirmer le mot de passe. 4 Cliquez sur le bouton Sauver du gestionnaire.4.4. Crer des sectionsLe systme de gestion des contenus de Joomla fait appel trois notions conceptuelles : les sections, les catgories et les articles. Les articles sont des lments rdactionnels, principalement composs de textes et dimages. Pour les publier sur le site, Joomla dispose de plusieurs composants, offrant chacun des spcicits qui seront dcrites plus loin. Il est ainsi possible de regrouper des articles traitant de sujets proches et entrant donc dans de mmes "familles" et "sous-familles". Celles-ci portent les appellations de "sections" et de "catgories". Ainsi, un article appartient toujours une catgorie unique (les cannes pche, par exemple) appartenant elle-mme une section unique (la pche en eau douce, par exemple). Ce classement hirarchique prsente de nombreux avantages (disposer de composants affichant tous les articles dune catgorie ou dune section, par exemple) que vous dcouvrirez bientt.Diffrence entre article et page webPuisquun article est compos de texte, dimages et ventuellement dobjets multimdias tels que des vidos, il est tentant de penser quarticle et page web sont des termes synonymes. Cela nest toutefois pas obligatoirement le cas avec Joomla car le systme autorise laffichage, dans une mme page web, de plusieurs articles ou parties darticles.122 LE GUIDE COMPLETCrer des sectionsChapitre 4Figure 4.10 : Limbrication des sections, des catgories et des articles sous JoomlaArticles non catgorissLa version prcdente de Joomla (numro 1.0.xxx) autorisait la cration darticles "non catgoriss", cest--dire non rattachs une catgorie, elle-mme contenue dans une section. Cette opration nest plus permise dans la version 1.5.xxx, utilise ici. Plus exactement, la cration dun article non catgoris consiste aujourdhui lui affecter la catgorie non catgoris, elle-mme contenue dans la section non catgoris. Mthode lgante, de la part des dveloppeurs de Joomla, pour conserver le concept tout en normalisant la structure des tables de la base de donnes. titre dexemple, vous allez crer une nouvelle section.1 Cliquez sur le menu Contenu/Gestionnaire de sections.Le gestionnaire de sections apparat.2 Cliquez sur le bouton Nouveau.LE GUIDE COMPLET 123Chapitre 4Crer des articlesFigure 4.11 : Le bouton Nouveau dans le gestionnaire de sectionsLa fentre de cration de la nouvelle section apparat.Figure 4.12 : La fentre de cration de la nouvelle section3 la rubrique Dtails, dans la zone Titre, saisissez le nom que vous souhaitez affecter la section, en rapport avec le thme de votre site web.Figure 4.13 : La saisie du titre de la sectionLes autres zones de la fentre ne seront pas modies pour linstant.4 Cliquez sur le bouton Sauver.124 LE GUIDE COMPLETCrer des catgoriesChapitre 4De retour dans le gestionnaire de section, le nom de la nouvelle section a t ajout la liste des sections dj existantes.Figure 4.14 : Le nom de la nouvelle section gure dsormais dans la liste des sectionsVous allez maintenant, et de la mme faon, crer quelques catgories.4.5. Crer des catgoriesSi lon tablit une comparaison entre une section et une armoire, une catgorie, elle, correspond lune des tagres de larmoire. Une tagre contient les diffrents lments que vous y avez rangs. Dans Joomla, ces lments sont des articles.1 Cliquez sur le menu Contenu/Gestion des catgories.Le gestionnaire de catgories apparat.2 Cliquez sur le bouton Nouveau.La fentre de cration de la nouvelle catgorie apparat.LE GUIDE COMPLET 125Chapitre 4Crer des articlesFigure 4.15 : La fentre de cration de la nouvelle catgorie3 la rubrique Dtails, dans la zone Titre, saisissez le nom que vous souhaitez affecter la catgorie.Figure 4.16 :La saisie du titre de la catgorie4 Droulez la liste de la zone Section et choisissez la section prcdemment cre.Figure 4.17 : Le choix de la sectionLes autres zones de la fentre ne seront pas modies pour linstant.5 Cliquez sur le bouton Sauver.126 LE GUIDE COMPLETCrer des catgoriesChapitre 4De retour dans le gestionnaire de catgories, le nom de la nouvelle catgorie a t ajout la liste des catgories dj existantes.Figure 4.18 : Le nom de la nouvelle catgorie gure dsormais dans la liste des catgoriesCrez de la mme manire quelques autres catgories contenues dans la nouvelle section, et en rapport avec le thme de votre site web.Organiser laffichage des sections et des catgoriesLe gestionnaire de catgories, comme les autres gestionnaires (sections, articles, ), affiche rapidement un grand nombre ditems, au l de lavancement de vos travaux. Vous pouvez choisir dorganiser laffichage en modiant le critre de classement des lments. Cliquez pour ce faire sur le titre de la colonne de votre choix (Titre, Publi, Ordre, Accs, Section ). Vous pouvez galement choisir de ltrer les items en saisissant un mot-cl dans la zone Filtre, prsente en haut et gauche des gestionnaires.Figure 4.19 : La zone FiltreLE GUIDE COMPLET 127Chapitre 4Crer des articles4.6. Crer et modier des articlesPasses les tapes de cration des sections et des catgories, vous allez maintenant pouvoir crer les premiers articles de votre site web.1 Cliquez sur le menu Contenu/Gestion des articles.Le gestionnaire darticles apparat.2 Cliquez sur le bouton Nouveau.La fentre de cration de larticle apparat.Figure 4.20 : La fentre de cration de larticleCette fentre renferme toutes les fonctionnalits ncessaires la cration dun contenu rdactionnel de qualit, rdig au format HTML.Modication dun article existantLa procdure de modication dun article dj cr est identique. Elle seffectue galement depuis cette fentre. Pour modier un article existant, il vous suffit de cliquer sur son nom, dans la liste prsente par le gestionnaire darticles.3 Dans la zone Titre, saisissez le titre de larticle. Ne remplissez pas la zone Alias pour linstant.128 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4Figure 4.21 : La saisie du titre de larticleLa zone AliasCette zone peut tre laisse vide pour linstant. Son rle est de vous permettre de gnrer des URL explicites, cest--dire des adresses de pages renfermant des mots-cls signicatifs dans le but damliorer votre indexation dans les moteurs de recherche.4 Droulez la liste de la zone Section et affectez une section larticle.Figure 4.22 : Une section est affecte larticle5 Droulez la liste de la zone Catgorie et affectez une catgorie larticle.Figure 4.23 : Une catgorie est affecte larticleLE GUIDE COMPLET 129Chapitre 4Crer des articles6 Dans la zone principale de la fentre, rserve la saisie de larticle, saisissez le texte de larticle ou copiez-y le texte de votre choix.Figure 4.24 : Un texte est copi dans la zone de saisie de larticleCopier/coller du texte de larticleIl nest pas obligatoire de saisir lintgralit du texte dans la zone de saisie de larticle. Le contenu textuel peut en effet tre copi/coll depuis une source externe (page HTML, document Word, etc.). Pour viter dinsrer des codes de mise en forme parasites, provenant de la source originelle, nous vous conseillons de procder en deux tapes. Commencez par slectionner le texte copier dans son emplacement dorigine puis collez-le dans le Bloc-notes de Windows (que vous ouvrirez par le bouton Dmarrer de Windows puis par Tous les programmes/Accessoires/Bloc-notes). Dans le Bloc-notes, slectionnez tout le texte ([Ctrl]+[A]) puis copiez-le dans le Presse-papiers ([Ctrl]+[C]). Utilisez la Barre des tches de Windows pour retourner linterface de Joomla, cliquez dans la zone de saisie de larticle et collez-y le texte ([Ctrl]+[V]). Cette opration a pour effet de supprimer les ventuels contrles de mise en forme du texte (le Bloc-notes tant un simple diteur de texte ne grant pas la mise en forme). Le texte hritera alors des attributs de mise en forme dnis dans lditeur darticles de Joomla.130 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4Ces quelques tapes sont suffisantes pour permettre la cration dun article de base. Celui-ci pourrait dj, ce stade, tre enregistr et publi. Bien entendu, vous disposez de nombreuses fonctionnalits vous permettant damliorer sa mise en forme. Les principales dentre elles sont dcrites dans ce qui suit. Mais, avant daller plus loin, peut-tre souhaitez-vous visualiser larticle, tel quil le sera par les visiteurs de votre site. Pour ce faire, deux solutions soffrent vous : la prvisualisation dans une fentre ddie cet usage ou laffichage de larticle dans la partie publique du site.Prvisualiser larticle dans une fentre de prvisualisationLa mthode de prvisualisation la plus simple, et la plus rapide, consiste cliquer sur le bouton Prvisualiser, propos en haut et droite de la fentre de lditeur darticles.1 Cliquez sur le bouton Prvisualiser.Figure 4.25 : Le bouton PrvisualiserUne fentre de prvisualisation de larticle est affiche en surimpression de la fentre de lditeur darticle (voir Figure 4.26).2 Utilisez, le cas chant, les barres de dlement proposes sur la droite de la fentre de prvisualisation, pour apprcier la mise en forme de larticle. 3 La prvisualisation termine, fermez la fentre en cliquant sur le bouton de fermeture, symbolis par une croix, dans langle suprieur droit de la fentre de visualisation (voir Figure 4.27).LE GUIDE COMPLET 131Chapitre 4Crer des articlesFigure 4.26 : La fentre de prvisualisationFigure 4.27 : La fermeture de la fentre de prvisualisationPrvisualiser larticle dans le frontendLa mthode qui prcde, dont lavantage essentiel est limmdiatet, ne permet toutefois pas de visualiser larticle dans son contexte rel, cest--dire dans le site web. Si vous prfrez cette seconde solution, vous devez rendre larticle accessible, depuis la partie publique. Dans la plupart des cas, cette opration seffectue par lemploi dun item de menu, opration que nous navons pas encore aborde. Une alternative simple soffre pourtant vous, si vous souhaitez consulter larticle dans le frontend sans crer vers lui un lien dans un menu : lutilisation de la fonctionnalit daffichage des derniers articles, propose par dfaut sur la page daccueil du site.132 LE GUIDE COMPLETCrer et modifier des articlesChapitre 41 Cliquez sur le bouton Appliquer. 2 Cliquez sur le lien Prvisualiser, plac droite de la barre de menus de Joomla.Figure 4.28 : Le lien PrvisualiserLa partie publique du site est affiche dans un nouvel onglet.Figure 4.29 : Le frontend est affich dans un nouvel onglet du navigateur la rubrique Latest News, prsente en haut et gauche de votre site Joomla, sont affichs 5 liens pointant vers les 5 derniers articles rdigs. Le premier lien pointe vers votre article.3 Cliquez sur le lien pointant vers votre article.Figure 4.30 : Le lien pointant vers votre nouvel articleLE GUIDE COMPLET 133Chapitre 4Crer des articlesLarticle est affich dans son contexte rel, sur votre site web.Figure 4.31 : Le nouvel article, affich sur le siteMettre en forme le contenu de larticleRetournez la fentre de cration de larticle en cliquant, depuis votre navigateur Internet, sur longlet qui la renferme. Dans cette section, vous allez dcouvrir tous les lments de lditeur darticle, propos par dfaut lors de linstallation de Joomla.Figure 4.32 : Les boutons de mise en forme du contenu, proposs danslditeurLditeur HTMLLes articles de Joomla sont des parties de pages HTML. Le rle de lditeur de Joomla est de vous prsenter, sous forme graphique, le contenu de larticle, et de vous permettre deffectuer sa mise en forme par un ensemble de fonctionnalits (boutons, listes droulantes, ), puis, de manire transparente pour lutilisateur, denregistrer ce contenu la norme HTML.134 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4Bien que lditeur par dfaut (TinyMCE) soit dot de fonctionnalits suffisamment volues pour vous permettre une mise en forme sophistique, vous pourrez, en outre, tlcharger sur le site http://www .joomlafrance.org, par exemple, des diteurs encore plus sophistiqus, tels que le clbre diteur JCE.Figure 4.33 : Le tlchargement de lditeur JCE, ladresse http://www.joomlafrance.org/telecharger/select/J1.5_Editeur_ HTML/par_titre/1.htmlVoici la liste des principaux boutons de lditeur, dans lordre de leur prsentation lcran, et leurs fonctions associes :jLe bouton Bold permet de mettre la slection en caractres gras. Le bouton Italic permet de mettre la slection en caractres italiques. Le bouton Underline permet de mettre la slection en caractres souligns.jjLE GUIDE COMPLET 135Chapitre 4jCrer des articlesLe bouton Strikethrough permet de mettre la slection en caractres barrs. Le bouton Align left permet daligner le paragraphe gauche. Le bouton Align center permet de centrer le paragraphe.jjjLe bouton Align right permet daligner le paragraphe droite. Le bouton Align full permet de justier le paragraphe.jjLa liste Styles permet daffecter un style dni dans le template.Figure 4.34 : La liste des styles jj jLa liste Format permet daffecter un format HTML la slection (cette fonctionnalit est particulirement utile pour affecter des niveaux hirarchiques titre 1, titre 2 des paragraphes) (voir Figure 4.35). La liste Font family permet daffecter une famille de polices de caractres la slection (voir Figure 4.36). Le bouton Unordered list permet daffecter le style liste puces la ligne slectionne.136 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4Figure 4.35 : La liste des formats HTML permettant de dnir des niveaux hirarchiquesFigure 4.36 : La liste des familles de polices jLe bouton Ordered list permet daffecter le style liste numrote la ligne slectionne. Le bouton Outdent permet de rduire le retrait du paragraphe.jLE GUIDE COMPLET 137Chapitre 4jCrer des articlesLe bouton Indent permet daugmenter le retrait du paragraphe. Le bouton Undo permet dannuler la dernire opration effectue. Le bouton Redo permet de rpter la dernire opration effectue. Le bouton Insert/edit link permet de crer ou dditer un lien hypertexte sur la slection. Le bouton Unlink permet de supprimer un lien hypertexte sur la slection. Le bouton Insert/edit anchor permet de crer ou dditer une ancre de lien hypertexte sur la slection. Le bouton Insert/edit image permet dinsrer une image dans un texte ou den diter les proprits. Le bouton Cleanup messy code permet de supprimer les attributs de mise en forme, lorsque du texte est copi/coll depuis une autre application. Le bouton Edit HTML Source permet dditer le code HTML de larticle, an dy apporter des spcicits non prises en charge par lditeur HTML. Le bouton Find permet deffectuer la recherche dune chane de caractres dans le texte de larticle. Le bouton Find/Replace permet deffectuer le remplacement dune chane de caractres dans le texte de larticle.jjjjjjjjjj138 LE GUIDE COMPLETCrer et modifier des articlesjChapitre 4Le bouton Insert date permet dinsrer la date dans le texte de larticle. Le bouton Insert time permet dinsrer lheure dans le texte de larticle. Le bouton Emotions permet dinsrer un moticne dans le texte de larticle. Le bouton Insert/edit Embedded media permet dinsrer un chier multimdia dans le texte de larticle. Le bouton Insert new layer permet dinsrer un calque dans le texte de larticle. Le bouton Select text color permet daffecter une couleur spcique au texte slectionn dans larticle. Le bouton Insert horizontal ruler permet de tracer une ligne horizontale dans le texte de larticle. Le bouton Remove formatting permet de supprimer les attributs de mise en forme sur le texte slectionn. Le bouton Toogle guidelines/invisible elements permet dafficher les contours des tableaux insrs dans le texte de larticle. Le bouton Subscript permet daffecter au texte slectionn la position Indice. Le bouton Superscript permet daffecter au texte slectionn la position Exposant.jjjjjjjjjjLE GUIDE COMPLET 139Chapitre 4jCrer des articlesLe bouton Insert custom character permet linsertion de caractres spciaux dans le texte de larticle. Le bouton Horizontal rule permet linsertion dune ligne de sparation horizontale de largeur et de hauteurs paramtrables dans le texte de larticle. Le bouton Inserts a new table permet linsertion dun tableau dans le texte de larticle. Le bouton Table row properties permet de modier les proprits de la ligne slectionne dans un tableau de larticle. Le bouton Table cell properties permet de modier les proprits de la cellule slectionne dans un tableau de larticle. Le bouton Insert row before permet dinsrer une ligne avant la ligne slectionne dans un tableau de larticle. Le bouton Insert row after permet dinsrer une ligne aprs la ligne slectionne dans un tableau de larticle. Le bouton Delete row permet de supprimer une ligne slectionne dans un tableau de larticle. Le bouton Insert colomn before permet dinsrer une colonne avant la colonne slectionne dans un tableau de larticle. Le bouton Insert colomn after permet dinsrer une colonne aprs la colonne slectionne dans un tableau de larticle. Le bouton Remove colomn permet de supprimer une colonne slectionne dans un tableau de larticle.jjjjjjjjjj140 LE GUIDE COMPLETCrer et modifier des articlesjChapitre 4Le bouton Split merged table cells permet de diviser des cellules prcdemment fusionnes dans un tableau de larticle. Le bouton Merge table cells permet de fusionner des cellules slectionnes dans un tableau de larticle. Le bouton Toggle fullscreen mode permet de basculer en mode Plein cran (seuls les boutons ddition de larticle sont affichs). Le bouton Edit CSS Style permet dditer un style CSS.jjjRaccourcis clavierDes raccourcis clavier sont associs la plupart des boutons de lditeur. Leur fonction est de permettre de lancer une action par combinaisons de touches, action gnralement plus rapide que celle de la souris ([Ctrl]+[B], par exemple, pour mettre le texte slectionn en gras). Pour connatre ces combinaisons de touches, survolez quelques instants les boutons de lditeur ; elles apparaissent dans de petites infobulles.Insrer une image dans le texte de larticleBien quil vous soit possible dinsrer une image dans le texte de larticle grce au bouton Insert/edit image cit prcdemment, la fentre de cration de larticle vous offre une seconde opportunit, plus volue.1 Placez le curseur dans le texte de larticle, lendroit o linsertion doit avoir lieu. 2 Cliquez sur le bouton Image, plac en bas de la fentre de cration de larticle.Une fentre apparat en surimpression devant larticle. Celui-ci nest plus accessible jusqu la fermeture de la fentre (voir Figure 4.37). Les principales fonctionnalits proposes dans cette fentre sont les suivantes :LE GUIDE COMPLET 141Chapitre 4Crer des articlesFigure 4.37 : La fentre dinsertion dimages jjj j jLes vignettes des images. Lorsque lune dentre elles est clique, le nom de limage, prcd de son chemin daccs, est insr dans la zone URL de limage, vous vitant ainsi la saisie de cette dernire. Les vignettes des dossiers. Lorsque lune dentre elles est clique, le dossier correspondant est ouvert (vous pouvez avoir recours la cration de dossiers an damliorer le classement de vos images, lorsque le nombre de celles-ci est important). Le dossier de stockage des images par dfaut est images/stories. Vous pouvez galement avoir recours la liste droulante, propose en haut et gauche de la fentre, pour slectionner un dossier. Le bouton Haut, affich droite de cette liste, permet, quant lui, de remonter au rpertoire parent. La liste droulante de la zone Aligner permet de choisir le type dalignement de limage (gauche ou droite). La zone Description de limage vous permet de saisir une description de limage. La zone Titre vous permet de saisir le titre de limage, qui sera affich dans le frontend lorsque le pointeur de la souris survolera limage. Nous vous conseillons de toujours renseigner cette zone avec un contenu pertinent, en rapport direct avec limage. Outre142 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4j jj jlinformation apporte linternaute et aux personnes malvoyantes, dont les logiciels dassistance la lecture sont capables de lire cette zone, ce contenu textuel est utilis par les moteurs de recherche pour le classement des sites dans leurs pages de rsultats. La case Lgende. Lorsquelle est coche, elle gnre laffichage du titre sous la forme dune lgende, cot de limage. La rubrique Transfrer. Cette fonctionnalit a pour consquence un gain apprciable de temps, lorsque le webmestre constate que limage quil souhaite insrer na pas t transfre sur le site depuis le gestionnaire de mdias. Alors quil devait, dans la version prcdente de Joomla, enregistrer larticle et fermer lditeur darticles, puis retourner au gestionnaire de mdias an de transfrer limage avant de devoir ouvrir larticle nouveau, il peut dsormais, grce aux boutons Parcourir puis Lancer le transfert, transfrer limage directement depuis la fentre dinsertion de limage. Le bouton Insrer valide linsertion de limage dans le texte de larticle. Le bouton Annuler annule laction dinsertion de limage.Crer un lien hypertexteToute aussi utile que linsertion dimage, la fonctionnalit de cration de liens hypertextes est indispensable. Elle vous permet, depuis une portion de texte ou une image, de crer un lien menant une autre page de votre site (on parle alors de "lien interne") ou une page quelconque, place sur un autre site (on parle ici de "lien externe"). Voici le mode opratoire pour crer un lien hypertexte, depuis lditeur darticles :1 Slectionnez le texte ou limage sur lequel vous souhaitez crer le lien hypertexte.Figure 4.38 : Une partie du texte est slectionneLE GUIDE COMPLET 143Chapitre 4Crer des articles2 Cliquez sur Insert/edit link, prcdemment dcrit.La fentre Insert/edit link apparat. Longlet General y est activ.Figure 4.39 : La fentre Insert/edit link3 Dans la zone Link URL, saisissez ou collez ladresse Internet de la page vers laquelle vous souhaitez faire pointer le lien hypertexte (ladresse sera du type : http://www.mosaiqueinformatique.com). 4 Si le lien pointe vers la mme page que celle dans laquelle vous tes en train de crer le lien hypertexte et si vous y avez plac des marques au moyen du bouton Insert/edit anchor, vous pouvez indiquer le nom de lancre dans la zone Anchor. 5 La zone Target propose, par dfaut, le choix Open in this window/frame. Cela signie que le lien, une fois cliqu, ouvrira la page cible dans la fentre actuelle. Si le lien pointe vers un autre site que le vtre, vous perdrez linternaute puisquil quittera votre site. Vous pouvez, dans ce cas, prfrer ouvrir la nouvelle page dans une nouvelle fentre. Choisissez, pour ce faire, loption Open in new windows (_blank) dans la liste droulante de la zone Target. 6 La zone Title est trs importante, mme sil nest pas obligatoire pour vous de la remplir. En effet, le contenu textuel saisi dans cette zone saffiche, lorsque le lien hypertexte est survol, sous la forme dune infobulle. Celle-ci amliore laccessibilit, pour les personnes handicapes disposant de logiciels spciques, ainsi144 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4que lindexation dans les moteurs de recherche, qui accordent beaucoup de crdit cet attribut. Saisissez-y un court texte, en rapport avec le sujet de la page vers laquelle pointe le lien, sous la forme dune courte phrase, par exemple.Crer un lien vers une adresse emailSi vous souhaitez que le lien pointe non vers une page web mais vers une adresse email, faite prcder cette adresse de la mention mailto: dans la zone Link URL. Ladresse sera alors du type mailto:georges@lesitedegeorges.fr.7 Cliquez sur le bouton Insert de la fentre Insert/edit link.Crer un saut de page dans le texte de larticleSi larticle est de taille importante, vous pouvez choisir de le fractionner en plusieurs pages, qui seront accessibles par une table des matires constituant une"mini-navigation", compose de liens hypertextes, affichs sur chacune dentre elles.1 Cliquez dans le texte de larticle, lendroit o vous souhaitez crer le saut de page. 2 Cliquez sur le bouton Saut de page, plac en bas de la fentre de cration de larticle.Une fentre apparat en surimpression devant larticle. Celui-ci nest plus accessible jusqu la fermeture de la fentre.Figure 4.40 : La fentre dinsertion du saut de pageLE GUIDE COMPLET 145Chapitre 4Crer des articles3 Dans la zone Titre de la page, saisissez le titre qui sera affich dans la barre de titre du navigateur, lorsque la portion de page sera affiche. Comme nous lavons fait prcdemment pour le titre dune image, nous vous conseillons de toujours renseigner cette zone avec un contenu pertinent, en rapport direct avec la page ; cette information est utilise notamment par les moteurs de recherche lorsquils effectuent le rfrencement du site. 4 Dans la zone Tableau des alias darticles, saisissez le texte qui sera affich dans la table des matires. Si cette zone est laisse vide, le texte constituant le titre sera utilis par Joomla.Figure 4.41 : Exemple de textes saisis dans les deux zones5 Cliquez sur le bouton Insrer un saut de page.Dans lditeur, le saut de page est gur dans le texte par une ligne pointille.Figure 4.42 : Le symbole du saut de page146 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4Modication et suppression dun saut de pageUn saut de page ne peut pas tre modi. Si vous souhaitez le modier, vous devez le supprimer puis le recrer. Pour le supprimer, placez le curseur sur la ligne suivant le symbole du saut de page puis appuyez sur la touche [].6 Enregistrez les modications et retournez la gestion des articles en cliquant sur le bouton Enregistrer. 7 Ouvrez longlet de votre navigateur dans lequel est affiche la partie publique du site puis cliquez sur le lien Home. 8 Cliquez, la rubrique Latest News, sur le lien pointant vers votre article.La table des matires apparat dans la partie droite de larticle.Figure 4.43 : La table des matiresEn bas de la page, sont dsormais affichs des liens de navigation vers les pages constituant larticle.Figure 4.44 : Les liens de navigationDans la barre de titre du navigateur est affich le titre de larticle.LE GUIDE COMPLET 147Chapitre 4Crer des articlesFigure 4.45 : Le titre de la page9 Dans la table des matires, cliquez, sur le lien pointant vers la seconde page de larticle et portant le libell saisi prcdemment dans la zone Tableau des alias darticles.Figure 4.46 : Le lien pointant vers la seconde page de larticleDplacement dans les pagesPour vous dplacer dans les pages, vous pouvez galement utiliser les liens de navigation gnrs automatiquement en bas de page.La seconde page apparat, avec la mention "Page 2 de 2".Figure 4.47 : La seconde pageDans la barre de titre du navigateur est affich le titre saisi prcdemment dans la zone Titre de la page.10 Rptez lopration autant de fois que ncessaire pour crer dautres sauts de page.148 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4Vous allez maintenant dcouvrir les principaux paramtres de personnalisation de larticle.Dnir les paramtres de larticleLes paramtres par dfautAn de vous viter de rednir les paramtres lis aux articles dans chacun dentre eux, Joomla autorise la dnition dun ensemble de paramtres gnraux qui sont appliqus par dfaut aux articles. Vous conservez toutefois la possibilit de modier ponctuellement ces paramtres dans chacun des articles.1 Cliquez sur le menu Contenu/Gestion des articles.La page de gestion des articles apparat.2 Depuis la page de gestion des articles, cliquez sur le bouton Paramtres.Figure 4.48 : Le bouton Paramtres, affich dans la partie suprieure droite du gestionnaire darticlesUne fentre apparat en surimpression devant le gestionnaire darticles (voir Figure 4.49).3 Modiez, le cas chant, les paramtres que vous souhaitez appliquer par dfaut aux articles (les principaux paramtres de cette liste sont expliqus dans la section qui suit). 4 Cliquez sur le bouton Sauver an de quitter la fentre en sauvegardant les modications ou sur le bouton Annuler pour quitter sans sauvegarder.LE GUIDE COMPLET 149Chapitre 4Crer des articlesFigure 4.49 : La fentre de gestion des paramtres par dfautLes paramtres spciques de larticleLes paramtres dnis par dfaut peuvent tre modis ponctuellement pour chacun des articles.1 Cliquez sur le menu Contenu/Gestion des articles.La page de gestion des articles apparat.2 Utilisez, le cas chant, les listes des zones Slectionner une section, Slectionner une catgorie, Slectionner un auteur ou/et Slectionner un tat pour ltrer les titres darticles affichs.Figure 4.50 : Les articles sont ici ltrs sur la section150 LE GUIDE COMPLETCrer et modifier des articlesChapitre 43 Cliquez sur le lien pointant vers larticle prcdemment cr et portant le nom de larticle.Larticle est de nouveau affich dans lditeur darticles.Les paramtres non modiablesDans la partie suprieure droite de la fentre sont affiches des informations non modiables ( lexception du compteur de clics, qui peut tre rinitialis).Figure 4.51 : Les informations non modiablesCes informations sont les suivantes :j j jjj jlidentiant de larticle, qui se compose dun numro unique, affect automatiquement par Joomla ; ltat de publication de larticle ; le nombre de clics, qui indique le nombre de fois o larticle a t affich dans le frontend (cette valeur peut tre rinitialise au moyen du bouton Rinitialiser) ; le nombre de rvisions, qui indique le nombre de modications enregistres depuis que larticle a t affich, modications effectues par vous-mme ou dautres administrateurs du site, dans lditeur darticles du backend ; la date de cration de larticle ; la date de dernire modication de larticle.Les paramtres courants de larticleCliquez maintenant sur la zone Paramtres Article prcde dune petite che verte, en dessous de la zone daffichage des informations non modiables, an de faire apparatre les paramtres de cette rubrique.LE GUIDE COMPLET 151Chapitre 4Crer des articlesFigure 4.52 : Les paramtres de la zone Paramtres ArticleLes paramtres accessibles dans cette rubrique sont les suivants :j j j jLauteur. Le pseudo de lauteur, qui sera affich, le cas chant, en remplacement du nom de lauteur. Le niveau daccs, correspondant aux groupes Public, Enregistr et Spcial. La date de cration de larticle, qui peut tre aisment modie par un clic sur un calendrier interactif, affich lorsque le bouton plac droite de la zone de date est cliqu.Figure 4.53 : La saisie de la date de cration seffectue par un simple clic sur un calendrier152 LE GUIDE COMPLETCrer et modifier des articlesjChapitre 4jLa date de publication. Ce paramtre est utile si vous souhaitez, par exemple, prparer un certain nombre darticles destins tre diffuss pendant vos vacances, donnant ainsi lillusion aux internautes (et aux moteurs de recherche) dune mise jour rgulire. Larticle est publi ds que la date de publication est atteinte. Par dfaut, la date de publication est identique la date de cration. La date de n de publication. Ce paramtre vous sera utile si vous souhaitez publier un article pendant une priode dtermine, puis mettre n sa mise en ligne une date donne.Les paramtres avancsCliquez prsent sur la zone affichant Paramtres Avancs, prcde dune petite che verte, en dessous de la zone daffichage Paramtres Article, an de faire apparatre les paramtres de cette rubrique. Pour la plupart dentre eux, cest la valeur par dfaut (correspondant au choix Paramtres globaux dans les listes droulantes des paramtres) qui est propose (mais une autre valeur peut tre choisie an dtre applique ponctuellement larticle). Les paramtres accessibles dans cette rubrique sont les suivants :j jLe choix daffichage ou de masquage du titre de larticle. Lactivation/dsactivation de la fonctionnalit "titres cliquables".Figure 4.54 : Les paramtres de la zone Paramtres AvancsLE GUIDE COMPLET 153Chapitre 4jCrer des articlesjj jj jLe choix daffichage ou de masquage du texte dintroduction. Cette fonctionnalit est utile lorsque, par exemple, le titre dun nouvel article est affich en page daccueil, suivi dun court texte dintroduction, composant le dbut de larticle. Il est alors possible de choisir si ce texte introductif est ou non affich lorsque larticle est consult dans son intgralit. Le choix daffichage ou de masquage du nom de la section laquelle est rattach larticle, lorsque celui-ci est consult (outre linformation supplmentaire quil apporte linternaute, ce libell peut amliorer le positionnement de la page dans les moteurs de recherche, en apportant un lment textuel en rapport direct avec le sujet de larticle). Lactivation/dsactivation de la fonctionnalit "titre de section cliquable". Le choix daffichage ou de masquage du nom de la catgorie laquelle larticle est rattach, lorsque celui-ci est consult (outre linformation supplmentaire quil apporte linternaute, ce libell peut amliorer le positionnement de la page dans les moteurs de recherche, en apportant un lment textuel en rapport direct avec le sujet de larticle). Lactivation/dsactivation de la fonctionnalit "titre de catgorie cliquable". Lactivation/dsactivation de la fonctionnalit permettant linternaute daffecter une note larticle.Figure 4.55 : La fonctionnalit daffectation dune note larticle, par linternaute, affiche ici dans le frontend j j jLe choix daffichage ou de masquage du nom de lauteur. Le choix daffichage ou de masquage de la date et de lheure de cration de larticle. Le choix daffichage ou de masquage de la date et de lheure de dernire modication de larticle.154 LE GUIDE COMPLETCrer et modifier des articlesjChapitre 4jj j jLe choix daffichage ou de masquage de licne PDF (qui permet un visiteur de gnrer un chier au format PDF, quil pourra facilement enregistrer ou transmettre, et renfermant le contenu de larticle). Le choix daffichage ou de masquage de lIcne Imprimer (qui permet un visiteur dimprimer facilement le contenu de larticle). Le choix de la langue de larticle (qui permet dindiquer en quelle langue est rdig larticle). La possibilit dindiquer une cl de rfrence larticle, dans certaines congurations. La possibilit dindiquer une expression autre que le texte "lire la suite", lorsque le dbut de larticle est, par exemple, affich en page daccueil. Cette fonctionnalit amliore laccessibilit du site aux personnes malvoyantes ainsi que lindexation de larticle dans les moteurs de recherche, si lexpression utilise renferme des mots-cls en rapport avec le sujet trait dans larticle (lutilisation du bouton Lire la suite est explicite plus loin).Les paramtres des mtadonnesLa structure dune page HTML intgre une zone den-tte, destine tre affiche dans la page et renfermer tous les lments ntant pas destins tre affichs dans la fentre du navigateur de linternaute visitant le site. Certains de ces lments, nomms "mtadonnes", sont principalement utiliss par les moteurs de recherche. Lditeur darticle permet de renseigner certains dentre eux, lorsque la zone Informations des mtadonnes est clique (voir Figure 4.56). Les paramtres accessibles dans cette rubrique sont les suivants :jjLa zone Description, qui sera affiche par les moteurs de recherche, en tant que description de la page. Mme si cette zone na pas dincidence sur lindexation dans les moteurs, il est utile de la renseigner avec prcision car elle sera visible des internautes dans les pages de recherche ; cest donc elle qui dclenchera (ou non) les clics sur le lien menant la page. La zone Mots-cls. La nalit de cette mtadonne est de recevoir des mots-cls, en rapport avec le sujet trait dans larticle, etLE GUIDE COMPLET 155Chapitre 4Crer des articlesspars par des virgules. De nombreux webmestres en ayant fait un usage intempestif, en y plaant un nombre excessif et inadapt de mots-cls, la quasi-totalit des grands moteurs de recherche, dont Google, ne lui accordent plus aucun crdit. La zone Motscls peut toutefois tre utile si le module Related Items est activ.Le module Related ItemsCe module de Joomla a pour fonction, lorsquil est activ, dafficher des liens de navigation entre des articles ayant des mots-cls communs. Outre la uidit de navigation sur le site quelle apporte, cette fonctionnalit amliore le rfrencement des articles car ils constituent des "liens profonds" entre des pages dont le contenu rdactionnel est similaire ou trs proche.Figure 4.56 : Les paramtres de la zone Informations des mtadonnes jjLa zone Robots peut renfermer des informations facultatives composes dinstructions spciques aux programmes de certains moteurs de recherche. La zone Auteur est galement une information facultative : le nom de lauteur, utilis par certains moteurs de recherche.Publier larticle en page daccueilPar dfaut, sa cration, larticle a le statut "publi", cest--dire quil sera visible dans le frontend, sil est accessible depuis un menu, par exemple.156 LE GUIDE COMPLETCrer et modifier des articlesChapitre 4Vous pouvez, en outre, le rendre visible sur la page daccueil (pour annoncer aux visiteurs une rcente parution ou parce que larticle est trs important).1 Pour publier ou dpublier larticle, cochez lune des options de la zone Publi. 2 Pour rendre visible ou non larticle sur la page daccueil, cochez lune des options de la zone Page daccueil.Figure 4.57 : Les options de publication et daffichage en page daccueil de larticleLe bouton Lire la suiteLditeur darticles prsente, dans sa partie infrieure, un bouton Lire la suite. Lorsquil est cliqu, il gnre linsertion dune ligne pointille rouge dans le texte de larticle.Figure 4.58 : Le bouton Lire la suiteFigure 4.59 : Dans le texte de larticle, la fonctionnalit Lire la suite est symbolise par une ligne pointille rougeLE GUIDE COMPLET 157Chapitre 4Crer des articlesLa fonctionnalit se matrialise, dans le frontend, par un lien mentionnant le texte "Lire la suite", lendroit o a t plac le symbole dans le texte.Figure 4.60 : Le lien Lire la suite, affich dans le fontendVous savez dsormais comment crer des articles et les affecter des sections et des catgories. Vous allez maintenant dcouvrir les diffrentes mthodes qui soffrent vous pour les afficher dans le site.4.7. Check-listj j jjLe systme utilise des paramtres gnraux quil convient de dnir lors de la mise en uvre. Joomla utilise un classement hirarchis des articles, rpartis en sections et en catgories. Un diteur WYSIWYG de code HTML permet deffectuer une mise en forme avance des textes, des images et objets qui constituent les articles. Un module spcial permet de placer les articles de votre choix en page daccueil, an den accrotre la visibilit.158 LE GUIDE COMPLETAdministrer les menusDsactiver les menus inutiles ......................................................................................... 160 Modifier un menu existant ............................................................................................... 162 Exploiter les diffrents lments de menu .................................................................. 163 Ajouter un item au menu .................................................................................................. 175 Crer un nouveau menu ................................................................................................... 177 Modifier les paramtres daffichage dun menu ........................................................ 180 Check-list ............................................................................................................................. 187Chapitre 5Administrer les menusLors de son installation, avec les donnes dexemple, le frontend de Joomla prsente diffrents menus, de types horizontaux et verticaux. Les menus renferment des liens (items), menant soit directement des articles, soit des composants daffichage des articles. titre dexemple, vous allez dcouvrir les items du menu principal de Joomla, le menu mainmenu. Cliquez pour cela sur Menus/Main Menu. Le Gestionnaire dlments de menu apparat, affichant les diffrents items implments par dfaut lors de linstallation des donnes dexemple de Joomla (Home, Joomla Overview, etc.).Figure 5.1 : Les diffrents items du menu Main Menu5.1. Dsactiver les menus inutilesPour apprhender aisment le mode de fonctionnement des menus de Joomla, nous vous proposons de commencer par dsactiver ceux que vous nutiliserez pas, pendant votre phase de dcouverte du CMS, en tous cas. Lobjectif de la manipulation qui va suivre est donc le suivant : conserver uniquement le menu horizontal, affich en haut de la fentre du frontend, et le premier menu vertical, affich gauche de la fentre du frontend.1 Cliquez sur Extensions/Gestion des modules.160 LE GUIDE COMPLETDsactiver les menus inutilesChapitre 5Le gestionnaire de modules apparat.2 Dans la colonne Activ du gestionnaire, cliquez sur les symboles dactivation des lignes des modules User Menu, Resources, Example pages et Keys Concepts an de dsactiver ces modules.Figure 5.2 : Les modules peuvent tre activs ou dsactivs par de simples clics dans la colonne Activ3 Retournez dans longlet de votre navigateur dans lequel est affiche la partie publique du site et actualisez la page en cliquant sur le bouton dactualisation du navigateur.Seuls le menu horizontal (en haut) et le menu principal ( gauche) restent affichs.Figure 5.3 : Les menus dsactivs napparaissent plus dans le frontendLE GUIDE COMPLET 161Chapitre 5Administrer les menus5.2. Modier un menu existantVous allez apprendre ici dsactiver les items du menu inutiles et en ajouter de nouveaux. Procdez ainsi :1 Cliquez sur Menus/Main Menu.Le gestionnaire dlments de menu est affich.2 Dans la colonne place gauche de la colonne Alias de menu, cochez toutes les lignes lexception de Home.Figure 5.4 : Les alias dsactiver sont cochs162 LE GUIDE COMPLETExploiter les diffrents lments de menuChapitre 53Cliquez sur le bouton Dpublier.4 Retournez dans longlet de votre navigateur dans lequel la partie publique du site est affiche et actualisez la page en cliquant sur le bouton dactualisation du navigateur.Le menu principal naffiche plus quun item : le lien Home.Figure 5.5 : Les items dpublis napparaissent plus dans le menu5.3. Exploiter les diffrents lments de menuLune des particularits remarquables de Joomla est le nombre impressionnant de fonctionnalits que le systme permet dattacher aux items de menus. Vous allez les dcouvrir dans ce qui suit.1 Cliquez sur Menus/Main Menu.Le Gestionnaire dlments de menu est affich.2Cliquez sur le bouton Nouveau.typeLa page Alias de menu: [ Nouveau ] est affiche. la rubrique Slection du dlment de menu sont proposes de trs nombreuses fonctionnalits daffichage de contenus, qui peuvent tre appeles depuis les items du menu.LE GUIDE COMPLET 163Chapitre 5Administrer les menusFigure 5.6 : La page affiche permet la cration de nombreux types ditemsde menusLes fonctionnalits daffichage des liens internesCes routines offrent de nombreuses mthodes diffrentes de prsentation des contenus du site, accessibles par un lien de menu.1 Cliquez sur le lien Articles an de dvelopper les options quil propose.Les types ditems de cette catgorie sont affichs (voir Figure 5.7). Les liens proposs sont les suivants :j Liste des articles archivs. j jCette fonctionnalit permet dafficher les articles archivs et classs par dates. Un article. Cette fonctionnalit permet dafficher un article unique. Proposition darticle. Cette fonctionnalit permet aux internautes disposant dun niveau dadministration gal ou suprieur celui dauteur de proposer des articles aux administrateurs du site.164 LE GUIDE COMPLETExploiter les diffrents lments de menuChapitre 5Figure 5.7 : Les types ditems de menus de la catgorie Articles j Articles dune catgorie donne en blog.jjCette fonctionnalit permet dafficher les articles appartenant une catgorie dans une forme rappelant celle utilise sur les blogs. Liste des articles dune catgorie. Cette fonctionnalit permet dafficher les articles appartenant une catgorie sous la forme dune liste, renfermant des liens cliquables, menant aux articles. Page daccueil au format blog. Cette fonctionnalit permet dafficher certains articles slectionns dans une forme rappelant celle utilise sur les blogs.LE GUIDE COMPLET 165Chapitre 5Administrer les menusj Articles dune section donne en blog.jCette fonctionnalit permet dafficher les articles appartenant une section dans une forme rappelant celle utilise sur les blogs. Liste des articles dune section. Cette fonctionnalit permet dafficher les articles appartenant une section sous la forme dune liste, renfermant des liens cliquables, menant aux articles.2 Cliquez sur le lien Contacts an de dvelopper les options quil propose.Les types ditems de cette catgorie sont affichs.Figure 5.8 : Les types ditems de menus de la catgorie ContactsLes liens proposs sont les suivants :j Contactsjclasss par catgories. Cette fonctionnalit permet dafficher une liste de contacts (an de permettre aux internautes de communiquer avec les administrateurs du site), classs par catgories de contacts. Fiche standard de contacts. Cette fonctionnalit permet dafficher la che dinformations relatives un contact spcique.3 Cliquez sur le lien Fils dactualit an de dvelopper les options quil propose.Les types ditems de cette catgorie sont affichs.166 LE GUIDE COMPLETExploiter les diffrents lments de menuChapitre 5Figure 5.9 : Les types ditems de menus de la catgorie Fils dactualitLes liens proposs sont les suivants :j Disposition de la liste de catgorie. j jCette fonctionnalit permet dafficher une liste de catgories de ls dactualit. Disposition de la catgorie. Cette fonctionnalit permet dafficher une liste de ls dactualit appartenant une catgorie de ls. Fil dactualit simple. Cette fonctionnalit permet dafficher un l dactualit unique.4 Cliquez sur le lien Sondage an de dvelopper loption quil propose.Les types ditems de cette catgorie sont affichs (voir Figure 5.10). Le lien propos est Mise en page du sondage. Cette fonctionnalit permet dafficher les rsultats dun sondage.5 Cliquez sur le lien Rechercher an de dvelopper loption quil propose.LE GUIDE COMPLET 167Chapitre 5Administrer les menusFigure 5.10 : Les types ditems de menus de la catgorie SondageLes types ditems de cette catgorie sont affichs.Figure 5.11 : Les types ditems de menus de la catgorie Rechercher168 LE GUIDE COMPLETExploiter les diffrents lments de menuChapitre 5Le lien propos est Rechercher. Cette fonctionnalit permet dafficher un formulaire de recherche et laffichage des rsultats associ.6 Cliquez sur le lien Utilisateur an de dvelopper les options quil propose.Les types ditems de cette catgorie sont affichs.Figure 5.12 : Les types ditems de menus de la catgorie UtilisateurLes liens proposs sont les suivants :j Identification. jCette fonctionnalit permet dafficher une page didentication, lattention des visiteurs du site. Enregistrement dun utilisateur. Cette fonctionnalit permet dafficher une page dinscription, lattention des visiteurs du site.LE GUIDE COMPLET 169Chapitre 5j Rappel.Administrer les menusj jjCette fonctionnalit permet dafficher une page dans laquelle lidentiant dun utilisateur peut lui tre rappel, sil la oubli. Rinitialiser. Cette fonctionnalit permet dafficher une page dans laquelle un utilisateur peut changer de mot de passe. Utilisateur. Cette fonctionnalit permet dafficher une page contenant un message lorsque lutilisateur accde un espace priv. Mise en page utilisateur. Cette fonctionnalit permet un utilisateur dditer les paramtres de son compte.7 Cliquez sur le lien Liens Web an de dvelopper les options quil propose.Les types ditems de cette catgorie sont affichs.Figure 5.13 : Les types ditems de menus de la catgorie Liens Web170 LE GUIDE COMPLETExploiter les diffrents lments de menuChapitre 5Les liens proposs sont les suivants :j Liste des catgories de liens Web. j jCette fonctionnalit permet dafficher une liste de catgories de liens web. Liste de catgories. Cette fonctionnalit permet dafficher une liste de liens web appartenant une catgorie de liens. Soumission de lien Web. Cette fonctionnalit permet aux utilisateurs enregistrs de soumettre un lien web.8 Cliquez sur le lien Encapsuleur (Wrapper) an de dvelopper loption quil propose.Les types ditems de cette catgorie sont affichs.Figure 5.14 : Les types ditems de menus de la catgorie Encapsuleur(Wrapper)LE GUIDE COMPLET 171Chapitre 5Administrer les menusLe lien propos est Encapsuleur (Wrapper). Cette fonctionnalit permet dafficher une fentre dencapsulation (correspondant la balise html ) dans laquelle peut tre affiche une page dun site quelconque.Crer un item de menu pointant vers une page externeCette fonctionnalit vous est utile lorsque vous dsirez ouvrir une page externe depuis un lien dans lun des menus de votre site Joomla.1 Cliquez sur le lien Lien externe.Lditeur de liens externes est affich.Figure 5.15 : Lditeur de liens externesLes principales zones quil vous faut renseigner, pour la cration du lien, sont les suivantes :j j jle titre, qui apparatra dans le menu ; ladresse de la page vers laquelle pointe le lien ; le nom du menu dans lequel sera cr litem ;172 LE GUIDE COMPLETExploiter les diffrents lments de menujChapitre 5le lien parent dans le menu (il est ainsi possible de crer des menus hirarchiss).2 Cliquez sur le bouton Sauver pour enregistrer votre travail ou sur Annuler si vous souhaitez sortir sans sauvegarder.Crer un item de sparation dans un menu1 De retour dans le Gestionnaire dlments de menu, cliquez sur le bouton Nouveau, an daccder comme prcdemment la slection du type dlment de menu. 2 Cliquez sur le lien Sparateur.Lditeur de sparateur est affich.Figure 5.16 : Lditeur de sparateur3 Pour crer une sparation dans le menu (si le nombre dlments quil renferme est important et que vous souhaitiez le scinder enLE GUIDE COMPLET 173Chapitre 5Administrer les menusplusieurs parties, par exemple), rptez le caractre de sparation dans la zone Titre.Figure 5.17 : titre dexemple, une ligne de sparation a ici t cre au moyen du caractre "gal" et une autre au moyen du caractre "dollar"4 Cliquez sur le bouton Sauver pour enregistrer votre travail ou sur Annuler si vous souhaitez sortir sans sauvegarder.Crer un alias de menu1 De retour dans le Gestionnaire dlments de menu, cliquez sur le bouton Nouveau, an daccder comme prcdemment la slection du type dlment de menu. 2 Cliquez sur le lien Alias.Lditeur dalias est affich. Vous pouvez alors crer un item de menu pointant vers un item de menu dj constitu, tout en lui conservant ses paramtres. Cette technique est utile pour optimiser lindexation dans les moteurs de recherche car une adresse unique est utilise pour accder une page donne, vitant ainsi aux moteurs dy voir un "contenu dupliqu".Contenu dupliquCe terme dsigne, dans la terminologie des moteurs de recherche, la rptition dun mme contenu dans des pages diffrentes. Dans un tel174 LE GUIDE COMPLETAjouter un item au menuChapitre 5cas, les moteurs de recherche, Google notamment, dcident, selon les paramtres en leur possession, quelle est la page originelle, et lindexent dans leurs banques de donnes alors que les autres pages sont, elles, ignores. Joomla cre les adresses des pages en leur affectant des paramtres diffrents en fonction des menus ou des modules qui les appellent (du type http://www.formations-informatiques-nancy.mosaiqueinformatique.fr/index.php?option=com_content&view=article&id=47:creez-votre-site-web&catid=39:internet). Aussi est-il prfrable dviter des consquences nfastes sur lindexation dune page en lui affectant toujours une adresse unique.5.4. Ajouter un item au menu titre dexemple, vous allez ajouter un lien dans le menu principal, menant directement un article que vous avez cr prcdemment. Vous pourrez facilement reproduire ce mode opratoire pour ladapter dautres types dlments de menu.1 Cliquez sur Menus/Main Menu.Le Gestionnaire dlments de menu est affich.2Cliquez sur le bouton Nouveau.La page Alias de menu: [ Nouveau ] est affiche.3 Dans la liste des types ditems proposs sous Lien interne, cliquez sur Articles. Sous Article, cliquez sur Un article (voir Figure 5.18).Le Gestionnaire dlments de menu apparat.4 Dans la zone Titre, saisissez un court texte, qui constituera le libell devant tre affich dans le menu. 5 Cliquez sur le bouton Slection, droite de la zone Slection article (voir Figure 5.19).LE GUIDE COMPLET 175Chapitre 5Administrer les menusFigure 5.18 : Le lien cliquerFigure 5.19 : Le bouton SlectionUne fentre apparat en surimpression de la page. Vous allez pouvoir y effectuer la slection de larticle.Figure 5.20 : La fentre autorisant la slection de larticle est affiche en surimpression de la fentre principale6 Choisissez, le cas chant, la section et la catgorie auxquelles est rattach larticle dans les listes des zones Slectionner une section176 LE GUIDE COMPLETCrer un nouveau menuChapitre 5et Slectionner une catgorie. Cliquez sur le titre de larticle vers lequel vous souhaitez faire pointer le lien. La fentre en surimpression disparat.7 De retour dans le Gestionnaire dlments de menu, cliquez sur le bouton Sauver. 8 Retournez dans longlet de votre navigateur dans lequel est affiche la partie publique du site et actualisez la page en cliquant sur le bouton dactualisation du navigateur.Litem ajout apparat dsormais dans le menu. Un clic sur litem affiche la page correspondante.Figure 5.21 : Le nouvel item est maintenant propos dans le menu5.5. Crer un nouveau menuAprs avoir appris ajouter un item dans un menu, vous allez maintenant dcouvrir comment crer un menu complet et comment le paramtrer an de modier son apparence. Votre objectif sera ici de crer un second menu vertical, affich en-dessous du menu principal.1 Cliquez sur Menus/Gestion des menus puis sur Nouveau.La page Dtails du menu: [ Nouveau ] est affiche.2 Dans la zone Type de menu, saisissez par exemple monmenu (ce nom est utilis dans le code de Joomla pour identier le menu. Il est prfrable de ne pas utiliser despace dans ce nom).LE GUIDE COMPLET 177Chapitre 5Administrer les menus3 Dans la zone Titre, saisissez par exemple Mon menu (ce nom apparatra dans la partie publique du site, si vous le dsirez). 4 Dans la zone Titre du module, saisissez par exemple monmenu (ce nom sera donn au module correspondant au menu et que vous retrouverez dans le Gestionnaire de modules).Figure 5.22 : La cration dun nouveau menu5 Cliquez sur le bouton Sauver.Bien que cr, votre menu nest pas encore visible dans le frontend. Vriez-le6 Retournez dans longlet de votre navigateur dans lequel est affiche la partie publique du site. Actualisez la page en cliquant sur le bouton dactualisation du navigateur.Le nouveau menu nest pas visible. Vous devez en effet activer le module.7 Retournez dans longlet de votre navigateur dans lequel est affich le backend et cliquez sur Extensions/Gestion des modules.Le Gestionnaire de modules apparat.8 lintersection de la ligne affichant le nom du module de menu et de la colonne Activ, cliquez sur le symbole dactivation du178 LE GUIDE COMPLETCrer un nouveau menuChapitre 5module an de lactiver (le symbole passe dune croix blanche sur fond rouge une coche verte).Figure 5.23 : Le module est activ depuis le Gestionnaire de modules9 Activez de nouveau longlet de votre navigateur dans lequel est affiche la partie publique du site. Actualisez la page en cliquant sur le bouton dactualisation du navigateur.Cette fois, le nouveau menu est affich. Il ne contient pour linstant aucun item mais vous pourrez y ajouter ceux de votre choix facilement en appliquant le mode opratoire dcrit prcdemment la section Exploiter les diffrents lments de menu.Figure 5.24 : Le nouveau menu est maintenant visible dans le frontendLE GUIDE COMPLET 179Chapitre 5Administrer les menus5.6. Modier les paramtres daffichage dun menuVous allez dcouvrir quelques paramtres signicatifs affectant la prsentation des menus.Appliquer un style au menuComme vous lavez certainement constat, le nouveau menu ne bncie pas dune mise en forme identique celle du menu principal, affich en-dessous. Vous allez remdier cela en lui appliquant un "suffixe de classe CSS", cest--dire une mise en forme enregistre dans la feuille de style rgissant le template actuellement appliqu au site.1 Retournez dans longlet de votre navigateur dans lequel est affich le backend et cliquez sur le nom du menu prcdemment cr, dans le Gestionnaire de modules, an daccder ses paramtres.Figure 5.25 : Un clic sur le nom du menu permet daccder sesparamtres180 LE GUIDE COMPLETModifier les paramtres daffichage dun menuChapitre 5La page Module: [ diter ] est affiche.Figure 5.26 : La page ddition des paramtres du module2 Cliquez sur Paramtres avancs an daccder aux paramtres renferms dans cette rubrique puis saisissez _menu dans la zone Suffixe de classe de module.Figure 5.27 : Lajout dun suffixe de classe de module3 Cliquez sur le bouton Sauver. 4 Basculez dans longlet de votre navigateur dans lequel est affiche la partie publique du site et actualisez la page en cliquant sur le bouton dactualisation du navigateur.La mise en forme applique au nouveau menu est analogue celle applique au menu principal.LE GUIDE COMPLET 181Chapitre 5Administrer les menusFigure 5.28 : La mise en forme applique au nouveau menuModier lordre des menusLe nouveau menu a t insr avant le menu principal. Cet ordre peut ne pas vous convenir. Il est facilement modiable en changeant lordre des modules.1 Dans longlet de votre navigateur dans lequel est affich le backend, cliquez sur Extensions/Gestion des modules. 2 Dans la colonne Ordre du gestionnaire de modules, sur la ligne correspondant au nouveau module, cliquez sur le bouton Dplacer vers le bas, symbolis par une che verte pointant vers le bas.Figure 5.29 : Le bouton Dplacer vers le bas3 Retournez dans longlet de votre navigateur dans lequel est affiche la partie publique du site. Actualisez la page en cliquant sur le bouton dactualisation du navigateur.Le nouveau menu est dsormais affich sous le menu principal.182 LE GUIDE COMPLETModifier les paramtres daffichage dun menuChapitre 5Figure 5.30 : La modication de lordre des menus dans le frontendModier la position du menuLordre dun menu nest pas le seul paramtre interfrant sur son placement dans le site : il vous est galement possible de modier sa position. Les positions sont des emplacements qui dpendent du template utilis. Il est donc utile de consulter les positions disponibles dans le template avant de modier la position dun menu ou dun module.1 Depuis le backend, cliquez sur Extensions/Gestionnaire des templates.Le gestionnaire de templates est affich.2 Dans la colonne Nom du Template, cliquez sur le nom du template appliqu actuellement sur le site (indiqu par une toile jaune affiche dans la colonne Dfaut). Dans cet exemple, cest le template rhuk_milkyway qui est employ.LE GUIDE COMPLET 183Chapitre 5Administrer les menusFigure 5.31 : La slection du template, depuis le Gestionnaire detemplatesLes paramtres du template sont affichs dans la page Template: [ diter ]. Ils sont spciques ce template (dautres templates disposeront dautres paramtres).3Cliquez sur le bouton Prvisualiser.La page Gestion des templates est affiche. Vous pouvez y consulter les positions des modules, indiques en surimpression sur la page (les positions portent des noms tels que left, user1, user2, right, etc.)Figure 5.32 : La page Gestion des templates184 LE GUIDE COMPLETModifier les paramtres daffichage dun menuChapitre 5Dans cet exemple, vous allez placer votre menu vide en position right.4Dans la page de gestion des templates, cliquez sur le bouton Retour.5 De retour dans la page Template: [ diter ], cliquez sur le bouton Fermer. 6 Cliquez sur Extensions/Gestion des modules. 7 Dans la colonne Nom du module du gestionnaire de modules, cliquez sur le nom du nouveau menu.La page Module: [ diter ] est affiche.8 la rubrique Dtails, droulez la liste de la zone Position et choisissez right.Figure 5.33 : Le choix de la position9 Cliquez sur le bouton Appliquer. 10 Basculez dans longlet de votre navigateur dans lequel est affiche la partie publique du site. Actualisez la page en cliquant sur le bouton dactualisation du navigateur.Le menu est dsormais affich dans la partie droite du site.LE GUIDE COMPLET 185Chapitre 5Administrer les menusFigure 5.34 : Laffichage du menu en position rightModier le style du menuEn fonction des positions et des spcicits du template, il est galement possible de modier le style du menu (transformer un menu vertical en un menu horizontal par exemple), au moyen des choix proposs dans la zone Style du menu.Figure 5.35 : Les choix proposs dans la zone Style du menu permettent de modier le style du menu, en fonction des options du template186 LE GUIDE COMPLETCheck-listChapitre 5Limiter laffichage du menu certaines parties du siteIl nest pas obligatoire dafficher le menu dans toutes les pages du site. Vous pouvez ainsi choisir de faire apparatre uniquement un menu spcique sur certaines parties de votre site. Indiquez pour cela votre choix la rubrique Affectation de menu : cochez loption Slectionner le(les) lment(s) de menu depuis la liste dans la zone Slectionner un menu puis indiquez, dans cette dernire, les menus sous lesquels doit apparatre votre menu spcique.Figure 5.36 : La rubrique Affectation de menu5.7. Check-listj j jIl est possible de crer facilement des menus de navigation personnalisables an dafficher les articles du site. Un item de menu peut pointer vers de trs nombreux modules daffichage de contenus ou lancer des fonctionnalits avances. La position et laspect des menus peuvent tre moduls volont.LE GUIDE COMPLET 187Utiliser les fonctionnalits natives de JoomlaGrer les mdias ................................................................................................................ 190 Grer les niveaux daccs et les utilisateurs ............................................................... 198 Utiliser la messagerie de Joomla ................................................................................... 210 Utiliser la newsletter .......................................................................................................... 213 Effectuer une mise jour de Joomla ............................................................................ 214 Check-list ............................................................................................................................. 216Chapitre 6Utiliser les fonctionnalits natives de JoomlaDans cette section, vous dcouvrirez en dtail lutilisation des autres fonctionnalits principales de Joomla.6.1. Grer les mdiasSous Joomla, le terme mdia dsigne essentiellement les images, bien quil vous soit possible dutiliser des chiers dautres types, tels que les chiers PDF. Voici donc quelques consignes utiles concernant la cration des images et leur utilisation.Les formats dimagesVous trouverez ci-aprs une description succincte des principaux formats dimages destins tre utiliss sur Internet.Le format GIFLes principales caractristiques de ce format sont les suivantes :j j jjIl utilise 256 nuances de couleurs au maximum (il est possible de travailler en couleurs scurises pour le Web). Cest le format le plus utilis pour les lments graphiques de navigation sur les sites web (boutons, puces, etc.). Il autorise la gestion de la transparence. Il est alors possible de confrer limage un aspect autre que rectangulaire, puisque le fond de la page (couleur ou image) apparat dans les zones de transparence, ce qui nest pas le cas avec une image reprsentant un sujet sur un fond blanc ou dune autre couleur (le sujet est affich dans un rectangle dune couleur diffrente de celle du fond de la page, ce qui donne une connotation de travail inachev et amateur au site). Il permet la gestion danimations ("gifs anims") par un enchanement de plusieurs images dans un mme chier. Le poids de ce dernier peut alors tre considrablement augment. Bien quencore couramment employ, les webmestres lui prfrent de plus en plus souvent la technologie Flash (qui offre des possibilits danimations bien suprieures).190 LE GUIDE COMPLETGrer les mdiasChapitre 6Origine du mot GIFGIF signie Graphics Interchange Format.Le format JPG (ou JPEG)Les principales caractristiques de ce format sont les suivantes :j j jIl utilise 16 millions de couleurs environ. Cest le format le plus souvent employ pour laffichage des photographies. Il utilise un algorithme de compression destructive, cest--dire que la diminution du poids du chier se fait au dtriment de la qualit de limage (une diminution du poids du chier entrane une diminution de la qualit).Origine du mot JPEGJPEG signie Joint Photographic Experts Group.Le format PNGLes principales caractristiques de ce format sont les suivantes :j j j jIl est compress mais non destructeur. Il gre la transparence et la translucidit. Il est utile pour lenregistrement des images renfermant des aplats de couleurs (boutons, icnes, graphiques, etc.). Concernant les photographies, en revanche, le poids des chiers est suprieur celui des chiers JPG, en 16 millions de couleurs.Origine du mot PNGPNG signie Portable Network Graphics.Technologie FlashLes principales caractristiques de ce format sont les suivantes :LE GUIDE COMPLET 191Chapitre 6jUtiliser les fonctionnalits natives de Joomlaj j jjCest un format propritaire (Flash a t initialement dvelopp par Macromedia, socit cratrice de Dreamweaver, aujourdhui rachete par Adobe). Les chiers Flash utilisent lextension .SWF ; le format des animations prtes lemploi. Les chiers sources portent lextension .FLA, non utilisable sur le Web. Pour dcoder un chier SWF, le navigateur doit tre quip de Flash Player (module complmentaire, tlchargeable gratuitement sur le Web). degrs danimations gaux, les chiers Flash sont beaucoup plus lgers que les chiers GIF et permettent de crer de linteractivit.Optimiser et retoucher les images pour InternetUtiliser des images directement sorties de lappareil numrique nest pas une solution envisageable : recadrage, diminution du poids, amliorations des couleurs, des contrastes et des niveaux sont quelques exemples signicatifs des traitements indispensables, si vous souhaitez donner de la valeur ajoute aux textes qui composent vos pages. Les logiciels de retouches photographiques vous permettent tous ces traitements.Choisir le logiciel de traitement dimageIl existe de nombreux logiciels de ce type ; la plupart sont tlchargeables sur le web. Certains sont gratuits, dautres, les plus puissants, payants.PhotoshopPhotoshop est le logiciel de rfrence en matire de retouches photographiques. Il est produit par la socit Adobe. Il est employ par tous les professionnels de limage et les amateurs avertis.192 LE GUIDE COMPLETGrer les mdiasChapitre 6Photoshop ElementsPhotoshop Elements est une version simplie de Photoshop. Il permet nanmoins de raliser toutes les oprations courantes de traitement dimages.Paint Shop ProPaint Shop Pro est un logiciel presque aussi puissant que Photoshop. Il convient parfaitement dans les domaines de la cration graphique et de la ralisation danimations web.PicasaPicasa est un programme que vous pouvez tlcharger gratuitement sur le site Internet de Google. Il vous permet de retoucher vos images et de classer celles-ci sur votre ordinateur. Vous pouvez le tlcharger ladresse suivante : http://picasa.google.fr /download/index.html.Photoshop Album Starter EditionSi vos besoins, en matire de traitement de photographies, ne sont pas ceux dun infographiste professionnel, Photoshop Album Starter Edition est un logiciel gratuit et simple qui peut vous convenir. Il permet de visionner, rechercher, retoucher et partager des images. Bien entendu, vous ny retrouverez pas les innombrables fonctionnalits offertes par Photoshop mais le programme est suffisant pour raliser les actions de base en matire de traitement de limage numrique. Vous pouvez le tlcharger ladresse suivante : http://www.adobe.com/fr /products/photoshopalbum/starter.html.Photoshop ExpressSi vous ne souhaitez (ou ne pouvez) pas installer de logiciel de traitement dimages, rien ne vous empche dutiliser le nouveau service gratuit de retouche en ligne ouvert par Adobe, ladresse https://www .photoshop.com/express/landing.html, nomm Photoshop Express. Les fonctionnalits notables offertes par ce service sont :LE GUIDE COMPLET 193Chapitre 6j jUtiliser les fonctionnalits natives de Joomlala gestion des albums photo et de vos chiers stocks sur dautres services tels que Facebook ou Picasa ; un espace dhbergement de photographies ou de gestion de diaporamas, accessible depuis un navigateur Internet.GimpGIMP est un logiciel libre et gratuit de traitement dimages trs complet, offrant des traitements proches de ceux de Photoshop. Vous pouvez le tlcharger ladresse suivante : http://www.gimpfr.org /news.php.Joomla et les imagesAn dconomiser votre bande passante et de rendre la navigation la plus rapide possible sur votre site, trouvez le meilleur compromis entre le poids du chier image (en octets) et sa qualit daffichage lcran. Pour ce faire, effectuez plusieurs enregistrement de votre image (le plus souvent au format JPG) en zoomant sur celle-ci (la perte de qualit sera alors visible) puis en revenant un facteur de zoom de 100 %. Si la dgradation nest pas visible, refaites un nouvel essai en zoomant et en appliquant un taux de compression suprieur, an de diminuer encore la taille du chier. Certains logiciels permettent deffectuer une simulation entre limage dorigine et celle qui sera enregistre, aprs compression. La visualisation des deux images cte cte vous permet alors dapprcier avec prcision la dgradation lie la compression.Figure 6.1 : Limage de droite, en mode Prvisualisation depuis Photoshop, prsente une trs forte dgradation, due une compression excessive de limage, au format JPG, par rapport limage originelle, gauchevitez galement les largeurs dimages excessives, sous peine de problmes daffichage avec certains templates (testez toujours le rsultat194 LE GUIDE COMPLETGrer les mdiasChapitre 6obtenu dans le frontend, aprs linsertion dune image de taille importante dans un article).Le Gestionnaire de mdiasVous avez dj dcouvert, lors de la cration dun article, quil vous tait possible de tlcharger sur lespace dhbergement du site une image manquante et devant tre insre dans larticle (au moyen de la fentre ouverte lorsque le bouton Image est cliqu). Joomla vous offre une seconde mthode de tlchargement des images et, dune manire gnrale, de tous les mdias : le Gestionnaire de mdias. Procdez ainsi :1 Cliquez sur Site/Gestion des mdias.Le Gestionnaire de mdias est affich.Figure 6.2 : Le gestionnaire de mdiasIl prsente de nombreuses fonctionnalits dadministration des chiers tlchargs et des dossiers qui les renferment, sur le serveur hbergeant Joomla.LE GUIDE COMPLET 195Chapitre 6Utiliser les fonctionnalits natives de JoomlaLonglet Miniatures, activ par dfaut, permet deffectuer les oprations courantes sur les chiers :jjjjLes dplacements dans les dossiers sont raliss par de simples clics sur les icnes de la rubrique Dossiers ou sur celles de la rubrique Fichiers. La cration de dossiers est effectue au moyen du bouton Crer un dossier (aprs avoir saisi le nom du dossier crer dans la zone place gauche du bouton). Le transfert dun chier seffectue avec le bouton Parcourir, qui permet dindiquer au CMS lemplacement du chier sur votre ordinateur. Cliquez ensuite sur le bouton Lancer le transfert. La visualisation dune image en taille relle seffectue par un clic sur la miniature, dans longlet Miniatures. Limage apparat alors dans une fentre en surimpression (vous pouvez fermer cette dernire par un clic sur la croix affiche en haut et droite de la fentre).Figure 6.3 : La visualisation dune image en taille relle seffectue dans une fentre affiche en surimpression jLa suppression dune image est ralise par un clic sur le bouton de suppression, symbolis par une croix blanche sur rond rouge, plac ct de la miniature de limage.196 LE GUIDE COMPLETGrer les mdiasChapitre 6Dossier racine de stockage des imagesEn parcourant les dossiers dinstallation du systme, sur votre serveur web local, vous dcouvrirez que le dossier renfermant les mdias et se trouvant la racine du site se nomme Images.Figure 6.4 : Les sous-dossiers du dossier ImagesIl renferme nativement les sous-dossiers banners, M_images, smilies, stories. Ce dernier dossier est le dossier propos par dfaut pour le stockage des images de vos articles. Si le nombre dimages est important, il est conseill de crer des sous-dossiers, sous le rpertoire Images, an doptimiser le classement des chiers.2 Cliquez sur longlet Dtails du Gestionnaire de mdias.Figure 6.5 : Longlet Dtails du Gestionnaire de mdiasLE GUIDE COMPLET 197Chapitre 6Utiliser les fonctionnalits natives de JoomlaCet onglet permet deffectuer les mmes oprations sur les chiers et les dossiers que le prcdent en affichant des informations complmentaires, telles que les dimensions des chiers, exprimes en pixels.Transfert des chiers mdias en FTPSi le nombre de chiers transfrer est important, vous pouvez galement placer tous les chiers prpars sur votre ordinateur en une seule opration dans le bon dossier en utilisant votre logiciel de transfert FTP, si le site est plac chez un hbergeur distant, ou lExplorateur de chiers de Windows, si le site est en place sur votre serveur local.Ouverture dun chier au format PDFPour ouvrir un chier au format PDF (ou dun autre format, non affichable directement dans une page HTML), depuis un article, placez le chier dans le dossier de votre choix, depuis le Gestionnaire de mdias, puis crez un lien hypertexte relatif (du type images/stories /nomdufichier.pdf) dans larticle, pointant vers le chier.6.2. Grer les niveaux daccs et les utilisateursJoomla permet de crer des niveaux hirarchiques, dnissant des droits dadministration plus ou moins tendus, entre les administrateurs du site. En outre, certaines parties du site peuvent tre rendues accessibles uniquement aux internautes enregistrs. Ces fonctionnalits font de Joomla un puissant outil collaboratif, permettant, par exemple, de construire un vritable journal en ligne, dans lequel les tches ditoriales sont rparties et hirarchises entre de nombreux participants.Comprendre les niveaux daccsDroits daccs et indexationSi la fonctionnalit permettant de limiter laccs certaines pages du site peut se rvler une technique de collecte dadresses email, an198 LE GUIDE COMPLETGrer les niveaux daccs et les utilisateursChapitre 6denvoyer rgulirement votre newsletter aux visiteurs enregistrs, elle peut galement tre un obstacle votre indexation dans les moteurs de recherche. Ceux-ci ne disposant pas de droit daccs aux pages rserves, ils ne pourront pas en effectuer lindexation dans leurs bases de donnes. Choisissez donc avec soin les pages publiques et les pages prives.Les niveaux daccs proposs par Joomla sont les suivants :j Public.jCe niveau daccs, affect par dfaut aux composants du site, donne accs tous les visiteurs, quils soient enregistrs ou non. Enregistr. Ce niveau, lorsquil est affect certaines parties du site, donne accs aux visiteurs enregistrs.Utilisateurs enregistrsLes visiteurs du site peuvent accder au statut Enregistr au moyen du formulaire didentication et dinscription, activ par dfaut lors de limplmentation du systme.Figure 6.6 : Le formulaire didentication j Spcial.Ce niveau donne accs aux parties du site concernes uniquement aux administrateurs du site.LE GUIDE COMPLET 199Chapitre 6Utiliser les fonctionnalits natives de JoomlaLes groupes dutilisateursLes groupes dutilisateurs du site quil vous est possible daffecter aux collaborateurs de votre quipe rdactionnelle sont les suivants : j Public. Ce niveau est celui des simples visiteurs du site. Il ne donne aucun droit dadministration sur le contenu rdactionnel et laccs aux parties rserves aux utilisateurs enregistrs lui est ferm. j Enregistr. Ce niveau ne donne aucun droit dadministration sur le contenu rdactionnel mais laccs aux parties rserves aux utilisateurs enregistrs lui est ouvert. j Auteur. Ce niveau permet lutilisateur du systme de proposer des articles et, le cas chant, de les modier. j Editeur. Ce niveau dispose des mmes droits que le prcdent. Il permet, en outre, la modication dun article dun autre auteur. j Rdacteur. Ce niveau dispose des mmes droits que le prcdent. Il permet, en outre, la validation de la publication dun article. j Gestionnaire. Ce niveau dispose des mmes droits que le prcdent. Il permet, en outre, la modication des menus de navigation sur le site. la diffrence des utilisateurs disposant des niveaux hirarchiques prcdents, les membres de ce niveau (et ceux appartenant aux niveaux hirarchiques suprieurs) accdent linterface dadministration par la mme URL que celle employe par le super administrateur (adresse du type : http://www.lenomdusite.fr/administrator). j Admin. Ce niveau dispose des mmes droits que le prcdent. Il permet, en outre, la modication des extensions et la gestion des comptes sur le site. j SuperAdmin. Ce niveau dispose de tous les droits dadministration sur le site.Grer les niveaux daccsCliquez sur Site/Gestionnaire des utilisateurs. Le Gestionnaire des utilisateurs est affich. Les paramtres dun utilisateur sont affichs en lignes. Sur chacun dentre eux, sont prsents :j j jle nom de lutilisateur ; lidentiant de lutilisateur ; ltat de connexion de lutilisateur (indiquant sil est actuellement connect ou non) ;200 LE GUIDE COMPLETGrer les niveaux daccs et les utilisateursj j j j jChapitre 6ltat dactivation du compte (indiquant si le compte est activ ou non) ; le groupe auquel appartient lutilisateur (indiquant son niveau daccs) ; ladresse email de lutilisateur ; la date de dernire visite de lutilisateur ; lidentiant unique de lutilisateur, dans la base de donnes utilise par le CMS.Figure 6.7 : Le Gestionnaire des utilisateursExercice pratique : Cration dun compte de niveau Auteur titre dexemple, vous allez crer, dans ce qui suit, un nouveau compte pour un utilisateur imaginaire disposant du statut dauteur. Vous dcouvrirez alors linterface de soumission darticles mise sa disposition. Bien que vous puissiez effectuer sans soucis cette opration sur le serveur local de votre ordinateur, nous vous conseillons, si votre site est galement publi chez un hbergeur, deffectuer cet exercice chez ce dernier ; vous disposerez alors dun serveur dadressage de mails. Vous viterez ainsi un message de Joomla indiquant quil ne peut implmenter la fonction de routage de mails (sauf si vous avez install un serveur de mails sur votre ordinateur, opration techniquement assez complexe). Vous pourrez en outre, dans la section suivante, tester la fonctionnalit dadressage de newsletter avec le compte qui va tre maintenant cr.LE GUIDE COMPLET 201Chapitre 6Utiliser les fonctionnalits natives de Joomla1 Dans le Gestionnaire des utilisateurs, cliquez sur le bouton Nouveau.La page Utilisateur: [ Nouveau ] apparat.2 la rubrique Dtails de lutilisateur, dans la zone Nom, saisissez le nom de lutilisateur. 3 Dans la zone Identifiant, saisissez lidentiant quil devra utiliser pour se connecter. 4 Dans la zone Email, saisissez ladresse de courrier lectronique de lutilisateur. 5 Dans la zone Nouveau mot de passe, saisissez le mot de passe de lutilisateur. 6 Dans la zone Confirmer le mot de passe, saisissez une nouvelle fois le mot de passe de lutilisateur. 7 Dans la liste de la zone Groupe, affectez lutilisateur le niveau Auteur. 8 Dans zone doptions Recevoir les emails systme, cochez loption Oui (ce paramtre vous permettra deffectuer un test de bon fonctionnement de la messagerie de Joomla, dcrite dans la section suivante de ce livre).Figure 6.8 : La rubrique Dtails de lutilisateur202 LE GUIDE COMPLETGrer les niveaux daccs et les utilisateursChapitre 69 la rubrique Paramtres, dans la zone Langue de linterface dadministration, choisissez French (FR). 10 Dans la zone Langue de linterface publique, choisissez French (Fr). 11 Dans la zone diteur de lutilisateur, choisissez Editor TinyMCE 2.0. 12 Dans la zone Fuseau horaire, choisissez (UTC +01:00) HeuredEurope Centrale, Amsterdam, Berlin, Bruxelles, Copenhague, Madrid, Paris (ou le fuseau horairecorrespondant au lieu gographique de lutilisateur, si ce dernier ne rside pas en France). 13 Cliquez sur le bouton Sauver. De retour dans le Gestionnaire des utilisateurs, le nouvel utilisateur est maintenant ajout la liste des utilisateurs.Figure 6.9 : Le nouvel utilisateur apparat dsormais dans la liste des utilisateurs du Gestionnaire des utilisateursConrmation de linscription par mailLors de la cration du compte, le nouvel utilisateur reoit un courrier lectronique qui lui est automatiquement adress par Joomla. Ce mail prsente la forme suivante :Bonjour XXX, Vous avez t inscrit comme utilisateur de XXX par un administrateur. Cet email contient votre identifiant ainsi que votre mot de passe pour vous connecter http://www.nomdedomaine.fr/LE GUIDE COMPLET 203Chapitre 6Utiliser les fonctionnalits natives de Joomla Identifiant : XXX Mot de passe : XXX Ce message est gnr automatiquement pour votre information. Merci de ne pas y rpondre.Vous allez tester linterface mise la disposition de votre nouvel auteur, depuis le frontend. Avant cela, vous devrez ajouter un accs cette interface, depuis lun des menus du site.14 Cliquez sur Menu/Main Menu.La page Gestionnaire dlment de menu: [mainmenu] apparat.15 Cliquez sur le bouton Nouveau.La page Alias de menu: [ Nouveau ] apparat.16 Cliquez sur Articles puis sur Proposition darticle.Figure 6.10 : Un nouvel item, permettant laccs lditeur darticles, va tre ajout au menu principalLa page Alias de menu: [ Nouveau ] apparat.204 LE GUIDE COMPLETGrer les niveaux daccs et les utilisateursChapitre 617 Dans la zone Titre, saisissez par exemple Soumettre un article. 18 Cliquez sur le bouton Sauver.Changer le titre du menu principalSi vous souhaitez franciser le titre du menu principal (pour linstant, Main Menu), effectuez lopration suivante : cliquez sur Extensions/Gestion des modules puis sur Main Menu, dans la liste des modules qui apparat dans le gestionnaire de modules. Changez le libell Main Menu de la zone Titre en Menu principal. Cliquez sur le bouton Sauver.Vous allez, dans un premier essai, vrier que laccs lditeur darticles ne sera pas autoris un utilisateur non authenti.19 Activez longlet de votre navigateur dans lequel est affich le frontend puis actualisez la page en cliquant sur le bouton dactualisation du navigateur.Le nouvel item est affich dans le menu.Figure 6.11 : Le nouvel item apparat dans le menu du frontend20 Cliquez sur le nouvel item du menu principal, affichant Soumettre un article.LE GUIDE COMPLET 205Chapitre 6Utiliser les fonctionnalits natives de JoomlaVous essuyez alors un refus svre de la part de Joomla : la mention Vous ntes pas autoris accder cette ressource est en effet affiche dans la page qui apparat.Figure 6.12 : Laccs la page vous est interditVous allez maintenant effectuer la mme tentative, aprs identication.Changer le nom du lien menant la page daccueilSi vous souhaitez franciser le lien ramenant la page daccueil de votre site, depuis le menu principal (portant jusquici le nom Home), effectuez lopration suivante, depuis le backend : cliquez sur Menus/Main Menu puis sur Home, dans la liste des items de menu qui apparat dans le Gestionnaire dlments de menu. Changez le libell Home de la zone Titre, par exemple, en Accueil. Cliquez sur le bouton Sauver.21 Cliquez sur litem du menu principal affichant Accueil (ou Home, selon que vous avez ou non renomm cet item de menu).Changer le titre du formulaire didenticationSi vous souhaitez franciser le titre du formulaire didentication (portant, pour linstant, le titre Login Form), effectuez lopration suivante : cliquez sur Extensions/Gestion des modules puis sur Login Form, dans la liste des modules qui apparat dans le Gestionnaire de modules. Changez le libell Login Form de la zone Titre en Identifiezvous, par exemple. Cliquez sur le bouton Sauver.206 LE GUIDE COMPLETGrer les niveaux daccs et les utilisateursChapitre 622 Sur la page daccueil, sous le menu principal, est affich le formulaire didentication, dans la partie gauche de la page. Saisissez-y lidentiant de lauteur prcdemment cr dans la zone Identifiant et tapez son mot de passe dans la zone Mot de passe. Cliquez sur le bouton Connexion.Figure 6.13 : Lidentication dun utilisateur depuis le frontendLes zones Identifiant, Mot de passe ainsi que le bouton Connexion sont masqus et un message de bienvenue est affich lintention de lutilisateur. En outre, un bouton de dconnexion apparat. Il permet lutilisateur de se dconnecter, sil le souhaite (voir Figure 6.14).23 Ritrez votre clic sur le lien Soumettre un article.La page Soumettre un article est affiche. Elle renferme les composants suivants :jun diteur darticle, ncessaire la rdaction de ce dernier, et identique celui que vous avez dj utilis dans le backend ; (voir Figure 6.15)LE GUIDE COMPLET 207Chapitre 6Utiliser les fonctionnalits natives de JoomlaFigure 6.14 : Un message de bienvenue indique lutilisateur quil est dsormais connectFigure 6.15 : Lditeur darticle, mis la disposition du rdacteur, depuis lefrontendjune rubrique Publication, permettant lauteur de dnir les paramtres suivants : section, catgorie, affichage sur la page daccueil, pseudo de lauteur, date de dbut de publication, date de n de publication, niveau daccs ;Figure 6.16 : La rubrique Publication208 LE GUIDE COMPLETGrer les niveaux daccs et les utilisateursjChapitre 6une rubrique Mtadonnes permettant lauteur de dnir les paramtres suivants : description et mots-cls.Figure 6.17 : La rubrique Mtadonnes24 Saisissez un court article dessai puis cliquez sur le bouton Sauvegarder.La page daccueil est de nouveau affiche, avec la mention Merci de votre soumission. Votre proposition sera maintenant examine avant dtre publie sur le site, lattention de lauteur. Vous allez maintenant dcouvrir comment un administrateur du site va pouvoir accepter ou refuser larticle.Figure 6.18 : La mention affiche sur la page daccueil25 Activez longlet de votre navigateur dans lequel est affich le backend puis cliquez sur Contenu/Gestion des articles.Le Gestionnaire darticles est affich.26 Cliquez sur len-tte de colonne Date, an de classer les articles selon ce critre.LE GUIDE COMPLET 209Chapitre 6Utiliser les fonctionnalits natives de JoomlaLes articles sont dsormais classs par dates de cration et le nouvel article est affich en premier. Il nest pas publi car cette tche vous incombe, aprs vrication du contenu rdactionnel de larticle propos par lauteur.6.3. Utiliser la messagerie de JoomlaSi plusieurs personnes collaborent la rdaction du site, la fonctionnalit de messagerie interne de Joomla peut se rvler un outil de communication trs utile, vitant aux collaborateurs ladressage traditionnel de mails et dlivrant chacun ses message ds son arrive sur le backend (la messagerie est rserve aux personnes ayant accs la partie prive de Joomla). Vous allez dcouvrir cette fonctionnalit dans la manipulation qui suit.1 Cliquez sur Site/Gestionnaire des utilisateurs.Le gestionnaire des utilisateurs apparat.2 Cliquez sur le nom de lutilisateur, cr la section prcdente, et disposant du statut dauteur. 3 la rubrique Dtails de lutilisateur, dans la liste Groupe, affectez lutilisateur le statut de gestionnaire. Vriez que loption Recevoir les emails systme est coche sur Oui. Cliquez sur le bouton Sauver.Figure 6.19 : La modication du statut de lutilisateur et lactivation de la rception des emails du systme210 LE GUIDE COMPLETUtiliser la messagerie de JoomlaChapitre 6Consulter les messages1 Activez le menu Outils/Lire les messages.La page Message priv, qui est alors affiche, prsente la liste les messages reus. La colonne Lu permet de visualiser les messages lus (indiqus par une coche verte) et ceux qui ne lont pas t (indiqus par une croix blanche sur fond rouge). Un clic sur len-tte de cette colonne vous permet de trier les messages. La liste Slectionner un tat permet de ltrer les messages lus et non lus. Un message est considr comme lu aprs quil ait t ouvert par un clic sur le libell de son sujet.Figure 6.20 : La liste des messages reus2 Cliquez sur le libell de lun des sujets des messages pour consulter le contenu du message concern.Le dtail du message saffiche dans la page Voir le message priv. Il est possible dy rpondre en utilisant le bouton Rponse.La conguration des paramtres privsDans la page Message priv, cliquez sur le bouton Paramtres pour accder la conguration des messages privs. Dans la page Configuration des messages privs qui saffiche, il vous est possible de verrouiller la bote de rception (si loption Oui est choisie, la bote ne reoit plus de messages), dopter pour la rception demails davertissement lorsque de nouveaux messages sont reus, de dnir le nombre de jours au-del duquel les messages sont supprims.LE GUIDE COMPLET 211Chapitre 6Utiliser les fonctionnalits natives de JoomlaFigure 6.21 : La conguration de la rception des emails du systmeSupprimer un messageDepuis la page Message priv, cochez la case gauche du sujet du message puis cliquez sur le bouton Supprimer. La suppression est galement possible depuis la page de dtail du message en utilisant le bouton Supprimer.crire un message1 Activez le menu Outils/Ecrire un message ou cliquez sur le bouton Nouveau de la page Message priv. 2 Dans la liste droulante de la zone A, choisissez un utilisateur. 3 Saisissez lobjet du message dans la zone Sujet puis le contenu du message dans la zone Message. Cliquez sur le bouton Envoyer.Figure 6.22 : La saisie dun messageDepuis linterface dadministration, lutilisateur, qui est envoy le message, visualise une enveloppe en haut droite de sa fentre. Un clic sur cette enveloppe permet daccder automatiquement la liste des messages dans la page Message Priv.212 LE GUIDE COMPLETUtiliser la newsletterChapitre 6Figure 6.23 : La rception de nouveaux messages6.4. Utiliser la newsletterLa fonctionnalit vous permet dadresser en nombre un mme courrier lectronique des utilisateurs :1 Activez le menu Outils/Envoi demail en nombre.La page Envoi massif de-mail est affiche.2 Dans la liste Groupe, cliquez sur le groupe dutilisateurs auquel est destin le mail. Par dfaut, lemail sera envoy tous les groupes dutilisateurs. 3 La case cocher E-mail aux sous-groupes permet de prciser si les sous-groupes du groupe dutilisateurs choisi prcdemment recevront galement lemail. 4 La case Envoyer en HTML permet dinsrer des balises HTML dans le corps du message. 5 La case Destinataires en copie cache (Cci) permet de masquer au destinataire lensemble des destinataires du message (le destinataire voit uniquement sa propre adresse email).Les ltres anti-spam des hbergeursAn dviter le spamming, de nombreux hbergeurs nautorisent pas lenvoi dun nombre illimit de courriers lectroniques. Ceci peut donc empcher le droulement du traitement si le nombre de destinataires est trop important.Figure 6.24 : La page Envoi massif de-mailLE GUIDE COMPLET 213Chapitre 6Utiliser les fonctionnalits natives de JoomlaAjouter un en-tte et une signatureIl est possible dajouter un texte den-tte et un autre de signature tous les messages. Depuis la page Envoi massif de-mail, cliquez pour ce faire sur le bouton Paramtres. Dans la fentre qui apparat en surimpression, renseignez la zone Prfixe du sujet (elle apparatra avant le contenu du message) et la zone Suffixe du corps du message (elle apparatra aprs le texte du message).Figure 6.25 : La fentre de rdaction du prxe et du suffixe6.5. Effectuer une mise jour de JoomlaDe nouvelles versions de Joomla sont rgulirement publies. Il est conseill deffectuer souvent la mise jour du systme ; les nouvelles versions apportant des correctifs de scurit. Ces mises jour seffectuent dautant plus facilement quelle sont ralises au moyen dun installateur quil vous suffit de tlcharger et dexcuter.1 La version de Joomla que vous utilisez est affiche en haut droite de la fentre du backend. Vous pouvez galement la connatre en activant le menu Aide/Infos systme : la version du CMS est indique la ligne Version de Joomla!.Figure 6.26 : La consultation de la version de Joomla depuis la page Informations, affiche par le menu Aide/Infos systme214 LE GUIDE COMPLETEffectuer une mise jour de JoomlaChapitre 62 Pour tlcharger la mise jour, lancez votre navigateur Internet puis connectez-vous au site http://www.joomla.fr. 3 Cliquez sur le bouton Tlcharger Joomla 1.5.XX accessible depuis nimporte quelle page du site ou sur longlet Aide puis le menu Tlchargements depuis le menu principal et ensuite sur le lien Patches de mise jour Joomla! 1.5.x.Figure 6.27 : Le lien de tlchargement de mise jour4 En fonction de la version de votre site Joomla, cliquez sur le bouton Tlcharger dun des patchs. 5 Dzippez le patch tlcharg.Figure 6.28 : Le contenu du dossier de larchive du patch de mise jourLtape suivante doit tre ralise aprs avoir effectu une sauvegarde de scurit du systme en place.6 laide dun logiciel de transfert FTP tel que Filezilla, copiez le contenu du dossier de larchive dzippe dans la racine du serveur du site Joomla. Conrmez le remplacement pour tous les chiers.La nouvelle version du site est alors affiche depuis ladministration.LE GUIDE COMPLET 215Chapitre 6Utiliser les fonctionnalits natives de Joomla6.6. Check-listjj jj jLes images doivent tre prpares avant leur utilisation. De nombreux logiciels, gratuits ou payants, permettent deffectuer ce traitement. Joomla permet de dnir plusieurs niveaux daccs, pour un travail collaboratif hirarchis. Le systme dispose dune messagerie interne, facilitant les changes entre les collaborateurs travaillant la mise jour du site. Joomla dispose galement dune fonction dadressage de mailing list, autorisant lenvoi en nombre de courriers lectroniques. Des mises jour du systme sont rgulirement mises en ligne. Aprs tlchargement, elles sont rapides mettre en uvre.216 LE GUIDE COMPLETAdapter le site avec des composantsInstaller un composant ..................................................................................................... 219 Faciliter la rdaction des pages avec lditeur JCE .................................................. 219 Grer un site multilingue avec le composant Joom!Fish ......................................... 225 Grer des documents avec DOCman ........................................................................... 240 Grer des utilisateurs avec Community Builder ......................................................... 243 Grer une galerie de photos Phoca Gallery ................................................................ 243 Grer des newsletters avec Communicator ................................................................ 244 Grer des groupes avec GMAccess ............................................................................. 245 Installer de nouveaux templates .................................................................................... 246 Check-list ............................................................................................................................. 254Chapitre 7Adapter le site avec des composantsJoomla renferme nativement, vous lavez dcouvert, de nombreuses et puissantes fonctionnalits auxquelles il vous est possible davoir recours via les modules et plugins prsents dans le systme. Toutefois, il se peut que vous ayez besoin dautres traitements complmentaires, initialement non intgrs dans le CMS. Latout majeur de Joomla est alors la possibilit de tlcharger et dimplmenter facilement des composants spciques. Vous allez en dcouvrir quelques-uns ci-aprs et pourrez en tlcharger dautres sur le Web, en fonction de vos besoins.O trouver des composants ?De nombreux dveloppeurs proposent leurs composants sur le Web. Toutefois, nous vous conseillons de commencer votre exploration depuis le site officiel francophone de Joomla, ladresse http://www.joomlafrance .org.Cliquez pour cela sur longlet Extensions, sur Tlcharger puis sur Extensions pour Joomla 1.5. Les extensions pour Joomla sont prsentes par catgories.Figure 7.1 : Les extensions sont classes par catgoriesEn outre, de nombreuses extensions sont proposes sur le site officiel de Joomla, ladresse http://extensions.joomla.org/extensions.218 LE GUIDE COMPLETFaciliter la rdaction des pages avec lditeur JCEChapitre 77.1. Installer un composantVoici la mthode gnrique dinstallation dun composant, aprs que ce dernier a t tlcharg sur le disque dur de votre ordinateur.1 Depuis ladministration de Joomla, cliquez sur le menu administrateur Extensions/Installer/Dsinstaller. 2 Dans la page Gestion des extensions, cliquez sur le bouton Parcourir de la rubrique Archive transfrer. 3 Depuis la bote de dialogue Envoi du fichier, slectionnez larchive du composant puis cliquez sur le bouton Ouvrir. 4 De retour dans la page Gestion des extensions, cliquez sur le bouton Transfert de fichier & Installation.Dsinstaller un composantDans la page Gestion des extensions, cliquez sur longlet Composants, cochez loption gauche du nom du composant puis cliquez sur le bouton Dsinstaller.Figure 7.2 : La dsinstallation dun composantVous allez dcouvrir, ci-aprs, quelques composants signicatifs.7.2. Faciliter la rdaction des pages avec lditeur JCETinyMCE est lditeur darticles implment par dfaut avec Joomla. Cest avec lui que vous avez, jusqualors, crit vos articles ou dautres contenus rdactionnels, tels que les descriptions des sections et des catgories.LE GUIDE COMPLET 219Chapitre 7Adapter le site avec des composantsJCE est un diteur alternatif, largement plbiscit par de nombreux utilisateurs de Joomla. Nous vous proposons de dcouvrir comment linstaller et de parcourir les possibilits quil vous offre.Installer lditeur JCE1 Tlchargez le chier zip du composant dadministration et le plugin associ. Pour cela, connectez-vous au site http://www .joomlafrance.org puis cliquez sur longlet Extensions. Dans le menu de gauche, cliquez sur Tlcharger.La page Gestionnaire de fichiers est affiche.2 Cliquez sur la catgorie Extensions pour Joomla 1.5 puis sur J1.5 Editeur HTML. Cliquez sur J1.5JCE Pack Editeur JCE 1.5 FR-EN puis sur Tlcharger.La page affiche vous donne un descriptif prcis du contenu de larchive.Figure 7.3 : Le tlchargement de lditeur JCE depuis le site http://www.joomlafrance.org3 Enregistrez le chier zip dans un dossier sur votre ordinateur.220 LE GUIDE COMPLETFaciliter la rdaction des pages avec lditeur JCEChapitre 7Le site officiel de lditeur JCELadresse Internet de lditeur JCE est http://www.joomlacontenteditor.net.4 Dcompressez le chier archive tlcharg prcdemment (Pack_JCE15_Stable_FR-EN.zip). 5 Depuis ladministration de Joomla, activez le menu Extension puis Installer/Dsinstaller pour afficher la page Gestion des extensions. 6 Installez le composant dadministration, com_jce_15X_FR-EN.zip, depuis la rubrique Archive transfrer de longlet Installation.Figure 7.4 : Linstallation du composant dadministration de lditeurJCEFigure 7.5 : Linstallation du composant dadministration de lditeur JCE sest droule correctementLE GUIDE COMPLET 221Chapitre 7Adapter le site avec des composants7 Aprs le message indiquant le succs de linstallation du composant, cliquez sur longlet Installation de la page Gestion des extensions. Procdez linstallation du plugin de lditeur plg_jce_15X_FR-EN.zip.Figure 7.6 : Linstallation du plugin dadministration de lditeur JCEInstaller manuellement le plugin de lditeur JCE EditorCertains hbergeurs limitant le temps dexcution des scripts, il se peut que vous rencontriez un problme, lors de linstallation du plugin. Effectuez alors une installation manuelle : aprs linstallation du composant de lditeur depuis ladministration de Joomla, dcompressez le chier archive du plugin JCE, plg_jce_15X_FR-EN.zip.Figure 7.7 : Le contenu du dossier du plugin plg_jce_15X_FR-ENTransfrez le contenu du dossier dcompress plg_jce_15X_FR-EN au moyen dun logiciel de transfert de chier FTP tel que FileZilla, dans le dossier plugins/editors de votre site web, sur les machines de votre hbergeur.222 LE GUIDE COMPLETFaciliter la rdaction des pages avec lditeur JCEChapitre 7Figure 7.8 : Le transfert du contenu du dossier du plugin plg_jce_15X_FR-EN dans le dossier plugins/editors du site webDepuis ladministration de Joomla, activez le menu Composants/JCE Administration an dafficher le panneau de contrle de ladministration de lditeur JCE. Dans la page Administration de JCE, un message vous avertit de la prsence du plugin. Cliquez sur le lien Finaliser linstallation du plugin JCE.Figure 7.9 : La nalisation de linstallation de lditeur JCELE GUIDE COMPLET 223Chapitre 7Adapter le site avec des composantsDclarer lditeur JCE comme diteur par dfaut1 Activez le menu Site/Configuration globale. Dans la rubrique Paramtres du site de longlet Site, slectionnez Editeur JCE 1.5.X dans la liste droulante Editeur WYSIWYG par dfaut. 2 Cliquez sur le bouton Sauver.Figure 7.10 : La dnition de lditeur JCE par dfaut3 Vous pouvez vous assurer du bon fonctionnement du nouvel diteur en ditant un article.Figure 7.11 : Un article, ouvert depuis lditeur JCE224 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 7Aide sur lutilisation de JCELe site officiel de lditeur, accessible au moyen du bouton Aide de lditeur JCE, fournit une documentation trs complte sur lutilisation du composant et de nombreux tutoriels.Figure 7.12 : Les tutoriels7.3. Grer un site multilingue avec le composant Joom!FishLa fonction de ce composant est de transformer votre site Joomla en un site multilingue. Le concept est le suivant : le contenu du site est dupliqu (articles, menus, ) en un nombre gal au nombre de langues que vous avez dtermin puis vous effectuez la traduction de chacun de ces lments (les pages dorigine ne sont pas automatiquement traduites).Ajouter une langue linterfaceIndpendamment du contenu rdactionnel dans les articles, le frontend et le backend peuvent tre traduits dans les langues de votre choix. Il convient donc de commencer par installer les packs de langues correspondant aux langues que vous souhaitez employer sur le site.LE GUIDE COMPLET 225Chapitre 7Adapter le site avec des composants1 Tlchargez le chier archive de la langue souhaite en vous connectant, depuis votre navigateur Internet, ladresse : http://community.joomla.org/translations.html (cette adresse propose des packs de langues tlchargeables, raliss par les quipes de dveloppement "Joomla! Translation Teams").Figure 7.13 : Le tlchargement de packs de langues2 Depuis ladministration de Joomla, cliquez sur le menu administrateur Extensions/Installer/Dsinstaller. 3 Dans la page Gestion des extensions, cliquez sur le bouton Parcourir de la rubrique Archive transfrer. 4 Depuis la bote de dialogue Envoi du fichier, slectionnez larchive que vous venez de tlcharger puis cliquez sur le bouton Ouvrir. 5 De retour dans la page Gestion des extensions, cliquez sur le bouton Transfert de fichier & Installation.Figure 7.14 : Linstallation dune nouvelle langue226 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 76 Pour vrier que la langue est installe, cliquez sur le lien Langues de la page Gestion des extensions ou activez le menu Extensions/Gestion des langues.Figure 7.15 : Ici, le pack de langues a t install avec succsLa page Gestion des langues rcapitule les langues installes.7 Si vous souhaitez modier la langue par dfaut, cochez loption gauche de la langue souhait puis cliquez sur le bouton Default.Figure 7.16 : Le choix de la langue par dfaut dans le frontendModication de la langue par dfaut par un utilisateurLorsque lutilisateur est connect depuis linterface publique du site, il peut galement modier la langue depuis le formulaire Modifiez vos coordonnes pour le frontend et le backend. Laccs un tel formulaire est ajout dans le frontend sous la forme dun item de menu par Menus/Nom du menu puis Nouveau et Utilisateur/Utilisateur/Paramtres utilisateurs.LE GUIDE COMPLET 227Chapitre 7Adapter le site avec des composantsFigure 7.17 : La modication de la langueInstaller Joom!FishVous allez maintenant installer le composant Joom!Fish. Il se compose de deux parties (lune destine au frontend et lautre au backend).1 Tlchargez sur votre ordinateur le chier archive en vous connectant, depuis votre navigateur Internet, ladresse : http://www.joomfish.net.Figure 7.18 : Le site de tlchargement de Joom!Fish (la version stable lheure o nous crivons ces lignes est la version 2.0.3228 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 72 Depuis ladministration de Joomla, cliquez sur le menu administrateur Extensions/Installer/Dsinstaller. 3 Depuis la bote de dialogue Envoi du fichier, slectionnez larchive que vous venez de tlcharger sur votre ordinateur puis cliquez sur le bouton Ouvrir. 4 De retour dans la page Gestion des extensions, cliquez sur le bouton Transfert de fichier & Installation.Figure 7.19 : Linstallation de Joom!FishAprs installation, la liste des modules et plugins installs est affiche.Figure 7.20 : Les modules et plugins installs pour Joom!FishLe composant principal est Joom!Fish Composant qui devra tre paramtr ainsi que les modules mod_jflanguageselection, mod_translate, ventuellement, et le plugin Jfrouter.LE GUIDE COMPLET 229Chapitre 7Adapter le site avec des composants5 Par dfaut, linterface de Joom!Fish est en langue anglaise. Pour la franciser, retournez, depuis votre navigateur Internet, sur le site http://www.joomfish.net et cliquez sur le menu The Club/Club Downloads.Figure 7.21 : Laccs au tlchargement du chier de traduction enfranais6 Cliquez sur le lien Joom!Fish Translations puis sur le lien Joom!Fish French de la page Folder: Joom!Fish Translations pour tlcharger larchive.Figure 7.22 : Le lien de tlchargementFigure 7.23 : Le bouton de lancement du tlchargement7 Depuis linterface dadministration de Joomla, cliquez sur le menu Extensions/Installer/Dsinstaller.230 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 7La page Gestion des extensions est affiche.8 Cliquez sur le bouton Parcourir de la rubrique Archive transfrer. 9 Depuis la bote de dialogue Envoi du fichier, slectionnez larchive que vous venez de tlcharger sur votre ordinateur puis cliquez sur le bouton Ouvrir. 10 De retour dans la page Gestion des extensions, cliquez sur le bouton Transfert de fichier & Installation.Figure 7.24 : Linstallation de la traduction de Joom!FishFigure 7.25 : Linstallation sest effectue correctementLE GUIDE COMPLET 231Chapitre 7Adapter le site avec des composantsEmplacement des chiers langueDans larborescence des dossiers du systme, les chiers langue portent lextension .ini et sont encods selon la norme UTF8. Les chiers utiliss par le backend sont placs dans le rpertoire administrator/language/ puis dans un dossier spcique la langue (fr-FR/ pour le franais, par exemple). Les chiers utiliss par le frontend sont placs dans le rpertoire language/ puis dans un dossier spcique la langue (fr-FR/ pour le franais, par exemple).Paramtrer la langue de rfrenceDans cet exemple, vous allez apprendre paramtrer le franais comme langue de rfrence.1 Activez le menu Extensions/Gestion de Langues.La page Gestion des langues est affiche.2 Cochez loption gauche de la langue an de choisir la langue par dfaut du site, qui sera la langue principale et de rfrence. Cliquez sur le bouton Defaut. 3 ce stade, les autres langues ncessaires ont t installes, comme nous lavons montr prcdemment.Figure 7.26 : Le choix de la langue principale du siteLangue de rfrenceIl est obligatoire de dnir une langue principale ; ce sont les contenus crits dans cette langue qui serviront de modles aux traductions.232 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 7Vous allez maintenant activer les langues du site depuis linterface du composant Joom!Fish.4 Activez le menu Composants/Joom!Fish/Languages.La page Joom!Fish Language Manager est affiche.5 Cochez les cases de la colonne Actif correspondant aux langues utiliser dans le site. La langue principale doit tre galement coche (ici, le franais est la langue par dfaut). 6 Cliquez sur le bouton Appliquer.Figure 7.27 : Lactivation des langues du siteAssocier un drapeau une langueDans larborescence des dossiers du systme, placez limage du drapeau dans le dossier components\com_joomfish\images\flags. Dans la page Gestion des langues Joom!Fish de linterface, saisissez le nom de limage en chemin relatif dans le champ Nom de fichier de limage.Accs aux paramtres ct du nom dune langue, le bouton Config donne accs aux paramtres de la conguration globale spciques cette langue.Accder aux paramtres gnraux1 Activez le menu Composants/Joom !Fish/Panneau de contrle.LE GUIDE COMPLET 233Chapitre 7Adapter le site avec des composantsLa page Joom!Fish : Gestionnaire de contenu multilingue pour Joomla! est affiche.2 Cliquez sur le bouton Paramtres.Figure 7.28 : La page Joom!Fish :: Gestionnaire de contenu multilingue pour Joomla!La page Joom!Fish est affiche.3 La liste droulante Il ny a aucune traduction disponible vous permet dopter pour lun des choix suivants, concernant les contenus non traduits :Contenu original. Lorsque cette option est choisie, larticledorigine est affich dans la langue par dfaut.Texte par dfaut. Lorsque cette option est choisie, le texte saisi dans la zone Texte par Dfaut se substitue au texte de larticle(vous pouvez avoir recours une mention du type "Cet article na pas encore t traduit. Nous vous invitons consulter cette page ultrieurement."). Contenu original avec infos. Lorsque cette option est choisie, larticle dorigine est affich, dans la langue par dfaut, auquel sajoute un texte informatif complmentaire, renferm dans un chier du type xx-XX.com_joomfish.ini (dans lequel xx-XX indique la langue). Le contenu original propose galement des traductions. Lorsque cette option est choisie, larticle dorigine est propos, dans la langue par dfaut, accompagn de drapeaux indiquant les langues pour lesquelles la traduction a t effectue.4 La liste de choix Overwrite global config values autorise, selon loption choisie, dindiquer si les paramtres de conguration globale par langue doivent rester prioritaires ou non. 5 La liste de choix Publi partir du frontend ? permet dindiquer si les rdacteurs sont autoriss ou non publier les traductions depuis linterface du frontend.234 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 76 La liste de choix Show default language in administration permet dindiquer si la langue par dfaut peut ou non tre active dans linterface de traduction. 7 La liste de choix Copy original params to empty translation permet dindiquer si les paramtres de larticle dorigine doivent tre recopis dans la traduction. 8 La liste de choix Enable translation caching permet dindiquer si le cache doit ou non tre activ pour les traductions.Figure 7.29 : La page Joom!FishActivation du cache lors de traductionsIl est prfrable dactiver le cache uniquement lorsque le travail de traduction des articles est termin an de ne pas devoir le vider chaque modication (commande Outils/Nettoyer le cache), lors du contrle du rsultat obtenu dans le frontend.9 Cliquez sur le bouton Sauver.LE GUIDE COMPLET 235Chapitre 7Adapter le site avec des composantsLa traduction dun article1 Depuis le panneau de contrle de Joom!Fish, cliquez sur longlet Traduction. 2 Dans la page Traduction, choisissez la langue dans laquelle la traduction sera effectue dans la liste droulante Langue. Choisissez le type dlment Contents dans la liste droulante Elments de contenu. 3 Choisissez une section pour ltrer les lments puis cliquez sur le titre de larticle.Figure 7.30 : La slection de larticle traduireLa page qui est alors affiche prsente, en double, les zones constitutives de larticle (dans la langue dorigine et dans la langue dans laquelle la traduction est effectue) :j j j j j j j j jle titre ; lalias (ressaisissez un alias spcique la traduction, dans la langue utilise) ; le texte dintroduction ; le corps de larticle ; les images ; les mta-instructions ; la date de dbut de publication ; la date de n de publication ; diverses autres informations.236 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 7Pour effectuer la traduction dun article, la traduction doit tre saisie dans les zones idoines ou le texte dorigine copi au moyen du bouton Copier plac ct de chacune des zones.Figure 7.31 : La page Traduction dun article4 Cochez la case Publi an dactiver la traduction.Figure 7.32 : La publication de la traduction5 Cliquez sur le bouton Sauver.Connatre ltat davancement des traductionsDans la page Traduction, sont affichs, dans la colonne Etat, diffrents symboles indiquant ltat davancement de la traduction des divers lments constitutifs du site. La signication de ces symboles estLE GUIDE COMPLET 237Chapitre 7Adapter le site avec des composantsindique au bas de la page (traduction jour, traduction incomplte, traduction inexistante).Figure 7.33 : Les tats des traductionsTraduire un menuLes articles ne sont pas les seuls composants du site pouvoir tre traduits. Pour traduire un menu, cliquez sur longlet Traduction. Dans la page Traduction, choisissez la langue approprie dans la liste droulante Langue. Choisissez ensuite le type dlment Menus dans la liste droulante Elments de contenu. Cliquez sur le menu traduire.Traduire directement des contenusIl existe un autre moyen deffectuer des traductions. Voici un exemple de ce mode opratoire, appliqu un article.1 Affichez la page Gestion des articles par le menu Contenu/ Gestion des articles. 2 Cochez la case gauche du titre de llment traduire puis choisissez la langue dans la liste droulante du module mod_translate affich en haut droite, dans la fentre dadministration.Figure 7.34 : Le choix de la langue de traduction dans le module de type mod_translate238 LE GUIDE COMPLETGrer un site multilingue avec le composant Joom!FishChapitre 7La page Traduction de larticle traduire saffiche dans une fentre.Activation du moduleLe module de type mod_translate doit tre activ depuis la page des modules de ladministrateur. Effectuez cette opration en cliquant sur le menu Extensions/Gestion des Modules puis sur longlet Administrateur. Vriez que le module, dont le nom par dfaut est Direct Translation, est activ.Figure 7.35 : Le module mod_translate activ dans les modules de ladministrateurTraduction orphelineCe terme dsigne les traductions pour lesquelles la version dorigine nexiste plus. Vous pouvez lister lensemble des traductions orphelines via longlet Traductions orphelines de linterface de Joom!Fish.Paramtrer le choix de la langue utilise dans le frontendLorsque vos traductions sont effectues, il vous est possible de choisir la langue utilise dans la partie publique du site.1 Activez le menu Extensions/Gestion des Modules puis cliquez sur le module Language Selection de type mod_jflanguageselection. 2 La liste droulante Apparance du slecteur de langue permet de dnir laspect du slecteur de langue dans la partie publique.LE GUIDE COMPLET 239Chapitre 7Adapter le site avec des composantsFigure 7.36 : Les choix du slecteur de langueFigure 7.37 : Le choix de la langue dans une liste droulante depuis la partie publique7.4. Grer des documents avec DOCmanDOCman est un composant permettant de grouper des chiers et des descriptifs, dy associer des licences dutilisation et de rendre leur accs rserv au tlchargement des groupes dutilisateurs choisis. Le systme fournit galement une fonction de recherche dans les documents et des statistiques relatives aux tlchargements effectus. Tlchargez les chiers des archives du composant DOCman depuis ladresse http://www.joomlatools.eu/downloads/cat_view/8-docman.html propose sur le site http://extensions.joomla.org :j jle composant com_docman_1.4.0.stable.zip ; les chiers franais pour linterface, french_docman_v1.4.0.zip.240 LE GUIDE COMPLETGrer des documents avec DOCmanChapitre 7Figure 7.38 : Le tlchargement du composant DOCman depuis le site http://www.joomlatools.euLa version 1.4.0 ne fonctionne pas nativement avec la version 1.5.x de Joomla ; le plugin de compatibilit System Legacy doit tre activ.Lactivation du plugin de compatibilit LegacyCertains composants ne fonctionnent pas nativement avec la version 1.5.x de Joomla, cest le cas de composants dvelopps pour des versions antrieures de joomla (les versions 1.0.x), ils ne sinstalleront pas si le plugin de compatibilit System Legacy nest pas activ.Figure 7.39 : Le composant ne peut pas sinstaller sans lactivation du plugin LegacyPar dfaut, le plugin Legacy nest pas activ. Pour lactiver, utilisez le menu Extensions/Gestionnaire. Dans la page Gestion des plugins, cochez la case gauche du nom du plugin System Legacy puis cliquez sur le bouton Actif ou cliquez sur le rond rouge avec une croix blanche de la colonne Activ.LE GUIDE COMPLET 241Chapitre 7Adapter le site avec des composantsFigure 7.40 : Lactivation du plugin System LegacyLe chier de langues de DOCmanSi linterface du composant DOCman nest pas francise, le chier archive french_docman_v1.4.0.zip doit tre dcompress.Figure 7.41 : Le contenu de larchive french_docman_v1.4.0.zipLe dossier language doit tre ensuite transfr dans le dossier administrator\ components\com_docman et le dossier themes dans le dossier components\ com_docman de votre site web, sur les machines de votre hbergeur au moyen dun logiciel de transfert de chier FTP tel que FileZilla.Figure 7.42 : Le site de lquipe de dveloppement du composant Community Builder, http://www.joomlapolis.com, utilise Docman pour la gestion des documents242 LE GUIDE COMPLETGrer une galerie de photos Phoca GalleryChapitre 77.5. Grer des utilisateurs avec Community BuilderLa fonction de cette extension est dajouter des fonctions relatives la gestion des utilisateurs :jj j jajout de champs dans de nombreux types (listes de choix, cases cocher, emails, mots de passe, boutons doptions, etc.), caractrisant les utilisateurs ; ajout possible davatars (icnes reprsentant les utilisateurs) ; envoi dun courrier lectronique aprs quun formulaire a t utilis pour adresser un message un utilisateur ; recherche des utilisateurs.La dernire version est tlchargeable sur le site de lquipe de dveloppement du composant : http://www.joomlapolis.com. La version 1.2 est oprationnelle sur Joomla 1.5. Une documentation, en anglais, est galement propose sur le site http://joomlapolis.com. Aprs avoir dcompress larchive, il vous faut installer le composantcom_comprofiler.zip puis les modules et enn le plugin de langue enfranais (ce dernier sinstalle depuis linterface du composant dans la gestion des plugins de Community Builder).7.6. Grer une galerie de photos Phoca GalleryCette extension a pour fonction de grer des galeries dimages avec diaporamas. Il est possible de la lier avec le module de commerce lectronique VirtueMart ainsi quavec les chiers vido en ligne sur le site de YouTube. Vous pourrez tlcharger les chiers des archives du composant Phoca Gallery depuis ladresse http://www.phoca.cz/download.LE GUIDE COMPLET 243Chapitre 7Adapter le site avec des composantsFigure 7.43 : Le tlchargement du composant Phoca Gallery depuis le site http://www.phoca.cz7.7. Grer des newsletters avec CommunicatorCette extension, intgralement traduite en franais, repose sur une fonctionnalit de gestion de newsletters. Elle intgre notamment une fonction de dsabonnement, une fonction de recherche, une gestion de listes dabonns (avec importation et exportation), lutilisation de lditeur WYSIWYG, lenregistrement aux formats texte brut et HTML (avec utilisation des feuilles de style), la liaison avec les articles du site, etc.Figure 7.44 : Le tlchargement du composant Communicator depuis le site http://www.joomlafrance.org244 LE GUIDE COMPLETGrer des groupes avec GMAccessChapitre 7Figure 7.45 : Linterface du composant Communicator7.8. Grer des groupes avec GMAccessCe composant a pour fonction de grer des groupes dutilisateurs plus efficacement que le systme de gestion natif de Joomla, ainsi que les droits daccs associs au frontend et au backend. Vous pouvez tlcharger GMAccess ladresse http://www.eduvs.ch /gmaccess.Figure 7.46 : Le tlchargement du composant GMA depuis le site http://www.joomlafrance.orgLE GUIDE COMPLET 245Chapitre 7Adapter le site avec des composants7.9. Installer de nouveaux templatesModier lapparence du site est une opration trs aise, comme vous lavez dj dcouvert, par la simple application dun template, sans que le contenu rdactionnel en soit affect. Le nombre de templates livr avec Joomla est toutefois restreint. Aussi apprcierez-vous certainement de dcouvrir que de nombreux dveloppeurs, doubls dinfographistes dous, pour certains, mettent votre disposition un trs grand nombre de templates gratuits en ligne sur le Web.Gratuit des templatesVous trouverez sur Internet un nombre incalculable de templates, gratuits pour la plupart. Certains concepteurs proposent galement des templates payants, des prix attractifs, dots de fonctionnalits et dhabillages graphiques indniablement attrayants. Si lun dentre eux vous convient, la solution consistant en faire lacquisition se rvlera gnralement un bien meilleur calcul que de passer beaucoup de temps ladaptation dun template gratuit ou la cration de votre propre template, si vous ne disposez pas dune certaine exprience en matire de codage php et de techniques dutilisation des feuilles de style (chiers css), rouages sur lesquels sont bass les templates. Lachat dun template constitue en outre un encouragement, pour ses dveloppeurs, qui participent lessor du CMS.Crer son propre templateSi, aprs avoir parcouru les nombreux sites proposant des templates Joomla (saisissez "template joomla" dans la zone de recherche de Google pour les dcouvrir), aucun dentre eux ne vous convient, rien ne vous empche de crer votre propre template. Vous devrez alors vous documenter sur cette technique car il vous faudra respecter quelques rgles de construction.Rechercher des templates titre dexemple, vous allez ici parcourir les nombreux templates proposs en tlchargement sur le trs rput site allemand : http://www.joomlaos.de.246 LE GUIDE COMPLETInstaller de nouveaux templatesChapitre 71 Depuis votre navigateur Internet, connectez-vous ladresse http://www.joomlaos.de.Figure 7.47 : La page daccueil du site http://www.joomlaos.de2 Dans le menu Main Menu, cliquez sur Template Galerie.Figure 7.48 : Le lien menant la galerie de templatesLE GUIDE COMPLET 247Chapitre 7Adapter le site avec des composants3 Dans la page qui apparat, cliquez sur Templates fr Joomla 1.5.Figure 7.49 : Ce lien mne aux templates spciques la version 1.5de JoomlaLa page affiche vous propose trois types de templates :j j jles templates largeur xe ; les templates largeur variable (en fonction de la taille et de la rsolution dans lesquelles le site est vu) ; les templates largeur paramtrable.Tlcharger des templates largeur xe1 Cliquez sur la premire vignette, lgende Album: Statische Templates.Figure 7.50 : La vignette symbolisant la galerie de templates statiquesLa zone de prsentation des templates statiques est affiche. Elle se compose de nombreuses pages, que vous pouvez parcourir au moyen de boutons de navigation.248 LE GUIDE COMPLETInstaller de nouveaux templatesChapitre 7Figure 7.51 : La premire page de prsentation des templates statiques2 Parcourez les pages proposes au moyen des boutons de navigation. Lorsquune vignette prsente une mise en forme qui semble vous convenir, cliquez sur le lien Live Preview affich sous la vignette.Un site Joomla de dmonstration sur lequel est appliqu le template est alors affich dans un nouvel onglet, vous permettant ainsi dapprcier le rendu du template.Figure 7.52 : Le site de dmonstration prsentant le template BeeTeddyLE GUIDE COMPLET 249Chapitre 7Adapter le site avec des composants3 Lorsque votre choix est fait, cliquez sur le lien Download, affich sous la vignette du template, dans lune des pages de prsentation des templates largeur xe.Une page de description du template apparat, affichant notamment les paramtres spciques au template, quil vous sera possible de modier depuis le backend, aprs installation.Figure 7.53 : La page de description du template4 Cliquez sur le lien Download. 5 Dans la page qui apparat, cochez la case indiquant que vous acceptez les conditions dutilisation et cliquez sur le bouton Download.La bote de dialogue de tlchargement est affiche.6 Enregistrez le chier compress, au format zip, sur votre ordinateur.Tlcharger des templates largeur variableLa procdure de tlchargement est identique la prcdente, cette nuance prs quil vous faut cliquer sur la seconde vignette, dans la page proposant les trois types de templates pour Joomla 1.5.250 LE GUIDE COMPLETInstaller de nouveaux templatesChapitre 7Figure 7.54 : La vignette symbolisant la galerie de templates dynamiquesFigure 7.55 : La premire page de prsentation des templates largeurvariableTlcharger des templates largeur paramtrableLa procdure de tlchargement est identique la prcdente mais il vous faut cliquer sur la troisime vignette, dans la page proposant les trois types de templates pour Joomla 1.5.LE GUIDE COMPLET 251Chapitre 7Adapter le site avec des composantsFigure 7.56 : La vignette symbolisant la galerie de templates largeur paramtrableFigure 7.57 : La premire page de prsentation des templates largeur paramtrableInstaller un template tlchargLinstallation dun template, aprs quil a t tlcharg, seffectue aussi simplement quest ralise linstallation dun composant.1 Depuis le backend, cliquez sur Extensions/Installer/Dsinstaller.La page Gestion des extensions est affiche.252 LE GUIDE COMPLETInstaller de nouveaux templatesChapitre 72 Dans la zone Archive transfrer, cliquez sur le bouton Parcourir puis slectionnez le chier compress au format zip, tlcharg prcdemment sur votre ordinateur. Cliquez sur le bouton Ouvrir puis sur le bouton Transfert de fichier & Installation.Le message Installateur Template Succs est affich dans la page.3 Cliquez sur Extensions/Gestion des templates.La page Gestion des templates est affiche.4 Cochez loption gauche du nom du template puis cliquez sur le bouton Dfaut. 5 Affichez la partie publique du site dans un autre onglet et cliquez sur le bouton dactualisation de votre navigateur pour visualiser le site aprs application du nouveau template.Figure 7.58 : Le nouveau template a t appliqu (il sagit ici du trs original template Beeteddy)Paramtrer un templateLes paramtres varient dun template lautre. titre dexemple, vous allez accder ceux du template prcdemment install.1 Depuis le backend, cliquez sur Extensions/Gestion des templates. 2 Cliquez sur le nom du template.La page Template: [ diter ] est affiche. La rubrique Paramtres affiche les paramtres spciques au template, quil vous est possible de modier pour personnaliser laffichage.LE GUIDE COMPLET 253Chapitre 7Adapter le site avec des composantsFigure 7.59 : Les paramtres du template7.10. Check-listj jj j j j j j jJoomla autorise linstallation de trs nombreux composants complmentaires, facilement tlchargeables sur le Web. Le composant JCE est trs employ par les utilisateurs de Joomla pour amliorer les fonctionnalits natives de lditeur WYSIWYG. Le composant Joom!Fish permet de crer des sites multilingues. Le composant DOCman permet la gestion et le tlchargement de documents. Le composant Community Builder permet damliorer la gestion des utilisateurs. Le composant Phoca Gallery permet la gestion avance de laffichage des images. Le composant Communicator permet une gestion amliore des newsletters. Le composant GMAccess permet la gestion des groupes. Des centaines de templates, le plus souvent gratuits, sont tlchargeables sur Internet. Leur mode dinstallation est identique celui des composants. Ils permettent de modier radicalement la mise en forme sans affecter le contenu rdactionnel du site.254 LE GUIDE COMPLETAjouter une boutique en ligneComprendre le concept de VirtueMart ......................................................................... 256 Installer VirtueMart ............................................................................................................. 259 Choisir le mode daffichage de linterface dadministration de VirtueMart ......... 275 Dcouvrir les paramtres de configuration gnrale ................................................ 278 Configurer les paramtres de la boutique ................................................................... 279 La TVA ................................................................................................................................... 288 Crer le catalogue de produits ....................................................................................... 292 Paramtrer les expditions .............................................................................................. 318 Personnaliser les modes de paiements ....................................................................... 322 Consulter ltat des commandes ................................................................................... 326 Sauvegarder le site web ................................................................................................... 327 Check-list ............................................................................................................................. 330Chapitre 8Ajouter une boutique en ligneUne des grandes originalits de Joomla, ce qui le diffrencie notablement des autres systmes de gestion de contenus, est sa possibilit dimplmentation du composant VirtueMart, lun des systmes OpenSource les plus efficaces en matire de gestion de commerce lectronique. Cette section lui est ddie. Vous y apprendrez comment transformer votre site vitrine en une vritable boutique en ligne qui naura rien envier, en termes de fonctionnalits, aux grands sites de vente en ligne, jusqualors rservs aux grosses structures logistiques et nancires.8.1. Comprendre le concept de VirtueMartVirtueMart est une solution OpenSource de E-Commerce utilise avec Joomla, galement dveloppe en PHP et utilisant la base de donnes MySQL.Les points forts de VirtueMartSimple utiliser (la prise en main de linterface de VirtueMart requiert quelques heures) et implmenter, le composant nen est pas moins un formidable outil complet, disposant, en outre, de nombreuses extensions tlchargeables sur le Net. VirtueMart dispose de sa propre interface de gestion, qui sintgre dans celle de Joomla, et depuis laquelle vous grerez la totalit de vos produits (matriels ou immatriels) et services vendus en ligne, classs par catgories et par sous-catgories (ce classement hirarchique peut tre tendu sans limites). Les fonctionnalits du systme vont bien au-del de celles dune petite boutique en ligne. Citons, titre dexemple :j j j jla gestion des caractristiques des produits ; la gestion des promotions et des soldes (paramtrables en fonction de lappartenance des clients certains groupes) ; un module daffichage alatoire des produits ; des tarifs affichables hors taxes ou toutes taxes comprises ;256 LE GUIDE COMPLETComprendre le concept de VirtueMartj j j j j j j j j jChapitre 8un moteur de recherche ; une gestion des stocks ; des importations et exportations de chiers ; une gestion des groupes (utilisateurs et clients) ; de nombreux types de paiements scuriss ; des statistiques des ventes ; une gestion de devises diffrentes ; une gestion de pays diffrents ; une gestion des expditions et des frais inhrents ; une gestion des taxes, etc.Le site officiel de VirtueMartLadresse du site officiel de lquipe de dveloppement de VirtueMart est http://www.virtuemart.net. Vous y trouverez de nombreux tutoriels, dmonstrations, exemples, extensions, forums, ainsi que divers complments proposs en tlchargement.Figure 8.1 : Le site officiel de VirtueMartLE GUIDE COMPLET 257Chapitre 8Ajouter une boutique en ligneLe menu Home/Demo du site propose, depuis le lien Live Shops, des exemples de boutique utilisant la solution VirtueMart.Figure 8.2 : Des exemples de boutiquesDepuis la page VirtueMart Demo, le lien Demo (shopper) permet de tester VirtueMart en tant quacheteur pour obtenir un aperu des principales fonctionnalits de VirtueMart et passer des commandes. Le site de test est http://demo.virtuemart.net.Figure 8.3 : La page VirtueMart Demo depuis le site virtuemart.net258 LE GUIDE COMPLETInstaller VirtueMartChapitre 8Le lien DEMO (administrator) de la page VirtueMart Demo permet de tester la partie administration de VirtueMart.8.2. Installer VirtueMartIl vous est possible dinstaller Joomla et VirtueMart simultanment. Vous pouvez galement opter pour une installation classique de Joomla suivie dune installation spare de VirtueMart. (Cette solution intressera notamment ceux dentre vous qui sont dsireux de mettre en ligne un site vitrine, dans un premier temps, avant de le transformer en boutique en ligne.) Les modes opratoires relatifs aux deux mthodes dinstallation sont dcrits ci-aprs.Premire mthode dinstallation : Installer simultanment Joomla et VirtueMartVoici une premire mthode dinstallation de Joomla et de VirtueMart, par le biais dun package unique dinstallation des deux produits. Le site officiel de VirtueMart fournit un package comprenant la fois Joomla et VirtueMart, nomm VirtueMart eCommerce Bundle. Il permet une installation complte de Joomla et de VirtueMart en une seule opration. Les versions utilises dans le package sont, ce jour, la version 1.5.9 pour Joomla et la version 1.1.2, concernant VirtueMart. Linterface dadministration du site est en anglais et Joomla a t spcialement modi pour VirtueMart.Compatibilit du packageSil offre lindniable avantage dtre simple et rapide installer, ce package Joomla-VirtueMart a ncessit, pour sa cration, une modication du code initial de Joomla, par lquipe de dveloppement de VirtueMart. Pour des raisons de compatibilit avec lensemble des extensions en ligne sur le Web, nous prfrons utiliser la mthode traditionnelle dinstallation, reposant sur limplmentation de Joomla puis de VirtueMart (cette mthode est dcrite dans la section suivante de ce livre).LE GUIDE COMPLET 259Chapitre 8Ajouter une boutique en ligneProcdez ainsi :1 Tlchargez le chier compress au format zip du composant dadministration et le plugin associ. Pour cela, connectez-vous au site http://www.virtuemart.net. Cliquez sur longlet Downloads puis sur le lien VirtueMart eCommerce Bundle.Larchive tlcharge est nomme VirtueMart_1.1.2_eCommerce_Bundle_Joomla_1.5.9.tar.gz.Figure 8.4 : Le tlchargement du package e-commerce de Joomla depuis le site http://www.virtuemart.net2 Dcompressez le chier tlcharg.Dcompression dun chier au format gzPour dcompresser un chier portant lextension .gz ou .tar.gz, il est possible dutiliser des logiciels comme 7zip, IceOWS, PoweGZchiver, iZarc, TugZip. Ces programmes peuvent tre tlchargs sur le Web.260 LE GUIDE COMPLETInstaller VirtueMartChapitre 8Figure 8.5 : Le contenu du dossier VirtueMart_1.1.2_eCommerce_Bundle_Joomla_1.5.9 de larchive dcompresseFigure 8.6 : Le site officiel www.izarc.orgLE GUIDE COMPLET 261Chapitre 8Ajouter une boutique en ligneLes chiers tarCe format de chier trouve son origine dans le logiciel darchivage par concatnation de donnes du mme nom, utilis sous systme dexploitation UNIX. La compression des donnes est gnralement effectue au moyen dun logiciel de compression. Les extensions de chiers alors gnres sont, le plus souvent, .tar.gz ou .tgz, lorsque le format gzip est utilis ou, .tar.bz2, lorsque le format bzip2 est employ.3 Procdez linstallation classique de Joomla en suivant les tapes dcrites dans la section de ce livre Installer Joomla sur un serveur web local si vous souhaitez installer le systme des ns de tests sur votre ordinateur ou en respectant les tapes de la section Publier les fichiers de Joomla chez lhbergeur"si vous optez pour une installation chez votre hbergeur.Figure 8.7 : Aperu de linterface de la version e-commerce de Joomla dans le frontend262 LE GUIDE COMPLETInstaller VirtueMartChapitre 8Seconde mthode dinstallation : Ajouter le composant VirtueMart un systme Joomla dj installVoici une seconde mthode dinstallation de VirtueMart, plus classique, et que nous vous conseillons de prfrer la prcdente an de ne courir aucun risque de compatibilit avec des installations ultrieures de composants ou de modules. Aprs avoir implment Joomla, il est possible dinstaller le composant VirtueMart ainsi que ses modules et ses plugins an de comprendre larrire boutique. Vous allez donc ajouter VirtueMart un systme Joomla dj en place sur votre serveur.Tlchargement du package complet de VirtueMart1 Tlchargez le chier zip du package de la dernire version de VirtueMart. Pour cela, connectez-vous au site http://www.virtuemart .net, cliquez sur longlet Downloads puis sur le lien Complete Package for Joomla! 1.5. Enregistrez larchive sur votre ordinateur.Larchive tlcharge ce jour est VirtueMart_1.1.3-COMPLETE_PACKAGE.j15.zip.Figure 8.8 : Le tlchargement du package VirtueMart depuis le site http://www.virtuemart.net2 Dcompressez le chier tlcharg.LE GUIDE COMPLET 263Chapitre 8Ajouter une boutique en ligneVous obtenez un dossier VirtueMart_1.1.X-COMPLETE_PACKAGE.j15 contenant diffrents dossiers.Figure 8.9 : Le contenu de larchive VirtueMart_1.1.X-COMPLETE_PACKAGE.j15Le tlchargement de VirtueMart depuis le site joomla.frIl est possible de tlcharger la solution VirtueMart depuis le site officiel franais de Joomla mais sans certitude quil sagisse de la dernire version. Cest pourquoi il est prfrable de tlcharger depuis le site officiel de VirtueMart. Connectez-vous au site http://www.joomla.fr. Cliquez sur longlet Extensions. Dans le menu de gauche, cliquez sur Tlcharger. La page Gestionnaire de fichiers est affiche. Cliquez sur la catgorie Extensions pour Joomla 1.5 puis sur J1.5 E-Commerce. Cliquez sur VirtueMart pour j1.5 version puis sur Tlcharger. La page affiche vous donne un descriptif prcis du contenu de larchive. Larchive tlcharge ce jour est VirtueMart_1.1.3COMPLETE_PACKAGE.j15.zip.Figure 8.10 : Le tlchargement de VirtueMart depuis le site http://www.joomlafrance.org264 LE GUIDE COMPLETInstaller VirtueMartChapitre 8Linstallation du composant VirtueMart1 Depuis ladministration de Joomla, cliquez sur le menu administrateur Extensions/Installer/Dsinstaller. 2 Dans la page Gestion des extensions, cliquez sur le bouton Parcourir de la rubrique Archive transfrer. 3 Depuis la bote de dialogue Envoi du fichier, slectionnez larchive du composant, com_virtuemart_1.1.X.j15.zip qui se trouve dans le dossier VirtueMart_1.1.X-COMPLETE_PACKAGE.j15, puis cliquez sur le bouton Ouvrir. 4 De retour dans la page Gestion des extensions, cliquez sur le bouton Transfert de fichier & Installation.La page VirtueMart Installation saffiche.5 Cliquez sur le bouton Install SAMPLE DATA. Un message vous demande de patienter durant lajout des exemples de donnes. Cliquez sur le bouton OK pour continuer linstallation.Figure 8.11 : Lajout dexemple de donnesLa page de linterface dadministration de VirtueMart saffiche.LE GUIDE COMPLET 265Chapitre 8Ajouter une boutique en ligneFigure 8.12 : Le panneau de contrle de VirtueMart aprs linstallation du package complet de VirtueMart tlcharg depuis le site virtuemart.netInstallation du composant VirtueMart depuis un dossier ou depuis une URLEn cas de problme dinstallation du composant, il est galement possible deffectuer linstallation depuis un dossier. Pour cela, placez le chier com_virtuemart_1.1.X.j15.zip dans le dossier tmp sous la racine du dossier du site web Joomla. Depuis le backend du site Joomla, cliquez sur le menu Extensions/Installer/Dsinstaller. Dans la page Gestion des extensions qui saffiche, vriez que la zone dossier dinstallation est renseigne par le chemin daccs au dossier tmp. Cliquez sur le bouton Installation de la rubrique Installer depuis un dossier.Figure 8.13 : Linstallation du composant VirtueMart depuis un dossierPour effectuer une installation depuis une URL, saisissez lURL indiquant ladresse du chier com_virtuemart_1.1.X.j15.zip (du type http://nomdusite/dossier/com_virtuemart_1.1.X.j15.zip) dans la zone URL de la rubrique Installer depuis une adresse URL. Cliquez sur le bouton Installation.266 LE GUIDE COMPLETInstaller VirtueMartChapitre 8Aprs avoir utilis lune des mthodes prcdentes, la page Bienvenue sur VirtueMart saffiche. Si le problme dinstallation du composant persiste, ayez recours linstallation manuelle comme dcrit ci-aprs.Linstallation manuelle du composant VirtueMartSi le chier com_virtuemart_1.1.x.j15.zip du composant est suprieur 2 Mo, il se peut que vous rencontriez un problme, lors de linstallation du composant (ce problme peut provenir du dlai dexcution des scripts, paramtr chez votre hbergeur). Il est donc recommand de raliser une installation manuelle.1 Connectez-vous au site http://www.virtuemart.net. Cliquez sur longlet Downloads puis sur le lien Manual Installation Package for Joomla! 1.5. Enregistrez larchive VirtueMart_1.1.X-Manual_ Installation_Package.j15.tar.gz sur votre ordinateur.Figure 8.14 : Le tlchargement du package dinstallation manuelle depuis le site http://virtuemart.net2 Dcompressez le chier tlcharg sur votre ordinateur.LE GUIDE COMPLET 267Chapitre 8Ajouter une boutique en ligneVous obtenez un dossier VirtueMart_1.1.X-Manual_Installation_Package.j15 contenant diffrents dossiers.Figure 8.15 : Le contenu de larchive VirtueMart_1.1.X-Manual_Installation_Package.j153 Copiez les dossiers administrator, components du dossier VirtueMart_1.1.X-Manual_Installation_Package.j15 dans la racine du site Joomla au moyen dun logiciel de transfert de chier FTP tel que FileZilla, sur les machines de votre hbergeur.Dossiers modules et pluginsLes dossiers modules et plugins ne sont pas copier car les modules et plugins seront installs depuis linterface dadministration du site Joomla.4 Aprs vous tre connect linterface dadministration du site Joomla, saisissez dans la Barre dadresse du navigateur ladresse http://www. www.mon-site-web-joomla.fr/administrator/index.php?option =com_virtuemart puis validez.Figure 8.16 : La poursuite de linstallation manuelle de VirtueMart268 LE GUIDE COMPLETInstaller VirtueMartChapitre 8La page VirtueMart Installation saffiche.5 Cliquez sur le bouton Install SAMPLE DATA. Un message vous demande de patienter durant lajout des exemples de donnes. Cliquez sur le bouton OK pour continuer linstallation.Figure 8.17 : Lajout dexemple de donnesLa page de linterface dadministration de VirtueMart saffiche.Figure 8.18 : Le panneau de contrle de VirtueMartLE GUIDE COMPLET 269Chapitre 8Ajouter une boutique en ligneInstaller VirtueMart en franaisDans ce qui suit, nous supposons que vous avez comme nous opt pour la seconde mthode dinstallation de VirtueMart, dcrite prcdemment (installations de Joomla et de VirtueMart spares). Linterface de VirtueMart est affiche en version francophone si linstallation est issue du package tlcharg depuis le site http://www.joomla.fr. Dans ce cas, les modes opratoires suivants ne sont pas suivre. Si vous avez procd une installation dun package tlcharg depuis le site http://virtuemart.net, linterface de VirtueMart est affiche en langue anglaise. Nous vous conseillons de suivre les tapes ci-aprs pour franciser linterface.Tlchargement du package des chiers de langue1 Connectez-vous au site http://www.virtuemart.net. 2 Cliquez sur longlet Downloads puis sur le lien Language Pack et enregistrez larchive Language_Pack_for_VirtueMart_1.1.X.zip sur votre ordinateur.Figure 8.19 : Le tlchargement du package des langues depuis le site http://virtuemart.net270 LE GUIDE COMPLETInstaller VirtueMartChapitre 83 Dcompressez le chier tlcharg.Vous obtenez un dossier Language_Pack_for_VirtueMart_1.1.X contenant le dossier languages.Figure 8.20 : Le contenu de larchive Language_Pack_for_VirtueMart_1.1.3Installation des chiers french.phpTransfrez le dossier languages du dossier Language_Pack_for_VirtueMart_1.1.X dans le dossier components/com_virtuemart. mon-site-web-joomla/administrator/Un complment de traduction ce jour, le chier archive propos sur le site www.virtuemart.net, Language_Pack_for_VirtueMart_1.1.3.zip, ne contient pas toutes les traductions franaises de linterface de VirtueMart. Ainsi, par exemple, si vous activez depuis linterface dadministration de VirtueMart le menu Configuration, le bas de page de longlet Gnral prsente des tiquettes des zones de texte absentes. Le site http://www.alatak.net propose un complment de la traduction franaise. Pour cela, connectez-vous au site et tlchargez larchive LanguagePack_french_20080605.tar.gz accessible depuis le menu Tlchargement. Dcompressez larchive puis copiez le dossier languages du dossier Language Pack for VirtueMart 1.1 dans le dossier mon-site-web-joomla/administrator/components/com_virtuemart.LE GUIDE COMPLET 271Chapitre 8Ajouter une boutique en ligneNe supprimez ni ne renommez le dossier languages tlcharg depuishttp://virtuemart.net car celui du site http://www.alatak.net ne contient pascertains dossiers comme tax, vendor ou encore zone. Vous devez publier le contenu du dossier languages en crasant le rpertoire initial, issu de la version tlcharge sur le site http://virtuemart.net.Installer les modules de VirtueMartLes archives des modules de VirtueMart installer sont renfermes dans le dossier modules de VirtueMart_1.1.X-COMPLETE_PACKAGE.j15.Figure 8.21 : La liste des archives des modules de VirtueMartPour installer les modules, reportez-vous la section Installer un composant de ce livre (menu Extensions/Installer/Dsinstaller). La liste des modules est la suivante :j VirtueMart Product Categories j j j: affichage des catgories de produits (archive : mod_product_categories_1.1.X.j15.zip) ; VirtueMart Product Scroller : affichage des produits par dlement (archive : mod_productscroller_1.1.X.j15.zip) ; VirtueMart Module : affichage de la boutique (archive : mod_virtuemart_1.1.X.j15.zip) ; VirtueMart All-In-One : affichage de tous les produits de la boutique (archive : mod_virtuemart_allinone_1.1.X.j15.zip) ;272 LE GUIDE COMPLETInstaller VirtueMartj VirtueMartChapitre 8Shopping Cart : affichage mod_virtuemart_cart_1.1.X.j15.zip) ;du panier (archive :j VirtueMart Currency Selector: affichage de la liste droulante pourchoisir la devise (archive :mod_virtuemart_currencies_1.1.X.j15.zip) ;j VirtueMart Featured Products j j j j j j: affichage des produits en promotion (archive : mod_virtuemart_featureprod_1.1.X.j15.zip) ; VirtueMart Latest Products : affichage des nouveaux produits (archive : mod_virtuemart_latestprod_1.1.X.j15.zip) ; VirtueMart Login : affichage du compte client (archive : mod_virtuemart_login_1.1.X.j15.zip) ; VirtueMart Manufacturers : affichage des fabricants (archive : mod_virtuemart_manufacturers_1.1.X.j15.zip) ; VirtueMart Random Products : affichage alatoire de produits (archive : mod_virtuemart_randomprod_1.1.X.j15.zip) ; VirtueMart Search : affichage dune recherche (archive : mod_virtuemart_search_1.1.X.j15.zip) ; VirtueMart Top Ten Products : affichage des meilleures ventes (archive : mod_virtuemart_topten_1.1.X.j15.zip).Dcouvrir la boutique depuis le Frontend moins que vous ayez utilis la mthode dinstallation simultane de Joomla et de VirtueMart, par le package dinstallation, les modules de VirtueMart ne sont pas directement actifs, aprs leur installation. Vous devez les activer depuis linterface dadministration de Joomla, par le menu Extensions/Gestion des modules. An de dcouvrir la boutique dans le frontend, vous allez activer le module principal de VirtueMart. Vous pourrez ensuite reproduire ce mode opratoire pour activer les autres modules, mesure de la mise en uvre des fonctionnalits de VirtueMart.1 Depuis le backend de Joomla, cliquez sur Extensions/Gestion des modules.Le gestionnaire de modules est affich.2 Depuis la colonne Activ du gestionnaire de modules, activez le module VirtueMart Module.LE GUIDE COMPLET 273Chapitre 8Ajouter une boutique en ligneFigure 8.22 : Lactivation du module principal3 Visualisez le rsultat obtenu dans le frontend.Figure 8.23 : La boutique en ligne est dsormais visible dans lefrontendInstaller les plugins de VirtueMartLes archives des plugins de VirtueMart installer se trouvent dans le dossier plugins de VirtueMart_1.1.X-COMPLETE_PACKAGE.j15.274 LE GUIDE COMPLETChoisir le mode daffichage de linterface dadministration de VirtueMartChapitre 8Figure 8.24 : La liste des archives des plugins de VirtueMartPour installer les plugins, utilisez le mode opratoire dcrit dans la section Installer un composant (menu Extensions/Installer/Dsinstaller). La liste des plugins est la suivante :j VirtueMart Product Snapshotpermet de lier un produit dans un article de Joomla (archive : vmproductsnapshots_1.1.X.j15.zip).crire dans larticle {vmproductsnapshots : id du produit}Ce petit plugin vous sera trs utile lors de la rdaction darticles affrents certains de vos produits et dans lesquels vous souhaiterez insrer un lien textuel associ une image menant directement un produit de votre catalogue (cette opration seffectue en insrant la commande {vmproductsnapshots : id du produit} dans le texte de votre article). Vous crerez ainsi des pages attractives pour les internautes tout en constituant des liens profonds entre articles de mme sujet, qui, comme vous le dcouvrirez plus loin, amliorent le rfrencement de votre site dans les moteurs de recherche.j VirtueMart Extended Search Pluginpermet de faire une recherche sur les articles et les produits (archive : VirtueMart vmxsearch. plugin_1.1.3.j15.zip) depuis le module de recherche joomla natif.Comme les modules, les plugins, pour tre utiliss, doivent tre activs. Vriez que tel est bien le cas, depuis linterface dadministration de Joomla, par le menu Extensions/Gestion des plugins.8.3. Choisir le mode daffichage de linterface dadministration de VirtueMartVirtueMart est install. Vous pouvez dsormais utiliser le composant. Choisissez lun des deux modes de prsentation proposs, en ce qui concerne laspect de linterface.LE GUIDE COMPLET 275Chapitre 8Ajouter une boutique en ligne1 Activez le menu Composants/VirtueMart pour afficher linterface dadministration de VirtueMart.Par dfaut les lments de linterface de VirtueMart sont intgrs ceux de Joomla. Cette prsentation est dsigne par les dveloppeurs du composant sous lappellation de Mise en page simple. Il vous est galement possible de choisir une interface uniquement ddie VirtueMart. VirtueMart propose deux affichages de son interface dadministration : La mise en page "simple", dans laquelle le menu Administration est prsent verticalement gauche. Deux onglets, dans la partie centrale, donnent accs au panneau de contrle (renfermant des boutons de raccourcis) et des statistiques. Les menus de Joomla restent accessibles.Figure 8.25 : Laffichage "simple" de linterface de VirtueMartla mise en page "tendue", dans laquelle le menu Administration est prsent horizontalement. Les deux onglets sont affichs comme prcdemment mais les menus de Joomla ne sont plus accessibles.Figure 8.26 : Laffichage "tendu" de linterface de VirtueMart276 LE GUIDE COMPLETChoisir le mode daffichage de linterface dadministration de VirtueMartChapitre 82 Pour accder laffichage tendu alors que laffichage simple est activ, cliquez sur le lien Mise en page tendu.Figure 8.27 : Lactivation de laffichage tendu3 Pour accder laffichage simple alors que laffichage tendu est activ, cliquez sur le lien Mise en page simple.Figure 8.28 : Lactivation de laffichage simpleLE GUIDE COMPLET 277Chapitre 8Ajouter une boutique en ligne8.4. Dcouvrir les paramtres de conguration gnralePour cette prise en mains, vous allez survoler les nombreux paramtres dont les valeurs vous permettront de personnaliser VirtueMart en fonction de votre activit conomique. Certains de ces points sont dtaills plus loin dans ce livre.1 Depuis linterface dadministration de VirtueMart, cliquez sur le menu Configuration gnrale puis sur Configuration.La page Configuration qui est affiche prsente de nombreux paramtres de conguration, accessibles depuis plusieurs onglets (Gnral, Scurit, Site, Expdition, Commande, Tlchargements, Configuration du flux).Figure 8.29 : La page CongurationUtiliser VirtueMart pour afficher un simple catalogueLa boutique en ligne peut tre utilise an de prsenter votre catalogue de produits. Vous ne souhaiterez plus alors afficher les prix ni permettre lachat en ligne. Depuis linterface de VirtueMart, activez le menu Configuration gnrale/Configuration. Dans longlet Gnral, cochez la case Utiliser278 LE GUIDE COMPLETConfigurer les paramtres de la boutiqueChapitre 8comme catalogue uniquement de la rubrique Gnral. Dcochez ventuellement la case Afficher les prix de la rubrique Configuration des prix.Figure 8.30 : La dsactivation de laffichage des prix dans la boutiqueEn outre, le menu Configuration gnrale, lorsquil est cliqu, permet louverture dautres sous-menus autorisant laccs divers paramtres. Certains dentre eux seront expliqus plus loin.2 Depuis linterface dadministration de VirtueMart, cliquez sur le menu Configuration gnrale puis sur chacun de ses items pour dcouvrir les paramtres rattachs (gestion des utilisateurs et des groupes, pays, devises, modules, etc.).8.5. Congurer les paramtres de la boutiquePour dbuter, il vous faut dnir quelques paramtres de base, spciques votre activit. Depuis linterface dadministration de VirtueMart, cliquez sur Boutique puis sur Editer la boutique. La page Informations sur la boutique saffiche.LE GUIDE COMPLET 279Chapitre 8Ajouter une boutique en ligneFigure 8.31 : Laccs aux paramtres de la boutiqueDnir lidentit de la boutiqueLes informations renfermes dans les zones de la rubrique Boutique sont spciques votre boutique. Il convient de les renseigner avec soin car elles sont utilises, notamment, lors de ladressage des courriels la clientle. Les donnes quil vous faut personnaliser dans cette rubrique sont les suivantes :j j j j j jle nom de la boutique ; le nom de lentit juridique ; lURL de la boutique ; ladresse postale (sur deux champs) ; la ville ; le pays ;Modier la liste des paysPour ajouter ou supprimer des pays la liste propose, cliquez sur Configuration gnrale puis sur Lister les pays. Utilisez le bouton Nouveau pour ajouter un pays et le bouton Supprimer pour supprimer les pays slectionns.280 LE GUIDE COMPLETConfigurer les paramtres de la boutiquej j j jChapitre 8ltat (ou la province ou encore la rgion) ; le code postal ; le numro de tlphone ; le format de ladresse de la boutique ;Le format de ladresse de la boutiqueLe champ Format de ladresse de la boutique est utilis pour slectionner, ordonner et structurer les informations envoyes dans le mail de conrmation linternaute, lorsque ce dernier effectue une commande (pour connatre les champs quil vous est possible dutiliser, cliquez sur licne dinformation, symbolise par le caractre "i" cot du nom de la zone, an de faire apparatre la liste dans une infobulle).Figure 8.32 : La liste des champs disponibles pour la zone Format de ladresse de la boutiqueLE GUIDE COMPLET 281Chapitre 8jAjouter une boutique en lignele format de la date.Le format de la datePour accder la liste des diffrents formats daffichage de la date, quil vous est possible dutiliser pour la zone champ Format de la date de la boutique, cliquez sur le lien info, propos droite de la zone.Figure 8.33 : Laccs aux diffrents types daffichage de la dateDans un autre onglet du navigateur, saffiche la page dtaillant la syntaxe de la fonction strftime() sur le site fr.php.net (http://fr.php.net/manual/fr/function .strftime.php). La liste des lments syntaxiques ncessaires la composition de la date y sont dcrits.Figure 8.34 : La liste des paramtres de la fonction strftime() sur le sitefr.php.net282 LE GUIDE COMPLETConfigurer les paramtres de la boutiqueChapitre 8Dnir les informations sur la boutiqueToujours sur la page Informations sur la boutique, les zones de la rubrique Informations sur la boutique permettent de dnir des informations complmentaires telles que :j j jle logo utilis dans les courriels adresss aux internautes, lors des commandes ; le montant minimal de la commande ; le montant TTC partir duquel les frais de transport seront "franco de port".Figure 8.35 : Les informations sur la boutiqueDnir lidentit du responsable contacterLes zones de la rubrique Informations de contact permettent de renseigner lidentit de la personne responsable de la boutique : nom, prnom, civilit, tlphone, fax et email du responsable. Ladresse lectronique du responsable a une double utilit : elle est communique linternaute lors du courriel de conrmation de la commande et avertit le responsable, lorsquune nouvelle commande est passe ; une copie du courriel est galement envoye cette adresse.LE GUIDE COMPLET 283Chapitre 8Ajouter une boutique en ligneFigure 8.36 : Les coordonnes du contact de la boutiqueDnir la devise utilise et le format daffichage des prixVirtueMart est un systme multidevise et multipays. Les zones de la rubrique Style affichage monnaie permettent dindiquer la devise utilise pour laffichage des prix ainsi que le format dans lequel les valeurs seront prsentes. Procdez ainsi :1 Choisissez la devise utilise dans la liste droulante Devise. 2 Saisissez le symbole montaire dans la zone Symbole montaire (le symbole Q, par exemple). 3 Indiquez le nombre de dcimales afficher dans la zone Dcimales (la valeur sera arrondie si elle renferme un nombre suprieur de dcimales). 4 Saisissez le caractre utilis comme caractre dcimal dans la zone Symbole dcimal (le point est propos par dfaut). 5 Saisissez le caractre utilis comme sparateur de milliers dans la zone Sparateur de milliers (cette zone peut rester vide).284 LE GUIDE COMPLETConfigurer les paramtres de la boutiqueChapitre 86 La zone Format positif prsente une liste droulante dans laquelle vous pouvez indiquer le format de prsentation des valeurs positives (ainsi, par exemple, le choix du format 00 Symb aura pour consquence un affichage des prix positifs sous la forme dune valeur, suivie dun espace, lui-mme suivi du symbole montaire, 15,00 Q, par exemple). 7 La zone Format ngatif prsente une liste droulante dans laquelle vous pouvez indiquer le format de prsentation des valeurs ngatives (ainsi, par exemple, le choix du format -00 Symb aura pour consquence un affichage des prix positifs sous la forme dune valeur, suivie dun espace, lui-mme suivi du symbole montaire, -15,00 Q, par exemple). 8 La zone Liste des devises acceptes prsente une liste permettant de choisir les devises autorises sur le site. An dviter des problmes de conversion, nous vous conseillons de choisir uniquement la devise prcdemment dnie.Liste des devisesPour ajouter ou supprimer une devise, cliquez sur le menu dadministration Configuration gnrale puis sur Lister les devises. La liste des devises est affiche. Utilisez le bouton Nouveau pour ajouter une nouvelle devise ou le bouton Supprimer pour supprimer les devises slectionnes.Figure 8.37 : La liste des devisesLE GUIDE COMPLET 285Chapitre 8Ajouter une boutique en ligneSaisir la description de la boutiqueLa rubrique Description de la page Informations sur la boutique est ddie la saisie, au moyen dun diteur WYSIWYG, du texte de prsentation de la boutique (vous pouvez, bien entendu, galement y placer des images). Ces informations, dans lesquelles il est videmment conseill de placer des mots-cls lattention des moteurs de recherche, seront affiches sur le frontend si, dans un menu, est cr un lien menant la boutique (cest--dire vers le composant VirtueMart).Figure 8.38 : Laffichage de la description de la boutique du site http://www.la-mesange-bleue.fr dans le frontendSaisir les conditions gnrales de ventePrsente dans le mme diteur WYSIWYG, la rubrique Conditions gnrales de vente de la page Informations sur la boutique est, elle, ddie la saisie du texte des conditions gnrales de vente de la boutique.286 LE GUIDE COMPLETConfigurer les paramtres de la boutiqueChapitre 8Figure 8.39 : La saisie des conditions gnrales de vente dans les paramtres de la boutiquePlacer les conditions gnrales de vente dans un articleUne autre faon dafficher les conditions gnrales de ventes (CGV) consiste les saisir dans un article. Cette mthode, plus souple que la prcdente, permet de donner accs aux CGV lors de la commande, mais aussi depuis nimporte quelle partie du site, par un lien plac dans un menu ou dans un article. Suivez ce mode opratoire : j Crez un article depuis le menu Contenu/Gestion des articles de linterface dadministration de Joomla. Nommez cet article Conditions gnrales de vente. j Activez le menu Composants/VirtueMart pour afficher linterface dadministration de VirtueMart. Cliquez sur le menu Configuration gnrale/Configuration. j Dans la page Configuration, longlet Gnral est affich. Slectionnez larticle des conditions gnrales de vente dans la liste Lien vers la version longue de votre texte concernant la politique des retours de la rubrique Paramtres denregistrement des utilisateurs. j Cliquez sur le bouton Enregistrer.Figure 8.40 : Le choix de larticle des Conditions gnrales de venteLE GUIDE COMPLET 287Chapitre 8Ajouter une boutique en ligne8.6. La TVAVirtueMart dispose de nombreuses options dapplication de la TVA.Lapplication du calcul de la TVATrois mthodes dapplication de la TVA sont possibles :1 Depuis linterface de VirtueMart, activez le menu Configuration gnrale/Configuration. 2 Dans longlet Gnral, choisissez lun des modes de calcul de la TVA dans la liste droulante Calcul des taxes de la rubrique Configuration des taxes (TVA).Le choix propos par dfaut est Base sur ladresse du vendeur.Figure 8.41 : Le choix du mode de calcul de la TVAVirtueMart permet trois mthodes de calcul de la TVA :j Base sur ladresse de livraison.Le calcul de la TVA est tabli sur les taux de TVA du pays de livraison de linternaute qui effectue lachat. Les taux de TVA des pays autoriss dans la boutique doivent alors tre dnis par le menu Taxes/Ajouter un taux de TVA.Le pays de lacheteur est connuLorsque linternaute cre son compte client avant de passer sa commande, il doit spcier son pays de rsidence dans un formulaire.288 LE GUIDE COMPLETLa TVAj Base sur ladresse du vendeur.Chapitre 8Le calcul de la TVA est tabli sur les taux de TVA du pays dans lequel la boutique est juridiquement tablie.Le pays de la boutiquePour dnir le pays de la boutique, cliquez sur le menu Boutique/diter la boutique. Dans la page Informations sur la boutique, choisissez le pays de la boutique dans la liste Pays de la rubrique Boutique.Figure 8.42 : Le choix du pays de la boutique j Mode Union Europenne.Le calcul de la TVA est tabli comme dans le cas prcdent, si le client rside dans un pays de la communaut europenne. Dans le cas contraire, la TVA du pays du client est applique, si elle a t paramtre.Appliquer une taxe sur les produits immatrielsLes produits tlchargs (musiques, vidos, logiciels, etc.) nont pas dexistence physique. Ils se distinguent donc des produits traditionnels en ce sens quils ont un poids nul (Le poids dun produit peut tre dniLE GUIDE COMPLET 289Chapitre 8Ajouter une boutique en lignepar le menu Produits/Lister les produits, aprs avoir cliqu sur le produit concern, dans la zone Poids de longlet Dimensions et poids du produit.) Il vous est possible dindiquer si la TVA doit ou non tre applique sur ce type de produits. Dans longlet Gnral de la page Configuration, cochez la case Taxe virtuelle de la rubrique Configuration des taxes (TVA) (cette case est active par dfaut).Figure 8.43 : Lactivation de la taxe virtuelleUtiliser des taux de TVA multiplesVous devez utiliser cette option si tous vos produits ne sont pas soumis aux mmes taux de TVA. Dans longlet Gnral de la page Configuration, cochez la case Activer le taux de TVA multiples ? de la rubrique Configuration des taxes (TVA) (cette case est active par dfaut).Figure 8.44 : Lactivation de la gestion des taux de TVA multiples290 LE GUIDE COMPLETLa TVAChapitre 8Crer les taux de TVA par pays ou rgionPour affecter chacun de vos produits le code TVA qui lui correspond, vous devez au pralable crer les taux de TVA pour chacun des pays et des tats concerns, si vous avez opt pour un calcul de TVA utilisant ces paramtres (taux de TVA bas sur ladresse de livraison ou sur le mode Union europenne).1 Depuis linterface de VirtueMart, activez le menu Taxes/Lister les taux de TVA.La page Liste des taux de TVA est affiche.2 Supprimezr les dnitions de taxes inutiles en les cochant puis en cliquant sur le bouton Supprimer.Figure 8.45 : Suppression dun taux de TVA3 Conrmez la suppression en cliquant sur le bouton OK de la bote de dialogue affiche. 4 Pour crer un nouveau taux, cliquez sur le bouton Nouveau. 5 Dnissez le pays dans la liste de la zone TVA pour le pays. 6 Faites de mme pour la zone TVA pour ltat ou la rgion. 7 Saisissez la valeur du taux dans la zone Taux de TVA.Figure 8.46 : La saisie dun taux de TVALE GUIDE COMPLET 291Chapitre 8Ajouter une boutique en ligneAffichage de la mention indiquant que la TVA est incluseUne mention indiquant que la TVA est comprise peut tre affiche cot du prix du produit, accompagne du taux de TVA appliqu. Pour ce faire, activez le menu Configuration gnrale/Configuration. Dans longlet Gnral de la page Configuration, dcochez la case Affiche "(TVA XX% comprises)" quand possible? de la rubrique Configuration des prix.Figure 8.47 : La mention indiquant que la TVA est incluse8.7. Crer le catalogue de produitsVous allez dsormais saisir vos produits et leurs caractristiques.Crer les fabricants de produitsAvant de crer les produits, vous allez constituer la liste des fabricants (ou des marques) auxquels sont rattachs les produits. Si le nombre de fabricants est important, il est prfrable de crer des catgories de fabricants. Cela facilitera votre classement. Sinon, la catgorie qui sera utilise par dfaut se nomme default.1 Depuis linterface dadministration de VirtueMart, activez le menu Fabricants/Ajouter une catgorie de fabricants.La page Formulaire catgorie fabricant est affiche.292 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 82 Saisissez le nom de la catgorie du fabricant dans le champ Nom de la catgorie. 3 Saisissez un descriptif dans la zone Description de la catgorie. 4 Cliquez sur le bouton Enregistrer.Suppression dune catgoriePour supprimer une catgorie, affichez la liste des fabricants par le menu Fabricants/Lister les catgories de fabricants. Dans la page Liste des catgories de fabricants, cochez le nom de la catgorie, puis cliquez sur le bouton Supprimer.Vous allez maintenant crer un fabricant.5 Depuis linterface dadministration de VirtueMart, activez le menu Fabricants/Ajouter un fabricant.La page Ajouter une information est affiche.6 Saisissez le nom du fabricant dans le champ Nom du fabricant. 7 Saisissez lURL du site Internet du fabricant dans la zone URL. 8 Saisissez ladresse lectronique du fabricant dans la zone Email.Affichage et masquage de lURL du fabricant dans la che du produitPour activer cette option, cliquez sur le menu Configuration gnrale /Configuration. Depuis longlet Site, cliquez sur le lien Configuration de la rubrique Affichage. Dans la page Paramtres du thme qui est alors affiche, activez ou dsactivez loption de la ligne Show Manufacturer Link. Si loption est active, les informations concernant le fabricant (ladresse du site Internet, ladresse lectronique et le descriptif) safficheront dans une fentre depuis la page de dtails du produit, lorsque le lien du fabricant sera cliqu.LE GUIDE COMPLET 293Chapitre 8Ajouter une boutique en ligneFigure 8.48 : Laffichage du fabricant9 Choisissez la catgorie de fabricant dans la liste droulante Catgorie de fabricant. 10 Saisissez un descriptif dans la zone Description. 11 Cliquez sur le bouton Enregistrer.Suppression dun fabricantAffichez la liste des fabricants par le menu Fabricants/Lister des fabricants. Dans la page Liste des fabricants, cochez le nom du fabricant, puis cliquez sur le bouton Supprimer.Crer des catgories de produitsUn produit doit tre rattach une catgorie. Aussi, avant de crer des produits, est-il ncessaire de crer des catgories de produits. En outre, la cration dune hirarchie de catgories permet de structurer le catalogue.1 Depuis linterface dadministration de VirtueMart, activez le menu Produits/Ajouter une catgorie.La page Information sur la catgorie saffiche.294 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 82 Depuis longlet Information sur la catgorie, saisissez le nom de la catgorie du produit dans le champ Nom de la catgorie. 3 Saisissez un descriptif dans la zone Description de la catgorie.Le choix de lordre daffichage lenregistrement effectu. ne sera possible quaprs4 Choisissez le niveau suprieur de la catgorie dans la liste droulante Parent.Une catgorie de niveau 1 doit tre affecte au niveau parent Default -TopLevel.5 La zone Affiche x produits par ligne permet de dnir le nombre de produits affichs par ligne lorsque la rubrique est clique. 6 Les listes droulantes Page de navigation catgorie et Page produit de la catgorie dnissent respectivement le modle de mise en forme de la page de la catgorie et celui de la page des produits de la catgorie.Figure 8.49 : La saisie dune catgorieIl est possible dassocier une image une catgorie.7 Cliquez sur longlet Images, manipulations suivantes :puisexcutezlunedesLE GUIDE COMPLET 295Chapitre 8jAjouter une boutique en lignePour associer une image au format dune vignette partir dune image de grande taille, cliquez dans la zone Image grande taille, puis choisissez, depuis la bote de dialogue Envoi du fichier, le chier de limage de la catgorie et cliquez sur le bouton Ouvrir. Sous longlet Images de la page Information sur la catgorie, cliquez sur loption Auto-cration vignette ?, puis sur le bouton Appliquer. Cliquez nouveau sur longlet Images pour constater que la vignette associe la catgorie est alors gnre. Cette dernire est visible sous la rubrique Vignette (colonne de droite).Figure 8.50 : La cration de limage de la catgorie dans le format dune vignetteModication des dimensions des vignettesLa largeur et la hauteur des vignettes sont modiables depuis les zones Largeur de la vignette et Hauteur de la vignette, accessibles depuis le menu Configuration/Configuration gnrale, sous longlet Site et la rubrique Affichage. La modication sera applique pour les futures vignettes gnres. Les vignettes cres avant la modication des dimensions restent dans leur taille initiale.296 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 8Figure 8.51 : La modication des dimensions des futures vignettesjPour associer une image de taille personnalise la catgorie, cliquez dans la zone Vignette, puis choisissez, depuis la bote de dialogue Envoi du fichier, le chier de limage de la catgorie et cliquez sur le bouton Ouvrir. Sous longlet Images de la page Information sur la catgorie, cliquez sur le bouton Appliquer. Cliquez nouveau sur longlet Images pour constater que limage utilise pour la catgorie conserve les dimensions de limage initialement choisie, visible sous la rubrique Vignette (colonne de droite).Figure 8.52 : La cration de limage de la catgorie dans un format personnalisLE GUIDE COMPLET 297Chapitre 8jAjouter une boutique en ligneSaisissez dans la zone URL de la rubrique Vignette, lURL de limage de la vignette.8 Cliquez sur le bouton Enregistrer.Figure 8.53 : La liste des catgories hirarchisesLa catgorie de produit cre apparat dans la liste des catgories hirarchises de la page Arborescence des catgories.Supprimer limage dune catgoriePour ce faire, ditez la catgorie depuis la page Arborescence des catgories accessible depuis le menu Produits/Lister les catgories. Cliquez sur longlet Images de la page Information sur la catgorie, puis cochez loption Taper none pour effacer les images courantes de la rubrique Vignette et cliquez sur le bouton Appliquer.Figure 8.54 : La suppression de limage dune catgorie298 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 8Ne pas publier une catgorieUne catgorie est, par dfaut, publie. Pour ne pas la publier, affichez la page Arborescence des catgories, accessible depuis le menu Produits/Lister les catgories, puis cliquez dans la colonne Publier de la ligne correspondant la catgorie retirer de la publication. Une autre mthode consiste diter la catgorie, puis dcocher la case Publier ? sous longlet Information sur la catgorie. Attention, une catgorie qui nest pas publie nannule pas la publication des produits qui lui sont associs ! Il faut galement annuler la publication de ces produits.Supprimer une catgoriePour supprimer une catgorie, affichez la page Arborescence des catgories par le menu Produits/Lister les catgories, puis cochez le nom de la catgorie et cliquez sur le bouton Supprimer. La suppression dune catgorie provoque la suppression des produits qui lui sont rattachs, sauf si ce dernier est associ dautres catgories.Saisir les produitsAprs avoir cr les diffrentes classications de produits, vous allez procder la saisie des produits. Plusieurs mthodes soffrent vous.Saisir les caractristiques de base dun produit1 Pour ajouter un produit, activez le menu Produits/Ajouter un produit.La page Nouveau produit saffiche. Elle renferme plusieurs onglets qui vous permettent de saisir les diffrentes caractristiques du produit. Longlet Informations du produit est ddi la saisie des caractristiques principales du produit (voir Figure 8.55).2 Saisissez la rfrence du produit qui doit tre unique dans la zone Ref. 3 Saisissez le nom du produit dans le champ Nom.LE GUIDE COMPLET 299Chapitre 8Ajouter une boutique en ligneFigure 8.55 : La page dajout dun nouveau produit4 Saisissez lURL dans la zone URL.La zone Vendeur contient le nom de la socit de la boutique qui a t dnie dans les informations de la boutique par le menu Boutique /Boutique Editer la boutique.MultivendeursLa version actuelle de VirtueMart, 1.1.3, nest pas multivendeurs. La gestion des vendeurs est accessible depuis le menu Vendeurs, mais nest pas oprationnelle et est en version alpha. Il est donc recommand de ne pas lutiliser tant que la phase de dbogage nest pas termine. Un message est affich dans la page Ajouter des informations si vous activez le menu Vendeurs/Ajouter un vendeur.Figure 8.56 : Lajout de plusieurs vendeurs nest pas conseill5 Choisissez le fabricant, cr auparavant, dans la liste Fabricant.300 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 86 Cliquez sur la catgorie du produit dans la liste Catgories. Plusieurs catgories peuvent tre slectionnes au moyen des touches [Ctrl] ou [Maj]. 7 Saisissez le prix HT du produit dans la zone Prix HT. La devise propose dans la liste droite du prix HT est celle paramtre depuis la page Informations sur la boutique par le menu Boutique /Editer la boutique. 8 Choisissez le taux de TVA appliquer sur le produit dans la liste NTVA.Le prix TTC du produit est systmatiquement affich dans la zone PrixTTC si le prix HT et le taux de TVA ont t dnis.La mise jour du prix HT ou du prix TTCLe prix HT est recalcul automatiquement si le prix TTC est saisi dans la zone Prix TTC et inversement. Il est quelquefois plus simple de saisir des prix TTC avec des dcimales prcises (par exemple 15,90) pour en dduire un calcul automatique du prix HT.9 Saisissez un descriptif succinct dans la zone Rsum qui sera affich dans la page de la catgorie du produit et dans celle de tous les produits. La taille maximale est de 255 caractres. 10 Saisissez un descriptif complet dans la zone Description complte qui sera affiche dans la page de dtails du produit. 11 Cliquez sur le bouton Enregistrer.Importer ou exporter des produits dans un chier CSVPour importer ou exporter des produits dun chier au format CSV, le composant CSV Improved doit tre install. Les versions rcentes du composant sont payantes ; les versions anciennes gratuites doivent tre installes avec le plugin System Legacy activ. Toutefois il est recommand de faire une sauvegarde avant linstallation. Le menu Produits/Utiliser Envoi de CSV permet daccder la page de tlchargement du composant sur le site http://www.csvimproved.com/downloads. Pour installer une version tlcharge, installez le composant depuis le menu Extensions/Installer/Dsinstaller, puis suivez les instructions pour importer ou extraire des produits VirtueMart.LE GUIDE COMPLET 301Chapitre 8Ajouter une boutique en ligneFigure 8.57 : La page de tlchargement dextensions VirtueMart depuis le site http://www.csvimproved.com/downloadsditer un produit1 Activez le menu Produits/Lister les produits.La page Liste des produits affiche les produits dans un tableau avec certaines caractristiques.2 Pour rechercher un produit, utilisez les zones de recherche, situes en haut de la page, ou la liste Filtre pour afficher les produits dune catgorie.Figure 8.58 : Le ltre sur les catgories302 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 83 Pour diter le produit, cliquez sur le nom du produit.La page Mettre jour llment affiche les caractristiques du produit dans les diffrents onglets.Ne pas publier un produitUn produit est, par dfaut, publi. Pour ne pas le publier, affichez la page Liste des produits, accessible depuis le menu Produits/Lister les produits, puis cliquez dans la colonne Publier de la ligne du produit retirer. Une autre mthode consiste diter le produit, puis dcocher la case Publier ? sous longlet Informations produit.Supprimer un produitAffichez la liste des produits par le menu Produits/Lister des produits. Dans la page Liste des produits, cochez la case gauche du produit, puis cliquez sur le bouton Supprimer.Cloner un produitCette opration est utile si vous disposez de produits similaires. Affichez la liste des produits par le menu Produits/Lister des produits, puis cliquez sur le bouton Cloner produit. La page Mettre jour llment affiche alors les caractristiques du produit. Modiez les caractristiques de votre choix et, dans tous les cas, changez la rfrence du produit qui doit tre unique an que le systme puisse lidentier.Intgrer limage principale du produit1 ditez le produit depuis la page Liste des produits, accessible depuis le menu Produits/Lister les produits. 2 Cliquez sur longlet Images du produit.Cet onglet permet dassocier au produit une image agrandie et de gnrer la vignette de limage, sans avoir le faire depuis votre logiciel de retouche dimage. Il nest pas utile de transfrer limage via unLE GUIDE COMPLET 303Chapitre 8Ajouter une boutique en lignesystme tel que [FileZilla]. Limage agrandie est visible lorsque la vignette du produit est clique depuis la page de dtails du produit.3 Cliquez dans la zone Image grande taille, puis choisissez, depuis la bote de dialogue Envoi du fichier, le chier de limage agrandie du produit et cliquez sur le bouton Ouvrir. Sous longlet Images du produit de la page Mettre jour llment, cliquez sur loption Auto-cration vignette ?, puis sur le bouton Appliquer. 4 Cliquez nouveau sur longlet Images du produit pour constater que limage agrandie du produit est affiche sous la rubrique Image grande taille (colonne de gauche) et que sa vignette est visible sous la rubrique Vignette (colonne de droite).Figure 8.59 : Limage du produit et sa vignetteIl est galement possible dassocier au produit une vignette de taille personnalise.5 Cliquez dans la zone Vignette, puis choisissez, depuis la bote de dialogue Envoi du fichier, le chier de limage de la vignette du produit et cliquez sur le bouton Ouvrir. Sous longlet Images du produit de la page Mettre jour llment, cliquez sur le bouton Appliquer. Cliquez nouveau sur longlet Images du produit pour constater que limage utilise pour la vignette conserve les dimensions de limage choisie, visible sous la rubrique Vignette (colonne de droite).Associer au produit des images et des chiers complmentairesVirtueMart permet dafficher plusieurs images pour un produit et dassocier des chiers tels que des notices aux formats PDF, des vidos ou des sons, par exemple.304 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 81 Affichez la page Liste des produits par le menu Produits/Lister les produits. 2 Cliquez sur licne de la colonne Media de la ligne du produit.Le numro droite de licne est le nombre de chiers associs au produit. Si vous avez associ une grande image ainsi que sa vignette, le nombre indiqu est 2.Figure 8.60 : Le gestionnaire de chiers du produit va tre affichLa page Gestionnaire de fichiers::Liste Image/Fichier affiche les images et les chiers du produit dans un tableau. Depuis cette page, il est possible dajouter, de supprimer et de voir les chiers du produit.3 Pour associer un nouveau chier, cliquez sur le bouton Nouveau.Le formulaire Envoyer un fichier saffiche dans une autre fentre.4 Pour associer une image supplmentaire au produit, choisissez Image dans la liste Type de fichier, puis cliquez sur le bouton dans la zone Nom de fichier pour la choisir depuis un emplacement de votre ordinateur. 5 Saisissez le texte associ limage dans la zone Titre Fichier.Figure 8.61 : Le choix du type de chier associLE GUIDE COMPLET 305Chapitre 8Ajouter une boutique en ligne6 Pour associer un chier un produit, choisissez Fichier dans la liste Type de fichier, puis saisissez le texte du lien du chier dans la zone Titre fichier. 7 Cliquez sur le bouton Enregistrer.Dans la page Gestionnaire de fichiers:Liste Image/Fichier, le chier supplmentaire est ajout la liste.Changer de chierEn cas derreur de chier, vous pouvez en changer depuis la page Gestionnaire de fichiers:Liste Image/Fichier, en cliquant sur le nom du chier an daccder nouveau la page Envoyer un fichier.Associer des attributs un produitLes attributs sont des caractristiques ajouts au produit. Par exemple, la couleur et la taille sont des attributs pour un pull-over, la puissance est un attribut pour une voiture. Chaque attribut a des valeurs qui sont dnies comme des proprits. Par exemple, rouge, vert et bleu sont les proprits de lattribut couleur. Le produit affiche une liste de choix et linternaute slectionne une option pour le produit avant de lajouter au panier. Par exemple, linternaute va choisir rouge pour un pull-over. Vous allez dnir un attribut et ses proprits.1 ditez le produit depuis la page Liste des produits, accessible depuis le menu Produits/Lister les produits. 2 Cliquez sur longlet Statut du produit, puis saisissez le nom de lattribut dans la zone Titre de la rubrique Liste des attributs, par exemple Couleur. 3 Saisissez ensuite le nom de la premire valeur de lattribut dans la zone Proprit, par exemple Rouge. 4 La zone Prix HT permet de dnir le prix du produit en fonction de la proprit. Utilisez lune des saisies suivantes :jPour conserver le prix initial HT du produit (saisi dans la zone Prix HT de longlet Informations produit) laissez la zone Prix HT vide.306 LE GUIDE COMPLETCrer le catalogue de produitsj j jChapitre 8Pour augmenter le prix initial HT du produit de X, saisissez +X dans la zone Prix HT. Pour diminuer le prix initial HT du produit de X, saisissez -X dans la zone Prix HT. Pour dnir un prix X diffrent du prix initial HT du produit, saisissez =X.5 Pour ajouter une nouvelle proprit lattribut, cliquez sur le lien Nouvelle proprit. Rptez laction en fonction du nombre de valeurs de lattribut. 6 Pour crer un nouvel attribut et ses proprits, cliquez sur le lien Nouvel attribut.Figure 8.62 : La saisie dattributs et de proprits7 Cliquez sur le bouton Enregistrer.Gestion des stocksCette mthode ne permet pas de grer les stocks du produit par attribut car le systme considre quil nexiste quun produit, quel que soit le nombre dattributs crs.Dans le frontend de la boutique, une liste droulante est affiche dans la page de dtails du produit. Cette liste renferme les proprits de lattribut cr prcdemment. La valeur entre parenthses, affiche droite de certaines proprits dans la liste droulante, indique laugmentation TTC ou la diminution TTC par rapport au prix du produit.LE GUIDE COMPLET 307Chapitre 8Ajouter une boutique en ligneFigure 8.63 : Laffichage dans le frontendCrer des produits personnalisables par lacheteurSi votre boutique met en vente des objets que lacheteur peut personnaliser (des tee-shirts son nom, par exemple), il vous est possible de dnir une ou plusieurs zones de texte complter par lacheteur, lors de lachat. La saisie du texte est effectue avant lajout du produit dans le panier. Pour ce faire, ditez le produit depuis la page Liste des produits, accessible depuis le menu Produits/Lister les produits, puis cliquez sur longlet Statut du produit. Saisissez le nom de lattribut dans la zone Liste des attributs personnaliss. Si plusieurs attributs doivent apparatre, saisissez les noms des attributs personnaliss spars par des points-virgules.Figure 8.64 : La saisie de donnes personnelle, pour un produit, lors deson achatFigure 8.65 : La cration dattributs personnalissDcliner un produitUn produit peut tre cr avec des conditionnements diffrents (un savon distribu en pains de poids diffrent ou liquide, par exemple). Il vous faut alors constituer le produit principal (ou produit parent), puis les variantes (produits enfants). Les produits parents et enfants ayant des308 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 8rfrences distinctes, il est donc possible de dnir les stocks de chaque produit an de pouvoir les grer. La premire tape consiste crer le produit principal.1 Pour cela, utilisez le menu Produits/Ajouter un produit, renseignez les caractristiques de base du produit, puis cliquez sur le bouton Appliquer pour enregistrer les donnes du produit.Le titre de la page Nouveau produit est modi en Mettre jourllment.La deuxime tape est celle de la dnition dun attribut.2 Depuis la page Mettre jour llment du produit parent, cliquez sur le bouton Ajouter un attribut. Ce bouton nest pas accessible depuis la page Nouveau produit. 3 Dans la page Formulaire dAttribut affiche, saisissez le nom de lattribut dans la zone Nom de lattribut. 4 Dans la zone Ordre daffichage, saisissez une valeur an dindiquer sa position par rapport aux autres attributs, si ceux-ci existent.Figure 8.66 : La seconde tape5 Cliquez sur le bouton Enregistrer.La page Liste dattributs pour affiche les attributs crs.Ajouter, modier, supprimer un attributPour modier un attribut, cliquez sur le nom de lattribut dans la page Liste dattributs pour an de lditer. Pour ajouter un nouvel attribut, cliquez sur le bouton Nouveau. Pour supprimer un attribut, utilisez le bouton Supprimer aprs avoir slectionn lattribut.LE GUIDE COMPLET 309Chapitre 8Ajouter une boutique en ligneLtape suivante consiste crer des dclinaisons du produit principal.6 Activez le menu Produits/Ajouter un lment.La page Nouvel lment saffiche avec des zones vierges pour la saisie des caractristiques du produit enfant.7 Saisissez la rfrence du produit enfant, unique, donc distincte de celle du produit parent, dans la zone Rf. 8 Saisissez le nom du produit enfant dans la zone Nom qui ne doit pas rester vide. Les autres zones peuvent le rester, ce sont les donnes dnies pour le produit principal qui seront prises en compte. 9 Cliquez sur longlet Statut de llment, puis saisissez la valeur de chaque attribut dans la zone de la rubrique Attributs de llment. 10 Saisissez ventuellement la quantit disponible dans la zone En stock de la rubrique Statut de llment pour grer les stocks du produit enfant.Modier un produit enfantAffichez les produits par le menu Produits/Lister les produits. Le produit ayant des produits enfants est reprable par le lien [Information de llment] plac droite de son nom. Cliquez sur ce lien pour afficher les produits enfants dans la page Liste des produits, puis sur le nom dun produit pour lditer.Figure 8.67 : Laccs aux produits enfantsDans le frontend de la boutique, les produits enfants sont affichs dans une liste droulante de la che de dtails du produit parent. Les caractristiques du produit enfant sont affiches lorsquun produit enfant est choisi dans la liste droulante. Il est possible de modier laffichage des produits de la liste.11 Depuis linterface dadministration de VirtueMart, affichez la liste des produits par le menu Produits/Lister les produits, puis ditez le produit parent. Cliquez ensuite sur longlet Affiche les options.310 LE GUIDE COMPLETCrer le catalogue de produitsChapitre 812 Pour ne pas afficher les caractristiques dun produit enfant lorsque celui-ci est cliqu, cochez la case Efface les valeurs daffichage des produits enfants et utilise les parents. 13 Lorsque la case de la liste Utiliser une liste droulante pour les produits enfants est coche, les produits enfants sont affichs dans un tableau. Utilisez les paramtres de la zone Style de la liste devenus actifs pour personnaliser laffichage des produits enfants.Associer les produits complmentairesLes produits complmentaires sont des produits ayant un lien avec le produit prsent, tels que des accessoires ou des modles similaires.1 ditez le produit depuis la page Liste des produits accessible depuis le menu Produits/Lister les produits. 2 Cliquez sur longlet Produits complmentaires, puis saisissez le nom du produit associer dans la zone Trouver des produits ou des catgories ici.Une liste des produits trouvs saffiche sous la zone de saisie.3 Cliquez un produit de la liste pour lafficher dans la liste de droite. Rptez lopration pour en ajouter plusieurs.Figure 8.68 : Lassociation de produits complmentairesSupprimer des produits complmentairesDepuis longlet Produits complmentaires, cliquez sur le produit complmentaire dans la liste de droite, puis sur le symbole