VIRTUEMART Joomla 1.5 User Manual [fr]

Joomla! 1.5 pour les Nuls

Ou comment créer et administrer en toute zénitude un site Web avec Joomla!

Chapitre : Avant propos

Ce document et l'illustration en couverture sont publiés sous la licence libre

Creative Commons-BY-SA

http://creativecommons.org/licenses/by-sa/2.0/fr/deed.fr

 BY : Paternité. Vous devez citer le nom de l'auteur original,Ivan GAUTREAU alias Hornos,

des principaux contributeurs comme Didier LAGAERT, alias Didier L et de la communauté
Joomla! France www.joomla.fr

 SA : Partage des Conditions Initiales à l'identique. Si vous modifiez, transformez ou

.

adaptez cette création, vous n'avez le droit de distribuer la création qui en résulte que sous
un contrat identique à celui-ci. En outre, à chaque réutilisation ou distribution, vous devez
faire apparaître clairement aux autres les conditions contractuelles de mise à disposition de
cette création. Chacune de ces conditions peut être levée si vous obtenez l'autorisation du
titulaire des droits.

Version JPLN_1-5_v1.33 – novembre 2010

Joom

la! 1.5 pour les nuls - v1.33 p 2/177

Chapitre : Avant propos

SOMMAIRE

1 AVANT PROPOS 4

2 CONCEPTS DE BASE 7

3 UNE INTRODUCTION A JOOMLA! 14

4 LA BOITE A OUTILS 26

5 VOS PREMIERS PAS AVEC JOOMLA! 35

6 LA GESTION DES ARTICLES 53

7 MODULES, MENUS, COMPOSANTS ET PLUGINS … 77

8 LA GESTION DES UTILISATEURS 106

9 LA CREATION DE VOTRE SITE 118

10 MAINTENANCE ET AUTRES REGLAGES 132

11 L’INSTALLATION DE VOTRE SITE 158

12 HISTORIQUE DES VERSIONS DU DOCUMENT 168

Joom

la! 1.5 pour les nuls - v1.33 p 3/177

Chapitre : Avant propos

1 Avant propos

1.1 Joomla! pour les Nuls : l'aventure continue avec vous

Avec le guide Joomla! pour les Nuls, Hornos a fait un document très apprécié dans la
communauté Joomla! française. Mais il fallait mettre à jour le document pour tenir compte
des nouveautés de la version 1.5 de Joomla!. Nous nous sommes attaqués à ce travail ;
comme nous étions satisfait du travail d'Hornos, nous nous sommes contentés de suivre ses
traces pour cette nouvelle version et nous attendons vos contributions pour améliorer ce
document.

1.2 A qui s’adresse ce manuel ?

 Vous n’êtes pas un spécialiste IT et vous ne voulez pas modifier du code PHP ?

 Vous voulez un site Web sans fonctionnalités particulières et qui marche tout seul ?

Alors ce manuel vous est destiné ! Bien sûr, vous pourrez compléter cette lecture par
d’autres lectures, plusieurs éclairages valent mieux qu’un. Et si vous voulez aller plus loin,
vous aurez les bases nécessaires pour piocher dans les forums et les sites qui parlent de
Joomla!

Si vous voulez déléguer la publication d’articles à d’autres personnes, vous pourrez extraire
de ce document certains chapitres comme le chapitre sur la gestion des articles.

1.3 Avertissement

 Ce document a pour but de donner à tous les moyens de bien commencer avec

Joomla! version 1.5 (versions 1.5.x), en se plaçant toujours du point de vue du
débutant. Nous utiliserons donc volontairement un vocabulaire et une méthode de
travail accessibles à un public de non informaticiens, le tout abondamment illustré par
des captures d’écran.

 Ce document ne se substitue en aucune manière aux documents officiels Joomla!,

mais se veut plutôt comme un document de synthèse des questions de base que se
posent les nouveaux venus dans l’univers Joomla!.

 Les auteurs du présent document et la communauté Joomla! France ne sauraient

être tenus pour responsables des erreurs ou dysfonctionnements constatés lors des
phases de tests ou de mise en production d’un site Joomla! consécutifs à la lecture
de ce document.

 La première version de ce document remonte à plus d’un an et nous n’avons pas pris

le temps de refaire toutes les copies d’écrans avec la dernière version à jour de
Joomla! … Cependant, nous nous efforçons de prendre en compte les évolutions de

Joomla! comme vous pouvez le voir dans le chapitre Historique des versions du

document

 La communauté Joomla! France se réserve le droit de mettre à jour le présent

document ou d’en modifier le contenu à tout moment. Vous trouverez la version la
plus à jour de ce document sur le site d'Aide de http://www.joomla.fr/

en page 168.

.

 Vous êtes par ailleurs invités à signaler tous les problèmes liés au fond ou la forme

de ce document sur le forum http://forum.joomla.fr/

Joomla! 1.5 pour les nuls - v1.33 p 4/177

.

Chapitre : Avant propos

1.4 Remerciements

Certains diront encore des remerciements mais c'est bien là le point fort de la démarche
Open Source : des acteurs plus ou moins anonymes ont travaillé ensemble et bénévolement
pour faire ce beau projet qu'est Joomla!

Nous remercions :

 Les initiateurs du projet Joomla!

 Les équipes de développeurs et de designers qui de par le monde contribuent à

rendre Joomla! toujours plus convivial, simple, performant et évolutif.

 La communauté des utilisateurs de Joomla!

 Les débutants qui inondent les forums de support Joomla! de posts désespérés, car

ils sont intimement convaincus d’avoir fait le bon choix avec Joomla! (et ils ont
raison!) mais ne savent pas par où commencer. Ce sont ces personnes qui ont
suscité la création de ce document.

 Et bien sûr Hornos qui a mené à bien la production de la première version de ce

document.

1.5 Quelle est la structure de ce manuel ?

Ce manuel suit la démarche d'un nouveau développeur qui veut construire son premier site
avec Joomla! :

 nous commençons par une présentation de Joomla! dans le chapitre 2 Concepts de

base

en page 4

 avec le chapitre 3 Une introduction à Joomla! en page 14, nous allons vous

présenter les notions de base de cet outil, vous montrer comment est construite une
page, de votre site, comment fonctionne la page d’accueil, comment classer les
articles, comment gérer les différentes langues, …

 ensuite, dans le chapitre 4 La boîte à outils en page 26, vous trouverez tous les

outils nécessaires pour faire tourner un site Joomla! sur votre micro-ordinateur, PC
ou Mac, et gérer le site chez un hébergeur,

 avec le chapitre 5 Vos premiers pas avec Joomla! en page 35, nous vous

proposons d'installer Joomla! sur votre micro-ordinateur (PC ou Mac), afin que vous
puissiez vous familiariser avec cet outil,

Les choses sérieuses vont ensuite commencer avec la présentation des principales
fonctions de Joomla! :

 Vous allez apprendre à saisir un article avec le chapitre 6 La gestion des articles en

page 53

menus, composants et plugins …

 Avec le chapitre 8 La gestion des utilisateurs en page 106, vous verrez comment

, avant d’apprendre à composer une page avec le chapitre 7 Modules,

en page 77.

créer vos gérer vos utilisateurs – visiteurs authentifiés ou contributeurs – et gérer un
espace privé sur votre site

 Il faut voir ensuite comment personnaliser le look de votre site avec le chapitre 9 La

création de votre site

en page 118, voire même comment migrer un site Joomla! en

version 1.0

 Nous allons ensuite vous présenter des fonctions plus avancées avec le chapitre 10

Maintenance et autres réglages

Joom

la! 1.5 pour les nuls - v1.33 p 5/177

en page 132,

Chapitre : Avant propos

 Une fois que votre site fonctionne bien sur votre micro-ordinateur, c’est le moment de

faire le grand saut et de l’installer chez votre hébergeur, avec le chapitre 11

L’installation de votre site

en page 158.

1.6 Quelques conseils pour commencer avec Joomla !

Créer un site avec Joomla! n’est pas compliqué tant que l’on utilise des fonctions courantes !
C’est un enchaînement d’opérations simples mais il suffit d’un petit problème dans un coin

pour que tout se casse la figure.

C’est pourquoi nous invitons les débutants à suivre la méthode ici décrite :

 Vous commencez par installer un serveur web sur votre micro-ordinateur,

 Vous installez la version de Joomla! avec le jeu d’exemples et vous vous faites la

main en testant les différentes fonctions.

 Ensuite, vous créez une ou plusieurs occurrences de sites Web pour tester différents

templates et différentes extensions … Comme cela, si vous faites une fausse manip
sur un site, ce n’est pas grave ; vous supprimez cette occurrence de site Web (un
répertoire sur votre micro et une base de données) et vous recommencez.

 Une fois que les choses sont plus claires, vous créez votre site sur votre micro-

ordinateur et vous le migrez chez votre hébergeur.

Vous procédez ainsi par étape et lorsque vous découvrez un problème, vous pouvez alors
assez vite savoir si le problème vient des dernières modifications apportées et ainsi trouver
plus facilement la cause.

L’installation de Joomla! sur votre micro-ordinateur est une opération assez aisée si vous
prenez un outil classique pour faire tourner un site Web. Attention ! Vous pouvez avoir de
mauvaises surprises avec certains hébergeurs … Alors, n’hésitez pas à consulter le forum
de Joomla France.

Joom

la! 1.5 pour les nuls - v1.33 p 6/177

Chapitre : Concepts de base

2 Concepts de base

2.1 Introduction

Risquons d’abord la métaphore suivante: vous souhaitez construire une nouvelle maison
mais vous ne savez trop comment vous y prendre. Vous n’avez pas de connaissances en
gros œuvre, en électricité ou encore en décoration, mais vous en avez tellement envie de
cette nouvelle maison ! Vous pourriez tout apprendre vous-même, enfiler le bleu de travail…
et vous tuer à la tâche ! Bon, certains y arrivent, c’est vrai.

Vous avez donc pris contact avec plusieurs maîtres d’œuvre et l’un d’eux a particulièrement
retenu votre attention: il s’occupe du gros œuvre et vous livre une maison modulable où vous
pourrez choisir vous-même l’emplacement des cloisons (pour faire autant de pièces que
vous voulez), et la décoration. Il ne vous reste plus qu’à meubler.

La maison c’est votre site Web, le maître d’œuvre c’est Joomla! (et c’est un bon!), le gros
œuvre c’est l’environnement de travail PHP/MySQL, les cloisons c’est précisément la

modularité de Joomla! (qui vous permettra notamment d’ajouter des composants et des

modules à la structure de l’édifice), la décoration c’est le template (le design de votre site),
quant aux meubles, vous l’aurez deviné, il s’agit du contenu même de votre site.

Et décidément, non content de vous offrir gratuitement une toute nouvelle maison, ce
Joomla! vous livre en plus un rez-de-chaussée habitable ! En clair, un ensemble de
composants, de modules et de templates pré installés qui rendent le site fonctionnel
immédiatement. Pour l’aménagement des étages, c’est à vous de jouer !

2.2 Les fondamentaux

2.2.1 Site statique versus site dynamique

Un site statique est généralement un ensemble de pages pré formatées au format HTML

stockées sur un serveur Web. Aucun traitement n'est effectué du côté du serveur, qui ne fait
qu'envoyer ces pages au navigateur de l'utilisateur final. Le contenu d'un site dit statique est
donc codé en dur dans les pages du site où l'on pourra trouver pêle-mêle du code HTML, du
javascript, du flash, des images et les liens entre les différentes pages sont fabriqués à la
main...

Autant dire que la mise à jour s'annonce délicate voire périlleuse pour qui n'a pas quelques
notions de base en HTML. Certes, il existe des éditeurs HTML, il n'en reste pas moins que la
maintenance d'un tel site est coûteuse en temps et peu flexible sur de gros sites ; ainsi, pour
ajouter une page dans le site, il vous faudra éditer plusieurs fichiers HTML du site. Pour des
sites de quelques dizaines de page, un site statique conviendra tout à fait.

Dans un site dynamique, le contenu du site est stocké dans une base de données (MySQL

par exemple) ; le contenu est dissocié de la fonction de «présentation», c'est à dire la partie
du code en charge de la restitution des données dans le navigateur de l'utilisateur final.

Lorsque le serveur Web reçoit une requête HTTP émise par le visiteur, il interroge la base de
données puis construit une page de résultat qu'il restitue au visiteur via le navigateur.

La page affichée à l'écran dépend du contenu de la base de données, de l'endroit ou se
trouve l'utilisateur voire de son profil (internaute anonyme ou utilisateur identifié par son mot
de passe) et de la dernière action de l’utilisateur (sur quel menu a-t-il appuyé
précédemment ?).

Par exemple, lors de l’ajout d’article, vous n’aurez à ajouter manuellement un lien vers un
article fraîchement créé. Tout ce traitement est effectué par le serveur Web qui génèrera une

Joom

la! 1.5 pour les nuls - v1.33 p 7/177

Chapitre : Concepts de base

liste des articles de votre site avec un lien vers le nouvel article. Vous l'aurez compris, avec
Joomla! votre site sera dynamique!

2.2.2 PHP/MySQL

Prenons un simple tableau ; en première ligne on trouve ce qu’on appelle des champs (Nom,
Prénom, Email…), les lignes suivantes s’appellent des enregistrements, le tout formant une
table. Une base de données MySQL est une table ou plus souvent un ensemble de tables
qui permettent de stocker des informations (ici une liste d’utilisateurs mais il peut s’agir de
n’importe quel autre type d’information).

Un exemple de table dans une base de données

Nom Prénom email Date de naissance Pays

LOTTER Quentin [e-mail] 01/04/55 France

PARIZZI Cecilia [e-mail] 23/12/72 Italie

EUVAL Hector [e-mail] 25/09/65 Belgique

Vous connaissiez peut-être Oracle ou encore Microsoft SQL (SQL 2008) ... et bien MySQL
fonctionne sur le même principe à cette différence près qu’il est gratuit, et qu’il est très utilisé
en environnement Web.

Et PHP dans tout ça ? Et bien PHP est un langage de programmation qui va permettre
d’aller interroger cette table ou modifier (en ajout, édition ou suppression) son contenu, via
des morceaux de scripts intégrés à des pages web (ces scripts sont des requêtes SQL).
Toute cette cuisine se fait directement sur le serveur qui héberge votre site.

Et comment on fait ça quand on n’y connaît rien ? On ne fait rien ! Joomla! s’occupe de tout
(ou presque), de la création des tables lors de l’installation, jusqu’au moindre bout de code
qui va par exemple permettre d’afficher sur une page web la liste des articles que vous aurez
écrits.

2.2.3 HTML, XHTML, CSS et W3C

Autant vous pourrez très bien vous en sortir dans l’univers de Joomla! sans connaissances
en PHP/MySQL, autant les connaissances en HTML/XHTML et CSS s’avèreront très vite
indispensables si vous souhaitez personnaliser l’apparence de votre site (le template). Rien
d’insurmontable toutefois ; vous trouverez en librairie et essentiellement sur le web toutes les
ressources nécessaires (tutoriaux, documentation, exemples) pour acquérir les rudiments du
HTML/XHTML et du CSS.

Le HTML est un langage «balisé» qui permet de mettre en forme des informations sur une

page web. Vous souhaitez par exemple afficher un mot en gras sur une page web, pour ce

faire vous devrez insérer ce mot entre les balises b et /b mises entre crochets, soit <b> texte

</b> :

Je ne peux pas taper ici les crochets car comme ce texte est en html, vous ne
les verriez pas ... Il doit y avoir un truc que je ne connais pas encore.

Vous souhaitez par ailleurs structurer l’affichage de votre page sous forme de tableau, le
HTML vous permettra de le faire à l’aide des balises <table>, <tr>, <td> ,</td>, </tr>,
</table>.

Joom

la! 1.5 pour les nuls - v1.33 p 8/177

Chapitre : Concepts de base

Le langage XHTML est la nouvelle norme du W3C pour la conception de pages Web. Il s'agit

en fait d'un encodage plus strict du langage HTML, s'appuyant sur les spécifications du XML.

Le CSS est un langage qui permet de définir et de contrôler les styles d’affichage de toutes

les pages web d’un site depuis un seul fichier : la feuille de style.

 Sans feuille de style il faudrait par exemple définir pour chaque page d’un site que je

souhaite que les liens hypertextes passent en couleur jaune et en souligné lorsqu’ils
sont survolés… Que se passe t-il si, le lendemain, je décide finalement que les liens
survolés doivent désormais passer au vert ? Eh bien il faut rééditer toutes les pages
web de votre site.., pas très pratique.

 Tandis que si nous précisons pour chaque page web du site l’emplacement et le nom

de la feuille de style qui sera utilisée, nous faisons la modification dans la feuille de
style et elle s’applique automatiquement à toutes les pages web du site.

Joomla! utilise un ensemble de fichiers pour gérer le design de votre site, placé dans un
sous répertoire du template que vous avez choisi.

Le W3C (World Wide Web Consortium, http://www.w3.org

) est une organisation
internationale fondée en 1994 qui se propose de définir et de proposer des normes
(spécifications ou recommandations) techniques afin de standardiser les technologies et
protocoles utilisés sur le Web.

Si ses premières recommandations concernaient les normes de présentation du langage
HTML, sa mission s'est ensuite élargie à d'autres technologies (XML, XHTML, XSL, CSS...)
ainsi qu'aux champs liés à l'interaction entre le Web et ses utilisateurs (accessibilité,
utilisabilité, mobilité...).

Le W3C est composé d'environ 450 membres (sociétés commerciales, fondations,

universités...) dont la liste est consultable à cette adresse:

http://www.w3.org/Consortium/Member/List

.

On y trouve pêle-mêle Google, Inc, la Fondation Mozilla ou les plus inattendus France
Telecom et Microsoft Corp,. !!

Quel est le rapport avec Joomla! ? Et bien en tant que webmaster, vous devenez acteur du
web non? Alors autant se conformer tout de suite aux préconisations de nos experts du
W3C! Vous pourrez vous amuser (ou pleurer) en passant par exemple votre site au W3C
Validator.

2.3 Qu'est ce que Joomla! ?

Joomla! est un outil de gestion de contenu (en anglais, CMS, pour Content Management

system) Open Source sous licence GNU/GPL créé par une équipe internationale de
développeurs récompensée à maintes reprises.

Joomla! est chapeauté par Open Source Matters , Inc., organisation à but non lucratif basée
aux Etats-Unis dont la mission est de fournir une structure légale et financière au projet. Les
statuts de l'organisation sont consultables sur http://www.opensourcematters.org

Et un CMS, c'est quoi ?

Pour faire simple, un CMS (système de gestion de contenu) est un logiciel web qui permet
de créer un site Internet dynamique en toute simplicité, sans connaissances techniques
particulières, l'idée étant de séparer la forme du contenu : vous saisissez un article et

Joom

la! 1.5 pour les nuls - v1.33 p 9/177

Chapitre : Concepts de base

Joomla! s’occupe de le publier au bon endroit avec la bonne mise en page ! Bon c'est
toujours pas clair ? Prenons une bagnole ; n'importe qui est capable d'en conduire une sans
pour autant être mécanicien non ? CQFD

S'il est d'abord orienté gestion de contenu, c'est-à-dire destiné à mettre en ligne des articles
et des news, Joomla! peut en quelques clics être " détourné " en portail, site de boutique en
ligne, site communautaire, site personnel, etc., ce grâce aux centaines d'extensions
disponibles sur le web.

Voici un site qui recense quantité de CMS et autres logiciels de blog, groupware, forum ou
encore wiki : http://www.opensourcecms.com/

. Vous pourrez tester les démos en ligne, ou,
si vous avez le temps, les installer sur votre PC, ce que nous allons faire plus loin dans ce
document pour Joomla!

Que se cache-t-il derrière ce nom?

Joomla! est la transcription phonétique d'un mot swahili qui signifie "tous ensemble", ou
encore "en un tout". Le choix s'est porté vers ce nom car l'intégralité de l'équipe de
développement était unanime dans la volonté de protéger les intérêts des créateurs et de la
communauté.

Joomla!, le nom et le logo sont protégés. Vous pouvez utiliser le logo Joomla! Sous réserve
de respecter les règles d'utilisation décrites dans le Brand Manual:

http://www.joomla.org/content/view/259/70/

.

Combien ça coûte ?

En tant qu’utilisateur final (particulier, association ou entreprise commerciale) il ne vous en
coûtera rien d’utiliser Joomla! et/ou d'en modifier le noyau. Joomla! est un logiciel libre sous
licence GNU/GPL. Vous trouverez plus de détails sur les règles d’utilsation à l’adresse
suivante : http://www.gnu.org/licenses/gpl.html

En aucun cas une entreprise commerciale ne peut vendre une licence d'utilisation Joomla!
ou encore tout ou partie du code source. En revanche elle a tout à fait le droit de vendre une
prestation basée sur Joomla! (Installation, configuration, formation...) et d’en modifier le
noyau pour les besoins d’un client, ou encore de vendre des extensions (composants,
templates...) développés spécifiquement pour Joomla!

Et Joomla! c'est qui ?

On peut distinguer 5 catégories de joomlistes (joomlers ? joomladdicts ? …) :

 La Core Team : équipe officielle des développeurs du noyau Joomla!. Elle se charge

de maintenir et de faire évoluer Joomla!. La liste des membres est consultable sur le
site officiel (http://www.joomla.org

).

Autour de la Core Team sont organisés des groupes de travail dont les missions sont
entre autres choses axées sur la sécurité, les performances, l'accessibilité…

 Les Translation Partners : équipes de traductions officielles organisées par langue,

elles ont pour mission première de fournir une traduction de l'aide en ligne de Joomla!

Joom

la! 1.5 pour les nuls - v1.33 p 10/177

Chapitre : Concepts de base

Par extension, ce sont souvent ces mêmes équipes qui réalisent la traduction des
libellés dans le logiciel, voire des extensions tierces.

 Les Développeurs d'extensions tierces : Joomla! intègre nativement un certain

nombre d'extensions, volontairement limité pour ne pas surcharger le package
d'installation. L'une des grandes forces du projet Joomla! c'est le nombre important
d'extensions tierces mis à disposition par des développeurs, amateurs ou
professionnels. Galeries d'images, forums, générateurs de formulaire, e-commerce,
templates… l'éventail des extensions tierces vous permettra de vous tailler un site sur
mesure !

 Les Portails communautaires : ces sites web n'ont rien d'officiel, ils sont le plus

souvent animés par des passionnés de la première heure qui n'ont d'autre ambition
que de " partager " en mettant à disposition des utilisateurs finaux toutes les
ressources (forums, téléchargements d'extensions et de templates, news, base de
connaissance…) pour mettre en oeuvre un site motorisé par Joomla!

 Les Utilisateurs finaux : webmasters amateurs ou professionnels, rédacteurs…, ben

là c'est vous, nous !

Et bien sûr, toute la communauté francophone se
regroupe autour de l’AFUJ, l’association francophone
des utilisateurs de Joomla!. C’est une association à
but non lucratif, régie sous la loi 1901. Elle a pour
vocation de faire connaître le cms Joomla!™ à travers
son portail www.joomla.fr

, le Joomladay, les
Joomlapéros et des événements tels les salons sur
logiciels libres.

2.4 La version Joomla! 1.5

2.4.1 Les évolutions apportées par la version 1.5

En fin décembre 2007, nous avons vu arriver la première version stable de Joomla! 1.5.
C’est une évolution majeure de Joomla! avec une séparation du code, du contenu et des
libellés qui apparaissent dans les différentes fonctions.

Les composants fournis avec le programme Joomla! respectent les normes MVC (Modèle
Vue Contrôleur) ; pour tous ces composants et les extensions qui respectent ces normes,
vous pouvez, dans un template donné, modifier la mise en page de cette extension, sans
changer le code Joomla!

Cette évolution offre de nouvelles possibilités pour :

 la gestion graphique de votre site, en augmentant les possibilités de rendu du

contenu, mais aussi une adaptation du contenu en fonction du terminal (pda,
téléphone, ordinateur...).

 l’internationalisation (prise en compte des langues étrangères), avec l’utilisation de la

norme utf8 pour le codage des textes. Joomla! s’ouvre ainsi à toutes les langues du

monde (ou presque) en acceptant les différentes formes d’écriture – par exemple
l'écriture de droite à gauche pour les langues arabes et hébraïques - et vous pouvez
même gérer des sites multilingues.

Joom

la! 1.5 pour les nuls - v1.33 p 11/177

Chapitre : Concepts de base

>> Pour plus d’informations, consultez le chapitre L’encodage des caractères en
page 23

 le développement de nouvelles extensions. Le framework proposé est plus flexible et

plus facile à gérer…

Voici une liste d’autres évolutions apportées par la version 1.5 :

 l’amélioration de l’ergonomie, des outils d’administration et du fonctionnement global

de Joomla!

 l’intégration des applications externes par des Services Web et l'authentification à

distance telle que le Lightweight Directory Access Protocol (LDAP).

Il existe déjà bien des extensions – modules, composants, plugins et templates –
développées pour la version 1.5. Pour assurer la compatibilité avec les versions précédentes
des composants et des modules développés pour la version 1.0, l’équipe Joomla! a
développé le module legacy qui convertit du code Joomla! 1.0 en code Joomla! 1.5 …

ATTENTION :

 La nouvelle version 1.6 ne supportera pas les extensions développées pour la

version 1.0 … Alors choisissez plutôt une extension développée pour la version 1.5 !

2.4.2 Versionning

Les numéros de version suivent une convention de type X.Y.Z (par exemple 1.5.3) où:

 X = Numéro majeur - Changement important dans le code source de Joomla!.

L'incrémentation de ce numéro peut introduire une incompatibilité avec les versions
inférieures (par exemple, Joomla! 2.0.0 ne sera peut-être pas compatible avec
Joomla! 1.0.12).

 Y = Numéro mineur - Changement significatif en termes de fonctionnalités et

d'architecture avec un risque d'incompatibilité des versions inférieures modéré à
haut.

 Z = Numéro de stabilité (ou maintenance) - Résolution de bugs (sécurité ou

fonctionnels) et, occasionnellement, introduction de légères améliorations
fonctionnelles. La compatibilité avec les versions inférieures est totale.

2.4.3 Les sites de téléchargement de Joomla!

 Le seul site officiel reconnu par toute la communauté Joomla! est le site

http://www.joomla.org

mais aussi, dans l’espace Communautés, tous les nouvelles de par le monde et les
packages langues : http://community.joomla.org/
disposition sont garanties par Joomla! et Open Source Matters.

où vous trouverez des packages intégrant la langue anglaise

. Les versions mises à votre

 Les francophones préfèrent télécharger leur version à partir du site

http://www.joomla.fr

; vous y trouvez les distributions francisées avec quelques fois la
prise en compte de correctifs survenus après la sortie de la version officielle sur le
site joomla.org. Ce travail est assuré par la Communauté francophone qui comprend
des membres de la Core Team de Joomla!

Joom

la! 1.5 pour les nuls - v1.33 p 12/177

Chapitre : Concepts de base

2.4.4 Roadmap

En informatique, la roadmap est la feuille de route qui se présente généralement sous forme
de tableau où sont annoncées les dates de sortie des différentes versions du logiciel. La
roadmap de Joomla! est définie et mise à jour par la Core Team.

Rappelez vous que les développeurs du code source Joomla! sont des bénévoles qui
cumulent pour la plupart cette activité en plus d'une activité professionnelle habituelle.

Aujourd’hui la version 1.5 est mature et il ne devrait plus y avoir d’évolutions majeures, juste
quemques mises à jour concernant la sécurité.

En novembre 2010 sortait la version bêta 14 et on peut espérer une verion RC - Release
candidate – pour le premier semestre 2011.

Joom

la! 1.5 pour les nuls - v1.33 p 13/177

Chapitre : Une introduction à Joomla!

3 Une introduction à Joomla!

3.1 Introduction

Avant de se lancer dans la mise en œuvre de Joomla! et sa configuration, nous avons
préféré vous présenter Joomla! avec son vocabulaire, les concepts de base et quelques
exemples afin que vous ayez les points de repère suffisants pour poursuivre votre lecture.

3.2 Les notions de base

3.2.1 La terminologie Joomla!

Voici une liste des termes les plus fréquemment utilisés dans la planète Joomla!, qui vous
aidera à mieux appréhender son fonctionnement:

 Article : un article est une unité de contenu. Il comprend généralement du texte, des

images et des liens ; il a certaines caractéristiques comme un titre, un auteur, une
date de publication et tout un tas de paramètres qui seront décrits plus loin.

Un article est placé dans une rubrique, elle-même fait partie d’une section. Mais il
existe des articles non catégorisé – appelés articles statiques dans les précédentes
versions de Joomla.

 Menu : c’est une liste d’éléments, disposés de façon verticale ou horizontale selon le

module choisi pour l’afficher et sa configuration. L’appui sur un élément du menu
provoque l’affichage d’une page avec ses modules et ses composants …

 Page d’accueil : c’est la première page que voit un visiteur lorsqu’il saisit le nom de

votre site.

 Administration : la partie administration – ou backend - est l’arrière-boutique de

votre site ; l'interface d’administration va permettre de créer et mettre à jour vos
articles mais aussi de gérer tout votre site.

 Site : La partie Site - ou frontend - c’est la boutique, ce que voient les visiteurs qui

viennent sur votre site.

 Cache : pour rendre plus rapide l'affichage des pages de votre site, les éléments les

plus souvent demandés (logos, images, page d'accueil) sont stockés dans un
répertoire intermédiaire, encore appelé cache. Lorsqu'un utilisateur veut consulter
une page comprenant un élément en cache, Joomla! n'a plus besoin d'aller le
chercher dans la base de données ou un répertoire du site, il le prend directement
dans le cache.

Le cache est mis à jour régulièrement mais si vous avez fait des mises à jour
importantes de votre site, il vaut mieux nettoyer votre cache, c'est à dire supprimer

tous les fichiers mis dans le cache, au travers de l’interface d'administration.

 Core team (CT): la Core Team est l'équipe de bénévoles en charge du

développement du code source et de l'organisation générale du projet Joomla! Elle
est à ce jour composée d'une quinzaine de membres (développeurs et anglophones
pour l'essentiel).

 Editeur WYSIWYG : comme son nom l’indique, il s’agit d’un éditeur qui va permettre

de rédiger et de mettre en forme du texte comme vous le feriez avec un traitement de
texte (What You See Is What You Get), sans vous soucier du code html sous-jacent.

Joom

la! 1.5 pour les nuls - v1.33 p 14/177

Chapitre : Une introduction à Joomla!

 Publier / dépublier : encore une notion importante à intégrer. Il s’agit de rendre

visible ou pas sur le site un article, un lien dans un menu, un module entier, une
section, une catégorie, un article. Pour un article, il est par ailleurs possible de définir
un calendrier de publication, date à partir de laquelle ou jusqu’à laquelle un article
sera publié.

3.2.2 Les extensions

Joomla! est un outil de gestion de contenu assez sophistiqué qui s’appuie sur des
extensions, c'est-à-dire des programmes complémentaires pour gérer la mise en forme ou
ajouter des nouveaux services . Ces extensions sont classées en 4 catégories : les
composants, les modules, les plugins et les templates. La version standard de Joomla!
intègre un certain nombre d’extensions mais vous en trouverez quelques milliers sur le net
pour personnaliser votre site !

 Composant : c’est une mini application intégrée à votre site Joomla, qui dispose de

sa propre interface de configuration dans la console d’administration Joomla.
Ainsi à chaque fois qu’une page est chargée, Joomla fait appel à un composant pour

générer le corps de la page ; de même, il existe un composant pour authentifier les
utilisateurs … Les composants constituent la majeure partie de vos pages ! Les
composants de base sont fournis avec Joomla!. d’autres composants peuvent être
facilement installés par la suite (forums, livre d’or, galerie d’images, gestionnaire de
newsletter, gestionnaire de formulaires… et bien d’autres encore).

Exemple : com_content (gestion des contenus) et com_registration (enregistrement

des utilisateurs)

 Module : pour faire simple, un module est un bloc que l’on trouvera généralement

autour du corps de la page web, par exemple dans la colonne de gauche ou la
colonne de droite de notre site. Ainsi le menu de gauche de votre site est placé dans
un module ! De même que la bannière en haut de votre site, le bas de page ou le
module d’identification …

Les modules sont souvent associés à des composants, comme par exemple le
module qui affiche une photo aléatoire tiré d’une galerie d’images géré par un
composant.

Exemple : mod_banners (affichage des bannières), mod_mainmenu (affichage d’un

menu)

 Plugin : ce sont des morceaux de code activés sur un évènement. L'exécution de

n'importe quelle partie de Joomla, que ce soit le noyau, un module ou un composant,
peut déclencher un évènement et alors les plugins associés à cet événement
s’exécuteront.

Par exemple, le plugin de recherche content.searchbot est un script qui permet

d’effectuer une recherche sur tout votre site.

Autre exemple, quand vous saisissez le texte d’un article, le plugin TinyMCE

permettra de convertir le texte que vous saisissez en code HTML interprétable par
votre navigateur : un évènement est l’appui sur une touche du clavier, l’action est la
génération du code html adéquat.

Joom

la! 1.5 pour les nuls - v1.33 p 15/177

Chapitre : Une introduction à Joomla!

 Template : un template gère toute la partie graphique de votre site : les couleurs des

caractères et des fonds, la police des caractères, les cadres, les menus ... En
changeant de template, vous changez le « look and feel » de votre site.

Il en existe des centaines, disponibles gratuitement sur des sites qui se sont
spécialisés dans cette activité. Nous verrons plus loin comment installer et
personnaliser un template. Le terme template est l'équivalent de skin, thème ou
encore gabarit dans d'autres CMS. Les templates proposés par défaut avec Joomla!

sont rhuk milkyway, beez, et JA Purity …

3.2.3 Comment ça marche

Voici un petit schéma simplifié pour vous expliquer comment Joomla! génère une page :

la page vue par l’internaute

template

fichiers libellés



feuille de style

CSS

modules



zones ou positions





 

articles, composants,



plug-ins, menus …



La page qui apparaît sur le navigateur
s’appuie sur un template

Le template définit différentes zones

dans la page autour du corps de la
page

Le template s’appuie sur des feuilles de

style pour l’affichage du texte sur les
différentes pages du site

Dans chaque zone, on trouve différents

modules

Selon les cas, les modules de la page

font appel à un composant, un plug-in,
un menu, un article

La valeur des différents libellés est

stockée dans des fichiers (voir plus loin)

base de données

Les composants, plug-ins, menus,

articles vont chercher leurs données
dans la base de données.

3.3 Un exemple

3.3.1 Modules et composants

Comment s’articulent ces différentes notions ? Nous allons vous l’expliquer au travers d’un
exemple : la page d’accueil du site fourni par défaut avec Joomla!

Joom

la! 1.5 pour les nuls - v1.33 p 16/177

Chapitre : Une introduction à Joomla!

C’est un site basé sur le jeu d’exemples fourni avec le package Joomla! et réalisé avec le

template rhuk milkyway.
Dans cet écran, le corps de la page commence avec le titre Welcome to the Front page et

contient l’affichage de plusieurs articles en mode blog. Autour de ce corps de page, le
template définit plusieurs zones – ou positions - dans lesquelles vous allez pouvoir placer les
modules que vous voulez :

 En haut, la position top contient un module Newsflash qui affiche au hasard un

article choisi parmi les nouvelles.

 En dessous la position user3 contient un module Top Menu (un module de type:

mod_mainmenu) qui affiche un menu.

 La position breadcrumb contient le module Breadcrumb qui affiche le Fil d’Ariane,

un beau nom pour vous rappeler où vous êtes dans le site,

 La position user4 contient un module Search qui vous permet de rechercher un

article dans votre site ; si vous tapez Joomla! dans la fenêtre de saisie et que vous
appuyez sur le bouton Recherche, c’est un plugin qui va analyser votre saisie et
lancer la recherche, ou du moins activer le composant qui fait la recherche ...

 A gauche, à la position left, vous voyez 4 modules : 3 modules pour afficher un

menu et un module d’identification,

 En haut, la position user1 contient un module qui affiche les derniers articles publiés
 A côté, la position user2 contient un module qui vous affiche la liste des articles les

plus consultés

Joom

la! 1.5 pour les nuls - v1.33 p 17/177

Chapitre : Une introduction à Joomla!

 A droite, dans la position right, nous avons un module de sondage, un module qui

affiche le nombre de visiteurs …

Et bien sûr, au milieu, vous trouvez le corps de la page, coincé entre les modules ; c’est le
composant qui affiche une sélection d’articles en mode blog.

Cette page vous semble bien chargée ... c’est normal car les concepteurs du template ont
voulu vous montrer toutes les potentialités offertes par leur template. Mais il suffit de
dépublier certains modules pour libérer de la place et laisser ainsi plus de place au
composant qui gère l’affichage des articles !

Ainsi, pour un site simple, j’ai fait les choix suivants :

 Pas de module en position top, afin d’afficher une image plus grande en haut de la

page,

 Pas de module en position right, user1 et user2 …

3.3.2 La page d’accueil

Nous avons écrit que Joomla! construit la page affichée à l’écran d’après l’action réalisée par
l’internaute (sélection d’un élément de menu, activation d’un module …).

Alors que se passe t-il la première fois quand l’internaute se connecte sur le site en
saisissant le nom de domaine dans sa barre de navigateur ? Tout se passe comme si

l’internaute avait sélectionné l’élément de menu défini par défaut dans le menu Main menu.

Dans la configuration par défaut, le concepteur du template a retenu comme élément par

défaut Home, l’élément de menu Page d’accueil en mode blog . Dans l’interface

d’administration, vous disposez d’un outil pour sélectionner les articles à afficher avec ce
composant.

Bien sûr, vous pouvez toujours, dans le menu Main menu choisir un autre composant à

afficher par défaut, un texte au format html par exemple. Et vous pouvez choisir d’affecter le

composant Page d’accueil en mode blog à un autre élément de menu pour présenter une

sélection d’articles de votre site.

3.4 Quelques autres fonctions

3.4.1 La classification des articles

Section / Catégorie / Article

Pourquoi classer vos articles ? Parce que ce choix conditionne la publication de vos
contenus : souvent une page de votre site contient l’affichage d’un article, des articles d’une
catégorie ou des articles d’une section.

Autrement dit, l’appui sur un élément de menu provoque souvent l’affichage des articles

d’une catégorie ou d’une section, sous forme d’une liste ou d’un mode blog et Joomla! vous

permet de choisir quelques informations à afficher – le titre, le résumé, l’auteur, … - et l’ordre
d’affichage des différents articles.

Comme un exemple vaut mieux qu’un grand discours, nous vous proposons de construire un
site pour présenter vos plus beaux voyages dans les grandes villes du monde et vous
proposer de les classer par continent et par pays ... Vous avez commencé par l'Asie et
l'Amérique du Sud et voici le résultat :

Joom

la! 1.5 pour les nuls - v1.33 p 18/177

Chapitre : Une introduction à Joomla!

Un exemple de sections, de catégories et d'articles

Sections Catégories Articles

Tokyo

Asie

Amérique du Sud

Japon

Chine

Chili

Argentine

Bolivie

Hokkaido

Kyoto

Pekin

Guangzhou

Nanjing

Shenzhen

Santiano du Chili

Arica

Puerto Monte

Buenos Aires

Salta

Ushuaia

La Paz

Santa Cruz

Potosi

Copacabana

Nous avons 2 sections Asie et Amérique du Sud ; dans la section Asie, 2 catégories,
Japon et Chine ; et dans la catégorie Japon, 3 villes ... Avant de rédiger et de publier un
article sur Kyoto, il faudra donc créer une section Asie, dans laquelle nous créerons une
catégorie Japon, laquelle servira à stocker tous les articles liés aux villes du Japon.

3.4.2 La gestion des langues

Vous pensez bien que les petites phrases (Nom d'utilisateur, Lire la suite ...) ne sont pas
codées en dur ! Les programmes font appel à des étiquettes et selon la langue que vous
avez choisie, Joomla! va chercher dans le bon fichier le libellé qui correspond à l’étiquette.

Pour la partie Site, le répertoire language contient un sous répertoire par langue et par

pays :

 Répertoire en-GB pour l’anglais parlé en Grande Bretagne
 Répertoire fr-FR pour le français parlé en France,

 …

Chaque sous répertoire contient pour chaque élément du code (composant, module, plgin,
template …) un fichier ini qui contient les étiquettes et le libellé correspondant dans la langue
retenue.

Joom

la! 1.5 pour les nuls - v1.33 p 19/177

Chapitre : Une introduction à Joomla!

Ainsi les premières lignes du fichier fr-FR.ini sont les suivantes :

# Months

JANUARY_SHORT=Jan
JANUARY=Janvier

Si la langue française est retenue pour l’affichage d’une page, lorsque Joomla!
rencontrera dans le code l’étiquette

JANUARY, il affichera le libellé Janvier.

 Les fichiers commençant par fr-FR.com contiennent les libellés associés à un

composant ; par exemple, le fichier fr-Fr.com_contact.ini contient les libellés du

composant qui permet au visiteur d’envoyer un mail à un contact.

 Les fichiers commençant par fr-FR.mod contiennent les libellés associés à un

module ; par exemple, le fichier fr-Fr.mod_login.ini contient les libellés du module

d’authenfication.

 Les fichiers commençant par fr-FR.plg contiennent les libellés associés à un plugin ;

par exemple, le fichier fr-Fr.plg_search_contacts.ini contient les libellés du plugin qui

permet de faire une recherche dans la liste des contacts.

 Les fichiers commençant par fr-FR.tpl contiennent les libellés associés à un

template ; par exemple, le fichier fr-Fr.tpl_rhuk_milkyway.ini contient les libellés du

template rhuk_milkyway.

Pour la partie administration, les fichiers ini sont placés dans un sous répertoire en fonction
de la langue choisie, sous le répertoire administrator/language.

Ces fichiers sont codés selon la norme utf8 décrite ci-après dans le chapitre Le codage des

caractères.

3.4.3 Pour aller plus loin …

Vous trouvez que les fonctions proposées par la version de base de Joomla! sont un peu
limitées, vous voulez ajouter de nouvelles fonctionnalités, alors consultez le catalogue des
extensions sur http://www.joomla.fr/

Faire un choix pertinent s’avère très difficile. Nous nous contenterons de vous présenter ici
les fonctions les plus courantes avec quelques noms d’extensions … afin que vous ayez
quelques points de repère dans vos recherches.

Galeries de photos

Pour afficher plusieurs séries de photos – ou d’images – avec notamment l’affichage de
vignettes : l’écran affiche une photo à échelle réduite, vous cliquez dessus et une fenêtre
s’ouvre avec l’image en plein format.

Les classiques : Phoca Gallery, MorfeoShow, JoomGallery …

Sauvegarde du site

Cet outil permet de faire une photo du site, de copier tous les fichiers de données qui
personnalisent votre site dans un fichier compressé que vous récupérez sur votre micro-

; il parait qu’il y en a plus de 6 000 !

Joom

la! 1.5 pour les nuls - v1.33 p 20/177

Chapitre : Une introduction à Joomla!

ordinateur. En cas de problème sur votre site, vous ré installez le programme et vous
restaurez les données à partir de la dernière sauvegarde.

Les classiques : Akeeba (le successeur de JoomlaPack)

Téléchargement

Pour mettre à disposition des documents au format pdf ou dans un autre format bureautique,
des programmes, avec des gestions de groupe …

Les classiques : Remository (très complet) ou RokDownloads

Editeurs

Pour ajouter de nouvelles fonctions lors de la saisie des articles ou personnaliser l’éditeur en
fonction des groupes d’utilisateurs.

Les classiques : JCE, FCK Editor

Formulaires

Si le formulaire de contact ne vous convient pas, si vous voulez faire des formulaires
personnalisés … Attention la manipulation de ces outils peut s’avérer délicate.

Les classiques : CKForm, ChronoForms, QuickForm

Newletters

Pour envoyer des lettres d’informations à des utilisateurs enregistrés. Dans votre lettre
d’informations, vous insérez des liens vers les articles de votre site et vous créez ainsi de
l’audience !

Les classiques : Communicator, Acajoom News, AcyMail …

Communautés, Forum, wiki

Les classiques : Community Builder, Kuena, …

Site multilingue

Un incontournable : Joom!Fish

Indexation et plan de site

Cet outil permet d’afficher le plan de votre site aux visiteurs mais aussi un plan de site ­sitemap – à fournir aux moteurs de recherche

Les classiques : Xmap …

Agenda, gestion des évènements

Pour avoir un calendrier sur votre site pour annoncer les prochains évènements

Les classiques : JEvents, EvenList, …

Commerce en ligne

Pour faire un site marchand !

Les classiques : la référence VirtueMart, avec des livres complets dessus ; un produit plus
limité : RokQuickCart

Joom

la! 1.5 pour les nuls - v1.33 p 21/177

Chapitre : Une introduction à Joomla!

3.5 Quelques autres informations utiles

Il ne s'agit pas ici de vous faire un cours complet sur le Web mais de vous donner quelques
points de repères ...

3.5.1 Site local et site distant

La plupart d’entre vous vont faire héberger leur site Web chez un prestataire extérieur : c’est

ce que nous appelons le site distant.

Par contre, pour construire votre site, nous allons vous montrer comment installer sur votre

micro-ordinateur une copie de votre site Web, que nous appelons site local. Ce site n’est

pas visible par les autres internautes, les performances du site installé sur votre micro­ordinateur sont très limitées mais c’est suffisant pour tester votre site avant de l’installer sur
le site distant.

3.5.2 Le nom de domaine

Sur Internet, chaque site est identifié par une adresse IP (de la forme xxx.yyy.zzz.ttt avec
pour chaque nombre une valeur comprise entre 0 et 255). Comme c'est trop compliqué pour
s'en souvenir, vous allez donner un nom à votre site, le nom de domaine, de la forme
www.monsite.com.

C'est une société tierce, comme Gandi, ou votre hébergeur qui va gérer votre nom de
domaine. Et, lorsqu'un internaute va saisir l'adresse de votre site, c'est cette société qui va
donner les informations nécessaires pour associer la bonne adresse IP ; cette opération se
fait au travers d'un serveur de nom de domaine, encore appel DNS.

3.5.3 Le langage XHTML

Le langage XHTML est la nouvelle norme du W3C pour la conception de pages Web. Il s'agit

en fait d'un encodage plus strict du langage HTML, s'appuyant sur les spécifications du XML.
Pour être conformes à la norme XHTML, vos pages Web devront désormais respecter ces

quelques règles:

 Le document doit être ouvert avec un DOCTYPE et un espace de nommage

(namespace)

 Le document doit comporter au minimum les éléments de structure html, head et

body.

 Les balises doivent être écrites en minuscules.
 Les valeurs des attributs doivent toujours être écrites entre des guillemets, y compris

pour des valeurs numériques.

 Les balises d’images IMG doivent toujours comporter l’attribut alt pour le texte

alternatif.

 A toute balise d’ouverture doit correspondre une balise de fermeture.
 Les balises uniques doivent également être refermées.
 Les balises doivent être correctement imbriquées.
 Les notations compactes ou raccourcies dans les attributs ne doivent pas être

utilisées.

 L’attribut ID sera préféré à l’attribut NAME pour identifier les éléments A, APPLET,

FRAME, IFRAME, IMG, et MAP.

Bon, si vous n'avez pas tout compris, pas d'affolement, vous pourrez quand même continuer
l'aventure Joomla! Vous trouverez toutes sortes d'informations complémentaires sur le web
et notamment sur l'excellent http://openweb.eu.org

.

Joom

la! 1.5 pour les nuls - v1.33 p 22/177

Chapitre : Une introduction à Joomla!

3.5.4 L’encodage des caractères

A côté des caractères ordinaires – les lettres de l'alphabet et les chiffres -, il existe tout un
tas de caractères qui font la richesse d'une langue : caractères accentués, caractères
spéciaux ( &, @, ° ...), idéogrammes, symboles …

Au début de l’informatique, les informaticiens proposèrent un encodage de base qui
reprenait les caractères disponibles sur un clavier de machine à écrire en version anglaise,

avec les normes ANSI ; avec cette norme, chaque caractère était codé sur un octet. Mais,

tout comme pour les machines à écrire – et les claviers -, il fallut définir une version de
caractères par langue européenne : ce sont les jeux de caractères définis par les normes

ISO : jeu de caractères latin, cyrillic ... D’autres normes ont été créées pour traiter les

idéogrammes.

Enfin vint la norme UTF8 qui permet d’encoder tous les caractères quelqu’ils soient. Les

caractères les plus courants dans les langues européennes sont codés sur un octet, les
autres sur plusieurs octets. Cela nécessite d’implanter les polices de caractères adaptées
pour l’affichage ou l’impression des caractères, mais heureusement la plupart d’entre elles
sont disponibles.

Bien sûr, vous imaginez les difficultés pour coder avec un éditeur ordinaire des caractères

selon la norme UTF8 … Heureusement, Joomla! vous propose dans l’interface
d’administration un éditeur WYSIWYG Tiny MCE qui vous cache toute cette complexité.

Un exemple avec l’affichage des premières lignes du fichier fr-FR.ini ; après le mois de

Janvier, c’est le mois de Février, mot qui contient un caractère accentué :

 Affichage avec un éditeur qui ne gère pas l’affichage des caractères à la norme utf8 :

vous voyez que le caractère é est codé sur 2 octets

FEBRUARY_SHORT=Fév
FEBRUARY=Février

 Affichage avec un éditeur qui supporte la norme UTF8.

FEBRUARY_SHORT=Fév
FEBRUARY=Février

En conclusion :

 Les données stockées dans la base de données et les libellés – fichiers langue - en

format UTF8.

 A chaque fois que vous créez un item – menu, élément de menu … - Joomla! se

charge de créer un alias en reprenant le titre que vous avez choisi et en remplaçant
les caractères spéciaux par le caractère ANSI le plus proche ; pour les alphabets
latin-x (jeux d’alphabets couvrant la plupart des langues européennes), cette
opération est appelée translieration.

 Lorsque vous allez déposer des images, des documents sur votre site, veuillez à leur

donner un nom sans blanc et sans caractères spéciaux.

3.5.5 La gestion des images et des graphiques

 Le format préconisé par défaut est le format jpg, le plus optimisé en termes de taille

du fichier et de rendu,

Joom

la! 1.5 pour les nuls - v1.33 p 23/177

Chapitre : Une introduction à Joomla!

 Vous pouvez utiliser le format png pour générer des fonds transparents,
 Le format gif est adapté pour l’affichage de schémas.
 Le nom du fichier ne doit pas contenir de caractères spéciaux comme le blanc, les

tirets ...

3.5.6 La gestion des couleurs

La palette de couleurs utilisée sur Internet est la palette RVB comme '''R'''ouge '''V'''ert
'''B'''leu. Pour chaque couleur, vous attribuez une valeur codée entre 0 et 255.

Cette valeur est codée sur 2 caractères en hexadécimal ! Les chiffres utilisés sont 1, 2, 3, 4,
5, 6, 7, 8, 9, a (pour 10), b (pour 11), c (pour 12), d (pour 13), e (pour 14), F (pour 15) ; ainsi
la valeur 255 est codée ff soit 15x16 + 15. L'ensemble est précédé du caractère #.

La valeur correspond au maximum de la couleur et le mélange de toutes les couleurs donne
du blanc ! Quelques exemples de codage :

 #ff0000 (rouge = ff, vert = 00, bleu = 00) correspond au rouge,
 #000000 correspond au noir,
 #ffffff correspond au blanc,
 #ffff00 correspond au jaune.

Parfois, au lieu d'un codage sur 6 caractères (2 chiffres pour chaque couleur), vous avez un
codage sur 3 caractères (un chiffre par couleur)

Vous trouverez des palettes sur Internet ou dans les différents outils graphiques sur votre
micro ordinateur ; vous pouvez par exemple utiliser le composant Colorzilla avec Firefox.

3.5.7 La gestion d’une base de données

Une base de données est plus qu’un ensemble de fichiers car tous ces fichiers sont liés
entre eux et le moteur MySQL utilise des fichiers de configuration très spécifiques.
Cependant la plupart des outils de gestion de base de données, MySQL ou autres (Oracle,
MS SQL, …) utilisent le langage de requêtes commun, le langage SQL, pour gérer les bases
de données.

Il faut donc faire appel à des outils spécifiques comme PHP MyAdmin pour gérer la base de

données. Cet outil contient des commandes pour créer une base de données, des tables
dans une base de données, des enregistrements dans une table, pour modifier un
enregistrement …

Mais vous n’avez pas besoin de tout cela car Joomla! s’en charge pour vous : les scripts php

contiennent les requêtes SQL nécessaires !

Par contre, pour sauvegarder ou restaurer une base de données, vous avez besoin d’outils :

 Sauvegarder une base de données, c'est créer un fichier de requêtes SQL qui

comprend toutes les commandes pour créer les tables, les enregistrements dans les

tables ; la commande SQL correspondante est un Export..

 Restaurer une base de données, c'est reprendre ce fichier de requêtes SQL et

l'exécuter pour mettre à jour votre base de données ; la commande SQL

correspondante est un Import.

Joom

la! 1.5 pour les nuls - v1.33 p 24/177

Chapitre : Une introduction à Joomla!

Certains hébergeurs vous offrent des outils pour sauvegarder votre base de données ; des
extensions comme Joomlapack contiennent les scripts pour sauvegarder et restaurer une

base … Mais il vaut mieux connaître des outils comme PHP MyAdmin pour bien maîtriser

ce que l’on fait

3.5.8 La compatibilité avec les différents navigateurs du marché

Dans la cour des navigateurs, il y a un mauvais élève qui ne respecte pas toutes les règles

définies par W3C : il s'agit d'Internet Explorer de Microsoft ! Et ceci a contraint les

développeurs de Joomla! de rajouter des lignes de code pour traiter les spécificités des
navigateurs Microsoft. Ainsi, dans certains templates, vous avez un fichier css spécifique
pour traiter les navigateurs Microsoft.

Bien sûr, pour l'administration de votre site, nous vous conseillons d'utiliser le navigateur

Firefox. Mais comme tout le monde n’utilise pas (encore) Firefox, il vous faudra vérifier que

les pages de votre site s'affichent bien avec ce navigateur. Nous vous conseillons un test de
votre site avec :

 Le navigateur Firefox,
 La dernière version d'Internet Explorer et si possible une version plus ancienne

comme la version 6 …

Si vous avez un MAC, vous pouvez faire les tests avec Safari, mais normalement si votre
site fonctionne bien avec Firefox, vous ne devriez pas avoir trop de surprises avec Safari.

Attention ! L’accès aux fonctions d’administration avec Safari peut poser quelques problèmes

et il faut configurer correctement l’éditeur. (Se reporter au chapitre La configuration de

l'éditeur de texte en page 103 123)

En cas de problème avec Internet Explorer, vous aurez peut être à intervenir sur le fichier
css de votre template qui gère le navigateur Microsoft, ou sur d'autres fichiers de
configuration.

3.5.9 La compatibilité entre les différentes versions de Joomla !

Le soutien de la série 1.0 de Joomla a pris fin le 22 juillet 2009.

La version 1.5 a permis de faire évoluer le code de façon extraordinaire (langues, overrides,
MVC, etc.). Cette version contient une couche – partielle - de compatibilité ascendante
permettant d'utiliser des extensions tierces codées pour Joomla! 1.0 (la couche "legacy").
Celle-ci ne sera plus disponible dans la future version 1.6 sur laquelle les développeurs de
Joomla! travaillent en ce moment. Elle sera remplacée par une couche de compatibilité pour
les extensions 1.5 natives.

La version 1.6 nous apportera une plus grande granularité dans la gestion des contenus, une
gestion plus fine des droits d’accès, une nouvelle interface d’administration et bien d’autres
choses. Au milieu de l’année 2011, nous devrions voir apparaîte une version stable et les
outils de migration de la version 1.5 vers cette nouvelle version.

Joom

la! 1.5 pour les nuls - v1.33 p 25/177

Chapitre : La boîte à outils

4 La boîte à outils

4.1 Introduction

Pour développer et maintenir votre site Web, vous allez d’abord créer une copie de votre site
sur votre micro-ordinateur ; Pour cela, vous avez besoin d'outils si possible performants... et
gratuits. Voici donc une liste non exhaustive de logiciels qui vous accompagneront à toutes
les étapes de votre projet de création de site Web Joomla!. Le choix s'est arrêté sur des
applications éprouvées et reconnues pour leur qualité, mais rien ne vous empêche
évidemment d'utiliser les vôtres si vous en possédez déjà. Vous pouvez également faire
votre propre choix en consultant l'incontournable et excellent annuaire de logiciels libres:

http://www.framasoft.net

Bien sûr, pour tenir compte des différents environnements, nous allons vous proposer une
sélection pour Windows, Mac OS et Linux.

4.1.1 Un serveur Web sur votre micro ordinateur

Nous allons d’abord vous proposer d’installer sur votre micro-ordinateur un environnement
Apache, MySQL et PHP afin que vous puissiez tester Joomla! sur votre micro-ordinateur
Voici les différents composants nécessaires pour votre serveur web local :

 le serveur Apache, pour afficher les pages Web
 un moteur de script PHP, pour interpréter le code Joomla!
 un serveur de base de données MySQL, la base de données qui contient vos articles,
 et quelques outils d'administration comme PHP MyAdmin pour gérer votre base de

données (sauvegarde, restauration ...).

Vous pouvez télécharger les différents composants un par un mais il est plus simple de
charger une application qui regroupe les versions les plus récentes de ces logiciels. Les
principales différences entre les différents packages portent sur :

 la procédure d'installation et l’interface pour activer les différents services,
 l'emplacement de l'application et de vos sites sur le disque dur de votre micro

ordinateur,

 la version des logiciels utilisée.

.

4.1.2 Un bon navigateur

Ensuite, il vous faut un bon navigateur ! C’est l'outil de base pour gérer votre site.

Vous êtes certainement équipés, pour la plupart d'entre vous, de l'omniprésent Internet
Explorer, mais il existe d'autres navigateurs Web, gratuits, respectueux des standards W3C,
et aux fonctionnalités plus étendues, comme le navigateur Firefox, dont la popularité va

croissant à juste titre. En y ajoutant des extensions (gratuites elles aussi), ce navigateur se
transformera en un incontournable outil d'aide à la conception de site Web.

Firefox fonctionne sous Linux, Mac OS/X et Windows ; il cohabite sans difficultés avec
Internet Explorer. Après l'avoir téléchargé et installé, nous vous engageons vivement à y

adjoindre les extensions Web Developper et Firebug, cette dernière extension permet de

visualiser et d’éditer les fichiers html et css. Ces outils vous permettront de gagner un temps
considérable dans la création de votre site web.

 Téléchargement de Firefox: http://www.mozilla-europe.org/fr/

Joom

la! 1.5 pour les nuls - v1.33 p 26/177

Chapitre : La boîte à outils

 Téléchargement de l'extension Web Developper et de l’extension Firebug sur le

site de Mozilla, à l’adresse suivante :

https://addons.mozilla.org/fr/firefox

NOTE: Et non! Le logo du navigateur Firefox ne représente pas un renard. Il s'agit en fait

d'un panda rouge, ou panda fuligineux, que l'on trouve en Himalaya.

Attention : L’ajout des extensions sur Firefox peut vous perturber lorsque vous surfez sur le

Net … Par défaut, je désactive ces extensions et, quand j’en ai besoin, je les active !

4.1.3 Et d’autres outils

Ensuite, il vous faut d’autres outils comme un transfert de fichiers, un éditeur de texte, un
outil pour retoucher vos images …

Attention : ce manuel n’a pas pour vocation d'expliquer le fonctionnement détaillé de tous

les outils dont vous avez besoin. C’est juste une présentation et n’hésitez pas à consulter les
aides fournies avec ces différents logiciels, ou d’autres que vous pourrez trouver.

4.2 Installer un serveur Web sur votre PC sous Windows

4.2.1 Quel package choisir ?

Sur Windows XP, il y a une plétore de solutions (Wamp Server, Xampp ; EasyPhp,
Mov’AMP ,..) mais le passage sous Windows 7 a été fatale à beaucoup d’entre elles ; en

attendant que ces différentes distributions évoluent, nous nous contenterons de décrire une

solution qui fonctionne correctement sur les différents environnements : Wamp Server.

Quelques remarques sur les différentes solutions :

 L’outil Wamp Server permet de choisir la version des différents logiciels (Apache,

MySQL et PHP) et de reconstituer ainsi une configuration identique à celle de votre
hébergeur,

 Certains outils vous offrent un fonctionnement en mode autonome sur clef USB : ça

marche mais cela n’est pas très performant.

Remarque : Si vous choisissez un autre package que Wamp Server, les recommandations

qui suivent et la procédure d’installation s’appliquent. Il vous suffira de remplacer le chemin
du répertorie contenant les fichiers de votre site par la bonne valeur.

4.2.2 Installation et configuration du serveur Wamp Server

 Vous trouverez les différentes versions Windows de Wamp Server à l’adresse

suivante : http://www.wampserver.com/

 Inscrivez vous sur le site et télécharger l’application WampServer2 (fichier de la

forme WampServer2.0i.exe),

 Cliquez sur le fichier téléchargé ; la procédure d’installation commence, suivez les

instructions … Il y a quelques paramètres à saisir

Joom

la! 1.5 pour les nuls - v1.33 p 27/177

Chapitre : La boîte à outils

Dans cet écran,
saisissez votre
adresse email afin de
tester les envois de
mail à partir du site
web sur votre micro­ordinateur.

Avec Windows 7 ou Vista, vous
verrez apparaître ce
fenêtre lors

de l’installation.

type de

Vous devez autoriser le serveur
HTTP de Wamp Server à
utiliser le port 80 (utilisé par
votre navigateur).

Alors cliquez sur Débloquer

Lorsque vous lancez

le logiciel, u

ne icône apparaît

en bas de l’écran à gauche (le system tray, à côté de

l'horloge),

Via un click droit sur cet

te icône, vous pouvez changer la langue

du menu, accéder à la page d’aide ou quitter le programme.

Avec le clic droit, vous pouvez accéder à vos différents sites

locaux avec Local Host (paragraphe Projets), gérer vos bases
de données avec phpMyAdmin, accéder au répertoire
contenant vos sites par Répertoire www.

Vous pouvez aussi inst

aller et changer de version de Apache,
MySQL et PHP, gérer la configuration du serveur, accéder à vos
logs (journal d’évènements), …

Joom

la! 1.5 pour les nuls - v1.33 p 28/177

Chapitre : La boîte à outils

Dans la plupart des outils, vous trouvez les mêmes fonctionnalités avec un menu d’accès
différent.

Attention : si vous insérez des espaces ou des caractères spéciaux dans le nom des

répertoires contenant votre site Web, le serveur Web ne fonctionnera pas.

Dans votre navigateur, l’url pour se connecter sur vos sites locaux est http://127.0.0.1 ou

http://localhost (les 2 adresses doivent fonctionner si vous n’avez pas modifié la

configuration standard de votre micro-ordinateur).

 Marquez cette page dans les favoris de votre navigateur.

Le nom du répertoire contenant les fichiers de votre site dépend de l’outil choisi ; avec Wamp

Server le répertoire par défaut est c:\wamp\www.

 Créer un raccourci pour accéder rapidement à ce répertoire.

Tests fonctionnels du serveur

 Ouvrez votre navigateur et saisissez l’url http://localhost ou bien clic droit sur l’icône

Wamp Server et choisissez localhost

La page d’accueil de Wamp Server s’affiche …

4.2.3 Quelques informations en plus

Plusieurs logiciels utilisent le port http : votre navigateur web, le serveur http que vous venez

d’installer, des logiciels de téléphonie sur IP comme Skype … Et parfois tout ce monde se
bouscule.Wamp Server après avoir lancé Skype. Il vous suffit alors d’arrêter Skype, de
lancer Wamp Server et de relancer ensuite Skype !

4.2.4 Pour ceux qui veulent des solutions clef en main

Un fan de Joomla! vous propose un package complet comprenant un serveur local,un site
Joomla! pré configuré avec l’éditeur JCE et quelques extensions ; allez sur son site

http://www.sarki.ch/jce15/

C’est pratique pour démarrer mais il vous faudra quand même ensuite charger les dernières
versions de Joomla! , les patches et les extensions comme JCE pour installer votre site
chez votre hébergeur et mettre à jour votre site.

.

4.3 Les autres outils pour Windows

4.3.1 Un logiciel de décompression: 7-ZIP

Moins élégant que les WinZIP ou WinRAR certes, mais pas moins efficace! Il vous

permettra de compresser ou de décompresser des archives ZIP, RAR, GZIP, TAR, CAB,
ISO... par simple clic droit ou par un glisser/déplacer.

 Téléchargement de 7-ZIP: http://www.7-zip.org/ ou http://www.spiroo.be/7zip/ pour la

version française.

 Sélectionner la version EXE 32-Bit (ou 64 Bit si vous avez un micro-ordinateur très

moderne) puis réaliser une installation après l'avoir téléchargé.

 Après installation, lancer 7-ZIP (Démarrer / Programmes / 7-ZIP File Manager)

Joom

la! 1.5 pour les nuls - v1.33 p 29/177

Chapitre : La boîte à outils

 Aller dans le menu Outils / Options puis sélectionner toutes les extensions afin

d'ouvrir automatiquement tous ces types de fichier avec 7-ZIP.

4.3.2 Un éditeur de texte

Tôt ou tard, par curiosité ou par nécessité, vous aurez peut-être à éditer l'un des fichiers du
noyau Joomla!, celui d'une extension ou un export de base de données. Pour ce faire, mieux
vaut utiliser un outil à la fois adapté et performant.

Exit donc les Notepad, Wordpad ou encore MS Word, il vous un éditeur de texte, un vrai !
Entre autres fonctionnalités il devra au minimum être capable de colorisation syntaxique
(coloriser les mots-clés d'un langage, HTML, PHP ou autre), d'afficher les numéros de ligne,

de gérer le codage UTF8 et de sauvegarder les fichiers langue au format UTF8 NO BOM.

Notepad++ est un éditeur de code source qui supporte plusieurs langages. Ce programme,

codé en C++ avec STL et win32 api, a pour vocation de fournir un éditeur de code source de
taille réduite mais très performant.

Le projet est mature... Toutefois il reste encore quelques bugs puisque, comme vous avez
pu le constater, il n'y a qu'une personne qui gère ce projet.

 Connectez vous sur l’adresse suivante :

http://notepad-plus.sourceforge.net/fr/site.htm

 Cliquez sur l’onglet Télécharger et, à la fin du premier paragraphe Fichiers binaires,

puis cliquez sur le lien Télécharger les fichiers binaires de Notepad +++

 Sur le site SOURCEFORGE.NET, choisissez la dernière version de Notepad++, en

format exe par exemple ; enregistrez le sur votre micro et lancez son exécution

Pour les amateurs de langue exotique, il y a aussi BabelPad : il n’est disponible aujourd’hui

qu’avec une interface anglaise mais il vous permet de traiter presque toutes les langues
avec une interface très évoluée :

http://www.babelstone.co.uk/Software/BabelPad.html

4.3.3 Un Client FTP: Filezilla

Ce logiciel client FTP vous servira à uploader (transférer) les fichiers sources d’installation
de Joomla! de votre micro ordinateur vers le serveur de votre hébergeur, dans le cadre d’une
installation distante, mais aussi à sauvegarder sur votre micro-ordinateur les sauvegardes du
site distant.

Ceci semble une opération banale mais plusieurs d’entre vous ont déjà rencontré des
difficultés dans le transfert … Alors choisissez un outil solide et éprouvé et, en cas de doute,
n’hésitez pas à recommencer le transfert !

Nous vous proposons ici le logiciel qui fait référence, Filezilla :

 Téléchargement de Filezilla sur le site : http://filezilla.sourceforge.net/

 Réaliser une installation standard, nous verrons plus tard dans le document comment

configurer Filezilla.

4.3.4 Un éditeur de CSS: TopStyle Lite

Nous verrons plus loin dans ce document ce qu’est le CSS et en quoi cet éditeur sera utile,
notamment lors de la modification ou la création d'un template Joomla!

 Téléchargement de TopStyle Lite sur le site www.newsgator.com/individuals/topstyle

avec le lin suivant :

http://www.newsgator.com/download/products/ts3lite.exe

Joom

la! 1.5 pour les nuls - v1.33 p 30/177

Chapitre : La boîte à outils

4.3.5 Un logiciel pour traiter vos images

Vous allez vouloir certainement mettre des images sur votre site, créer des logos ... Il vous
faut alors un logiciel de traitement d'images avec au minimum les fonctions suivantes :

 enregistrement des images dans un format supporté par le web : jpeg par défaut (le

plus efficace), png si vous souhaitez un fond transparent et gif pour les schémas,

 recadrage des images,
 redimensionnement des images.

Selon vos besoins, vous devrez retoucher des photos, changer des couleurs ... La plupart
des logiciels de retouche de photos supportent ces fonctions. Si vous n'en n'avez pas sur
votre micro ordinateur, vous pouvez essayer GIMP ! L'interface est un peu déroutante pour
les inconditionnels de Windows mais il marche bien.

 Téléchargement de GIMP sur le site : http://www.gimp.org/

4.4 Installer un serveur Web sur votre MAC

4.4.1 Quelque environnement choisir ?

Si vous avez une version Mac OS Server, votre micro-ordinateur comprend déjà :

 Java Developer Kit (JDK) complet, y compris javac, javadoc, ANT et les outils Maen
 Serveur web Apache
 Python
 Perl
 PHP
 SQLite pour gérer les bases SQL

Il est néanmoins nécessaire dans ce cas d'intervenir par le Terminal pour le faire fonctionner
correctement. Il faut éventuellement installer les packages de Marc Lignage.

Le plus simple est de charger une application qui regroupe les versions les plus récentes de

ces logiciels. Un bon choix est MAMP mais il y a aussi des solutions comme la solution

XAMPP sur le site http://www.apachefriends.org/fr/xampp-macosx.html

4.4.2 Installation et configuration du serveur MAMP

 Téléchargez la version la plus récente de MAMP ; l'ensemble des programmes se

place dans l'environnement Téléchargements de votre micro ordinateur

L’adresse pour le téléchargement de MAMP :

http://www.mamp.info
http://www.mamp.info/en/download.html

Quelques précisions

o En bas de la page, choisissez la version qui correspond à votre Mac : MAMP

1.7.1 (Intel) si vous êtes en environnement Intel avec une version de Mac OS
X 10.4.x ou plus, ...

o Télécharger aussi le mode d'emploi de la version complète : MAMP PRO

User Manual.

 Déplacer le dossier dans l'environnement Applications
 Lancer la nouvelle application MAMP et c'est fini

Joom

la! 1.5 pour les nuls - v1.33 p 31/177

Chapitre : La boîte à outils

Si vous ne voulez pas avoir à démarrer manuellement votre serveur Web après chaque
redémarrage de votre ordinateur, vous pouvez configurer MAMP ...

CONSEIL: placez MAMP dans le Desktop afin de pouvoir y accéder rapidement.

4.5 La boîte à outils Joomla! pour votre Mac

4.5.1 Le navigateur Web: Firefox ou Safari ?

Vous utilisez, pour la plupart d'entre vous, le navigateur Safari. Il faut alors modifier la
configuration de l’éditeur de texte pour le bon fonctionnement avec Safari ! Consultez le

paragraphe La configuration de l'éditeur de texte

et plugins …

Vous pouvez aussi installer le navigateur Firefox qui cohabitera sans difficultés avec votre

ancien navigateur. En y ajoutant des extensions (gratuites elles aussi), ce navigateur se
transformera en un incontournable outil d'aide à la conception de site Web.

en page 103.

Après l'avoir téléchargé et installé, nous vous engageons vivement à y adjoindre les

extensions Web Developper et Firebug, cette dernière extension permet de

visualiser et d’éditer les fichiers html et css. Ces outils vous permettront de gagner un
temps considérable dans la création de votre site web.

du chapitre Modules, menus, composants

4.5.2 Un éditeur de texte

Tôt ou tard, par curiosité ou par nécessité, vous aurez peut-être à éditer l'un des fichiers du
noyau Joomla!, celui d'une extension ou un export de base de données. Pour ce faire, mieux
vaut utiliser un outil à la fois adapté, performant et gratuit. Entre autres fonctionnalités il
devra au minimum être capable de colorisation syntaxique (coloriser les mots-clés d'un

langage, HTML, PHP ou autre) d'afficher les numéros de ligne, gérer le codage UTF8
sauvegarder les fichiers langue au format UTF NO BOM.

Il existe quantité d'éditeurs de ce type sur le Web ; nous avons retenu TextWrangler que
vous pouvez télécharger à l’adresse suivante :

http://www.barebones.com/products/textwrangler/

4.5.3 Un Client FTP: Filezilla

Ce logiciel client FTP vous servira à uploader (transférer) les fichiers sources d’installation
de Joomla! de votre micro ordinateur vers le serveur de votre hébergeur, dans le cadre d’une
installation distante. Ceci semble une opération banale mais plusieurs d’entre vous ont déjà
rencontré des difficultés dans le transfert … Alors choisissez un outil solide et éprouvé et, en
cas de doute, n’hésitez pas à recommencer le transfert !

Nous vous proposons ici le logiciel qui fait référence, Filezilla :

 Téléchargement de Filezilla: http://filezilla.sourceforge.net/ (il existe aussi en version

Mac !)

 Réaliser une installation standard, nous verrons plus tard dans le document comment

configurer Filezilla.

Joom

la! 1.5 pour les nuls - v1.33 p 32/177

Chapitre : La boîte à outils

4.5.4 Un éditeur de CSS

Nous verrons plus loin dans ce document ce qu’est le CSS et en quoi cet éditeur sera utile,
notamment lors de la modification ou la création d'un template Joomla!

En l’absence d’outil connu et gratuit, vous pouvez toujours utiliser un éditeur de texte et vous
aider des extensions de Firefox pour analyser les fichiers css.

4.5.5 Un logiciel pour traiter vos images

Vous allez vouloir certainement mettre des images sur votre site, créer des logos ... Il vous
faut alors un logiciel de traitement d'images avec au minimum les fonctions suivantes :

 enregistrement des images dans un format supporté par le web : jpeg par défaut (le

plus efficace), png si vous souhaitez un fond transparent et gif pour les schémas,

 recadrage des images,
 redimensionnement des images.

Selon vos besoins, vous devrez retoucher des photos, changer des couleurs ... La plupart
des logiciels de retouche de photos supportent ces fonctions. Si vous n'en n'avez pas sur
votre micro ordinateur, vous pouvez essayer Gimp !.

 Téléchargement de GIMP sur le site :

http://www.gimp.org/

4.6 La boîte à outils pour Linux

Les logiciels Apache, MySQL et PHP sont déjà fournis avec la distribution Linux.

4.6.1 Un Client FTP: Filezilla

Ce logiciel client FTP vous servira à uploader (transférer) les fichiers sources d’installation
de Joomla! de votre micro ordinateur vers le serveur de votre hébergeur, dans le cadre d’une
installation distante. Ceci semble une opération banale mais plusieurs d’entre vous ont déjà
rencontré des difficultés dans le transfert … Alors choisissez un outil solide et éprouvé et, en
cas de doute, n’hésitez pas à recommencer le transfert !

Nous vous proposons ici le logiciel qui fait référence, Filezilla :

 Téléchargement de Filezilla: http://filezilla.sourceforge.net/
 Réaliser une installation standard, nous verrons plus tard dans le document comment

configurer Filezilla

4.6.2 Un logiciel pour traiter vos images

Vous allez vouloir certainement mettre des images sur votre site, créer des logos ... Il vous
faut alors un logiciel de traitement d'images avec au minimum les fonctions suivantes :

 enregistrement des images des images dans un format supporté par le web : jpeg par

défaut (le plus efficace), png si vous souhaitez un fond transparent et gif pour les
schémas,

 recadrage des images,
 redimensionnement des images.

Dans le monde du libre, on vous recommande GIMP (The GNU Image Manipulation

Program) que vous pouvez télécharger sur le site :http://www.gimp.org/

Joom

la! 1.5 pour les nuls - v1.33 p 33/177

Chapitre : La boîte à outils

4.7 Les ressources Joomla! sur le Web

4.7.1 Le portail officiel: http://www.joomla.org

Le portail Joomla.org regroupe plusieurs sites et vous donne accès aux news officielles,
l’accès à la communauté Joomla! … une seule adresse pour accéder à tout :

http://www.joomla.org/

Bien sûr, c’est en anglais, mais si vous ne maîtrisez pas la langue de Shakespeare, pas de
panique, allez au paragraphe suivant !

Ce portail comprend notamment :

 L’accès au téléchargement de la dernière version de Joomla! :

http://www.joomla.org/download.html

En bas de cette page, vous avez les liens pour télécharger les différents packs pour
supporter une multitude de langues …

 Toutes les informations sur la Communauté Joomla! de par le monde,
 Toute la documentation officielle du projet Joomla! sous forme d’un wiki :

http://docs.joomla.org/

 Le forum officiel du projet Joomla! http://forum.joomla.org/
 L’annuaire d'extensions pour Joomla! : http://extensions.joomla.org/
 Le coin des développeurs : vous y trouverez entre autres choses le blog des

développeurs du projet, le roadmap, et d'autres informations liées au développement
de Joomla! (API, Forge...) : http://developer.joomla.org/

4.7.2 Le portail francophone: http://www.joomla.fr

Il y avait plusieurs associations en France qui travaillaient autour de Joomla! avec chacune
leur site web : www.joomlafrance.org

et de www.joomlafacile.com .

Aujourd’hui, ces différentes équipes ont décidé de concentrer les ressources Joomla! dans
un même portail www.joomla.fr/

, notamment pour faciliter la vie des utilisateurs.

Ce portail regroupe plusieurs espaces identifiés par des onglets dans le menu en haut de
page :

 le Portail : site principal du portail francophone où sont publiées les annonces

officielles,

 les Extensions : annuaire d'extensions pour Joomla! et news concernant ces mêmes

extensions

 l'Aide : en cours de refonte au moment où j’écris ce document,
 le Forum : le forum de support : http://forum.joomla.fr/
 l'AFUJ, l'association de tous les mordus de Joomla! qui parlent français.

Il faut signaler aussi le wiki pour gérer la documentation en français : http://wiki.joomla.fr

4.7.3 D'autres sites…

Quelques minutes de recherche sur Internet vous suffiront à localiser les centaines de sites
consacrés à Joomla! en fonction de vos besoins.

Joom

la! 1.5 pour les nuls - v1.33 p 34/177

Chapitre : Vos premiers pas avec Joomla!

5 Vos premiers pas avec Joomla!

Maintenant que vous avez quelques notions de base sur Joomla! et que vous disposez de
tous les outils du parfait Joomliste, nous vous proposons d’installer sur votre micro
ordinateur un site Joomla! et de faire vos premiers pas d’administrateur.

5.1 Quelques rappels

5.1.1 Qu’est-ce qu’un site Joomla!

Joomla! n’est pas un fichier exécutable .. Un site Joomla! c’est :

 Un millier de fichiers :

o Des scripts au format php, intéprétables par votre serveur Web,
o Des fichiers de configuration dans divers formats : fichiers ini, fichiers xml,

fichiers css,

o Des fichiers contenant tous les libellés du programme dans la langue que

vous avez choisie (fichiers ini regroupés dans un répertoire par langue)

o Des images, des icônes …

 Et une base de données au format My SQL, qui va contenir vos articles, vos menus,

la configuration de votre site …

L’ensemble des fichiers – scripts au format php, fichiers de configuration, fichiers contenant
les libellés, images, icônes … - sont placés dans un même répertoire.

Un site se réduit à un répertoire contenant tous ces fichiers et une base de données !

Quelque soit l’OS – Operating System - de votre micro-ordinateur ou du serveur qui va
héberger votre site (Microsoft Windows, Mac OS, Linux, Unix …), ce sont les mêmes fichiers
qui vont être utilisés par le serveur Apache et le moteur de base de données MySQL.

Pour les scripts, les fichiers de configuration, les fichiers langue, les fichiers images …, vous
pouvez les copier et les déplacer simplement,

 en utilisant les commandes copier/coller si vous travaillez en local,

 en utilisant un logiciel de transfert de fichiers si vous travaillez sur un site distant

Vous pouvez modifier le cas échéant ces fichiers avec un éditeur de texte adapté, sauf bien
sûr les fichiers images !

Par contre, pour gérer la base de données, il faut s’appuyer sur les scripts fournis par

Joomla! ou utiliser un outil comme Php MyAdmin.

5.1.2 Les paramètres pour installer votre site local

Créer un site Web sur votre micro-ordinateur consiste à :

 Créer un répertoire où placer tous les fichiers qui constituent le site Joomla! Nous

vous proposons de l’appeler sitejoomla,

 Créer une base de données, que vous allez appeler basejoomla.

Joom

la! 1.5 pour les nuls - v1.33 p 35/177

Chapitre : Vos premiers pas avec Joomla!

Attention ! nous vous recommandons d’utiliser des noms pour la base de données et le

répertoire contenant le site sans lettres accentuées, sans point, sans caractères spéciaux
comme / ,\ , _ …

Ainsi, si vous insérez un point dans votre nom de répertoire, votre navigateur se mélange les
pinceaux …

Pour poursuivre l’installation de votre site sur votre micro, il vous suffit de connaître :

 L’endroit où vous allez créer le répertoire sitejoomla,

 L’url à saisir dans votre navigateur pour se connecter sur le site local,

 Les paramètres de la base de données basejoomla.

Ces valeurs dépendent de l’outil que vous utilisez :

Si vous utilisez Wamp Server dans un environnement Windows

Paramètres Valeur

Répertoire contenant les fichiers constituant

C :/wamp/www

votre site Joomla!

Adresse (url) de votre site Joomla!

Adresse (url) pour accéder à la partie
administration de votre site Joomla!

Paramètres de la base de données

- Nom du serveur de base de données

- Nom de l'utilisateur de la base de données

- Mot de passe de l'utilisateur de la base de

http://localhost/sitejoomla
http://localhost/sitejoomla/administrator

localhost
root

- pas de mot de passe -

données

- Nom de la base de données

basejoomla

Si vous utilisez un autre logiciel que WampServer, tous ces paramètres restent valables

sauf le nom du répertoire contenant les fichiers constituant votre site Joomla!

CONSEIL : Sous Windows, n’hésitez pas à créer des raccourcis : un raccourci dans votre
navigateur (http://localhost) et un raccourci Windows, C:\wamp\www ou autre que vous

mettrez sur votre bureau ou dans le dossier Favoris !

Si vous utilisez MAMP dans un environnement Mac OS

Paramètres Valeur

Dossier contenant les fichiers constituant
votre site Joomla!

Un dossier placé dans le dossier MAMP\htdocs,
qui est placé dans l'environnement Applications :

Applications/MAMP/htdocs/sitejoomla

Adresse (url) de votre site Joomla!

Adresse (url) pour accéder à la partie
administration de votre site Joomla!

Joom

la! 1.5 pour les nuls - v1.33 p 36/177

http://localhost:8888/sitejoomla
http://localhost:8888/sitejoomla/administrator

Chapitre : Vos premiers pas avec Joomla!

Paramètres de la base de données

- Nom du serveur de base de données

- Nom de l'utilisateur de la base de
données

- Mot de passe de l'utilisateur de la base
de données

- Nom de la base de données

CONSEIL : placez MAMP dans le Desktop afin de pouvoir y accéder rapidement, et créez un
raccourci dans votre navigateur (http://localhost:8888)

localhost
root

root

basejoomla

5.2 L'installation de Joomla! sur votre micro-ordinateur

Le serveur web local est prêt ! Nous voilà arrivé au premier moment de vérité, ou comment
les mystères de l’installation de Joomla! vont vous être révélés ! En fait il n’y a aucun
mystère ! Les développeurs de Joomla! ont tout fait pour que l’installation soit à la fois simple
et rapide. Si vous avez correctement configuré votre serveur web, et c’est le cas si vous
avez suivi les instructions ci-dessus, l’installation, hors copie des fichiers, ne vous prendra
guère plus d’une minute, un peu plus si vous voulez lire toutes les pages de l’assistant
d’installation.

5.2.1 Téléchargement du package d'installation Joomla!

Les deux sites officiels pour récupérer les versions de Joomla! sont :

 Le site Joomla! France à l’adresse http://www.joomla.fr où vous trouverez les

packages en langues française et anglaise,

 Le site Joomla! à l’adresse http://www.joomla.org où vous trouverez des packages

intégrant la langue anglaise mais aussi, dans l’espace Communautés, toutes les
nouvelles de par le monde et les packages langues : http://community.joomla.org/

Pour plus de détails sur ces 2 sites, voir le paragraphe Les sites de téléchargement de

Joomla!

Pour ajouter une langue à un package, il vous suffit d’installer une version de Joomla! de

télécharger le package langue correspondant à la langue souhaitée et de l’installer comme
toute autre extension de Joomla!. Pour charger un package langues, connectez-vous sur
l’adresse suivante : http://joomlacode.org/gf/project/jtranslation/frs/

Vous pouvez aussi trouver les fichiers langues sur les sites des différents traducteurs du
projet Joomla!

Et si vous voulez gérer un site multilingue, il existe même un super composant Joom!Fish.

Quelle version choisir ?

La Core Team de Joomla ! produit des versions stables et nous vous conseillons de
télécharger le dernière version 1.5 disponible sur les sites www.joomla.fr ou www.joomla.org

Pourquoi ? Non seulement pour disposer d’une version avec moins de bugs mais surtout
une version plus sûre qui intègre les derniers patchs de sécurité, car votre site sur le web
n’est pas à l’abri des attaques de hackers !

dans le chapitre Concepts de base en page 12.

Joom

la! 1.5 pour les nuls - v1.33 p 37/177

Chapitre : Vos premiers pas avec Joomla!

5.2.2 Transfert des sources d'installation vers le serveur web

Bien, à ce moment précis vous devez vous rappeler de l'endroit où vous avez « installé »

votre site Web, c'est-à-dire où vous avez créé le répertoire sitejoomla selon les

recommandations fournies en début de ce chapitre. Si vous n'avez pas créé de raccourci et
que vous ne voulez pas jeter un coup d'oeil sur les chapitres précédents, voici la soluce :

Suite Apache-MySQL-PHP Adresse du répertoire

Si vous utilisez WAMP Server dans un
environnement Windows

Si vous utilisez MAMP dans un
environnement Mac OS

C :/ wamp/www/sitejoomla

Dans le dossier

Applications/MAMP/htdocs/sitejoomla

Une fois ce sous répertoire sitejoomla créé, il vous suffit de récupérer le package

d'installation Joomla! que vous avez téléchargé puis de le décompresser dans le sous
répertoire que vous venez de créer.

Si tout s'est bien passé, les fichiers et dossiers source de Joomla! se trouvent dans le

dossier sitejoomla. Voici une présentation rapide des différents sous répertoires qui

constituent le package Joomla! :

║

\administrator

╟─
║

Ce répertoire contient tous les outils pour administrer le site et, dans
un sous répertoire \language vous trouvez les fichiers langues pour la
partie administrateur

║
║
╟─
║

\cache

Si vous avez activé la fonction cache, vous trouvez là les fichiers les
plus souvent consultés afin de rendre l’affichage des pages du site
plus rapide

║
║

\components

╟─
║

\images

╟─
║
║

Contient tous les composants Joomla! de votre site

Contient la plupart des images de votre site ; ce répertoire comprend

notamment le sous répertoire stories qui comprend toutes les images

et photographies insérées dans vos articles et le sous répertoire

banners qui contient les bannières.

║
║
╟─

\includes

║
╟─

\installation

Contient la procédure d'installation – à détruire après installation -

║
╟─
║
║
╟─

\language

\librairies

Contient un sous répertoire par langue utilisée dans l’interface du site
web : fr-FR pour le français, en-GB pour l'anglais

║
╟─
║
║
╟─

\logs

\media

Contient les logs, c'est à dire les traces des différentes opérations
réalisées sur votre site

Joom

la! 1.5 pour les nuls - v1.33 p 38/177

Chapitre : Vos premiers pas avec Joomla!

║
╟─

\ modules

Contient tous les modules Joomla! de votre site

║
╟─

\ plugins

Contient tous les plugins Joomla! de votre site

║
╟─
║
║
╟─
║
╟─

\ templates

\temp

\xmlrpc

Contient tous les éléments des templates pour gérer l’affichage des
couleurs et des styles sur votre site

Nous avons signalé en gras les répertoires dans lesquels vous modifierez
vraisemblablement quelques fichiers pour personnaliser votre site.

5.2.3 Lancement de l'installation de Joomla

ATTENTION: le processus d'installation s'effectue sur plusieurs pages. Une fois que vous

avez cliqué sur le bouton Suivant pour passer d'une étape à la suivante, ne revenez pas en

arrière avec les boutons de navigation de votre navigateur ! Vous risqueriez de rencontrer
des problèmes qui obligeraient à reprendre toute la procédure d'installation depuis la
création de la base de données.

Lancez votre navigateur et saisissez l'adresse complète de votre site :

Suite Apache-MySQL-PHP Adresse du site

Si vous utilisez WAMP ou un autre logiciel

http://localhost/sitejoomla

dans un environnement Windows

Si vous utilisez MAMP dans un

http://localhost:8888/sitejoomla

environnement Mac OS

Joom

la! 1.5 pour les nuls - v1.33 p 39/177

Chapitre : Vos premiers pas avec Joomla!

Étape 1 : Langue

Joomla! vous propose le français comme langue par défaut. Si cela vous convient, appuyez

sur le bouton Suivant en haut à droite. Sinon, choisissez une autre langue avant d'appuyer
sur le bouton Suivant.

Étape 2 : Pré-installation

A cette étape est effectué un contrôle de la configuration du serveur web. Pour une
installation locale sur votre micro-ordinateur, ne tenez pas compte des avertissements en

rouge pour l'instant. Continuez en cliquant sur le bouton Suivant.

Joom

la! 1.5 pour les nuls - v1.33 p 40/177

Chapitre : Vos premiers pas avec Joomla!

Étape 3 : Licence

Prenez connaissance de la licence d'utilisation GNU/GPL puis cliquez sur le bouton Suivant.

La version française (non officielle) est consultable à cette adresse :

http://www.gnu.org/licenses/translations.fr.html

Étape 4 : Base de données

A cette étape l'assistant d'installation va automatiquement créer la base de donnée utilisée

par Joomla!. Renseignez les Paramètres de base selon les recommandations fournies ci­après puis cliquez sur le bouton Suivant.

Joom

la! 1.5 pour les nuls - v1.33 p 41/177

Chapitre : Vos premiers pas avec Joomla!

Suite Apache-MySQL-PHP Valeur

Si vous utilis dans un environnement Winez WAMP ou un autre logiciel dows

- Nom du serveur de base de données

- Nom de l'utilisateur de la base de données

localhost
root

- Mot de passe de l'utilisateur de la base de données as de mot de passe - - p

- Nom de la base de données

basejoomla

Si vous utilisez MAMP dans un environnement Mac OS

- Nom du serveur de base de données

- Nom de l'utilisateur de la base de données

- Mot de passe de l'utilisateur de la base de données

- Nom de la base de données

localhost
root
root
basejoomla

REMARQUE : Si vous faites une réinstallation de Joomla! et que la base de données existe
déjà, reprenez les paramètres de la base existante ; le programme d’installation détectera la
base de données existante et se connectera dessus.

Par contre, selon les choix faits dans la fenêtre Paramètres avancés, le programme

d’installation supprimera les tables de l’ancienne base de données ou les renommera : le
suffixe jos_ sera remplacé par le suffixe _bak … Ceci revient à les sauvegarder, mais cette
sauvegarde est difficile à réutiliser.

Étape 5 : Configuration FTP

oomla! peut prendre en compte le transfert de fichiers, mais en local vous n'en n'avez pas J

besoin ... Alors cliquez sur le bouton Suivant.

Joom

la! 1.5 pour les nuls - v1.33 p 42/177

Chapitre : Vos premiers pas avec Joomla!

Étape 6 : Configuration générale

Les choses sérieuses commencent :

 dans le premier bloc, saisissez le nom du site en clair : c'est ce nom qui apparaîtra

dans le titre de la page de votre navigateur.

 dans le second bloc, saisissez l'adresse email de l'administrateur ; ceci vous

permettra de tester certaines fonctions comme l’envoi de mail vers un contact.

 saisissez aussi le mot de passe pour l'administration du site.

Attention! Il s'agit du mot de passe associé au compte Admin, le super
administrateur ! Sans lui vous ne pourrez pas accéder à l'interface d'administration de
votre site.

 dans le troisième bloc, cliquez sur le bouton Installer des données d'exemple et

cliquez sur le bouton Suivant.

REMARQUE :
Les cas plus complexes de migration d'un ancien site Joomla! ou de reprise des données

d'une base existante seront traités plus tard.

Joom

la! 1.5 pour les nuls - v1.33 p 43/177

Chapitre : Vos premiers pas avec Joomla!

Étape 7 : Terminer

Vous êtes arrivés à la dernière étape de l'assistant d'installation. Avant de cliquer sur les

boutons Site ou Admin, un message vous invite à supprimer le répertoire d'installation
Joomla!... Supprimez donc le répertoire sitejoomla/installation avec le gestionnaire de
fichiers et retournez dans votre navigateur Web et cliquer sur le bouton Site pour visiter votre

tout nouveau site Web.

Pour accéder à votre site :

Suite Apache-MySQL-PHP Adresse de votre site

Si vous utilisez WAMP ou un autre

http://localhost/sitejoomla

logiciel dans un environnement Window

Si vous utilisez MAMP dans un

http://localhost:8888/sitejoomla

environnement Mac OS

Pour accéder à l’administration de votre site :

Suite Apache-MySQL-PHP Adresse de votre site

Si vous utilisez WAMP ou un autre
logiciel dans un environnement Window

Si vous utilisez MAMP dans un
environnement Mac OS

http://localhost/sitejoomla/administrator

http://localhost:8888/sitejoomla/administrator

Placez ces URL dans vos marque-pages!

5.3 Un petit tour sur le site de démo

Commencez par vous connecter sur le site local et à appuyer sur tous les boutons pour
découvrir les différentes fonctionnalités de Joomla!.

Joom

la! 1.5 pour les nuls - v1.33 p 44/177

Chapitre : Vos premiers pas avec Joomla!

5.4 L’administration de votre site

5.4.1 L’accès à l’administration du site

Si vous souhaitez découvrir l’envers du décor, il vous suffit de saisir dans votre navigateur
l’adresse pour accéder à l’administration du site, précisée ci-dessus.

Vous arrivez sur une page d’identification, où vous devrez utiliser le compte admin et le mot
de passe que vous avez choisi à l'Etape 3 de l’installation de Joomla! et appuyer sur le
bouton Connexion.

5.4.2 La page d'accueil de la console d'administration

Une fois identifié, la page suivante s’affiche :

 La barre de menus vous permettra de naviguer facilement dans la console

d’administration.

 La page d'accueil comprend le Panneau d'administration avec des raccourcis vers

les fonctions les plus courantes ; ces fonctions sont aussi accessibles à partir de la
barre de menus.

Joom

la! 1.5 pour les nuls - v1.33 p 45/177

Chapitre : Vos premiers pas avec Joomla!

 A droite de cette page d'accueil, vous trouvez un certain nombre d'informations

génériques (utilisateurs connectés, derniers articles publiés, statistiques) classées
par onglet.

Remarque :

Tous les éléments qui composent la page d’accueil de la console d’administration sont des
modules administrateur que vous pourrez choisir de dépublier (sauf la barre de menu !) si
vous ne souhaitez pas qu’ils soient affichés (Il vous suffit d'aller dans les menus suivants :

Menu Modules > Modules Administrateur).

A tout moment vous pouvez retourner sur la page d'accueil de la console d'administration en

cliquant sur Accueil tout à gauche de la barre de menus. Mais bof, la version de base me

convient …

Pour revenir à cette page d'accueil, il vous suffit de choisir dans la barre de menus les items

suivants : Site > Panneau d'administration.

5.4.3 Une autre page

Cliquez par exemple sur le menu Contenu et choisissez l’élément Gestion des articles ; la

page suivante s’affiche :

Toutes les pages de la partie administration ont la même structure :

 Tout en haut la barre de menus,
 En dessous, une barre d'infos avec le nom de la fonction utilisée – Gestion des

articles dans l’exemple ci dessus - et les boutons de commande associés à cette

fonction.

 Ensuite, généralement, un ensemble de filtres pour n’afficher qu’une partie des items.

5.4.4 La barre de menu

Vous trouvez à gauche l'accès aux principaux menus. A droite, vous avez accès aux
fonctions suivantes :

 : ce bouton vous permet de visualiser votre site, en ouvrant une

nouvelle page dans votre navigateur. Vous pouvez ainsi faire des modifications dans
la console d’administration (ajout de module, de lien dans un menu, modification du
CSS…), et ouvrir avec cette fonction une nouvelle fenêtre afin de visualiser les
modifications apportées au frontend.

Joom

la! 1.5 pour les nuls - v1.33 p 46/177

Chapitre : Vos premiers pas avec Joomla!

 : une icône avec le nombre de messages privés reçus. En appuyant sur cette

icône, vous accédez à un système de messagerie privée pour communiquer avec les
autres administrateurs du site, si vous êtes plusieurs à l'administrer).

 : une icône avec le nombre d'utilisateurs connectés en ce moment sur votre

site.

 : tout au bout à droite de la ligne de menu vous trouvez un lien

Déconnexion sur lequel vous devrez cliquer pour fermer votre session

administrateur ; c’est plus propre et plus sécurisé que de fermer la fenêtre de votre

navigateur, même si la session se ferme automatiquement après 15 minutes

d’inactivité (paramètre réglable dans la Configuration du site).

5.4.5 La barre d’infos

Chaque bouton est constitué d’une icône avec un lib

ans la barr

d

e d’infos dé

pendent de la fonction utilisée

ellé en dessous ; les boutons placés

Quelques règles de base

Avec un outil comme Joomla!, vous ne pouvez pas utiliser les boutons Page Suivante et

Page précédente dans votre navigateur lor

sque vous faites la mise à jour de votre site ! Il y

a une base de données à gérer derrière …

Donc, un seul mot d'ordre : utilisez les boutons Sauver / Annuler lorsque vous effectuez une

modification sur votre site (modification de la configura

tion générale, de la configuration d’un

composant, création d’une catégorie, d’un article…),



 Vous n’êtes pas sûr de ce que vous avez fait ou alors vous êtes perdu, vous

Vous êtes sûr de votre affaire… alors vous cliquez sur le bouton Sauver,

cliquez sur le bouton Annuler, mais pas sur le bouton Page Précédente de votre

navigateur !

 Vous êtes presque sûr mais vous voulez vérifier quand même. Vous cliquez

sur le bouton Appliquer, si cette facilité vous est offerte.

Visualisez le résultat : appuyer sur le bouton

, et allez sur votre site sur la page

modifiée. N'oubliez pas de rafraîchir l'affichage (commande actualiser dans Firefox, 3e

bouton à gauche)
Si cela vo

nnuler.

A

us convient, vous appuierez alors sur le bouton Sauver ou sinon sur le bouton

Et si vous avez oublié cette règle, ou que vous rencontrez quelques problèmes dans la mise

à jour, n'oubliez pas la commande miracle décrite dans le paragraphe Verrouillé /

déverrouillé... des histoires de cadenas

511

.

du Chapitre Maintenance et autres réglages en page

Joom

la! 1.5 pour les nuls - v1.33 p 47/177

Chapitre : Vos premiers pas avec Joomla!

Allez dans le menu Outils et vous cliquez sur Vérification Globale. C'est tout!

5.5 Une visite rapide des différents menus

Nous allons passer maintenant à une visite rapide des différents menus.

5.5.1 Le menu site

Le menu site vous permet d'accéder aux fonctions suivantes :

 Panneau d'administration, pour retourner à la page d'accueil de la partie

administration du site

 Gestion des utilisateurs, pour créer des nouveaux utilisateurs, gérer leurs droits et

leur mot de passe

 Gestion des médias, pour charger sur votre site les images et les autres fichiers

multimédias que vous voudrez diffuser, ou supprimer les fichiers inutilisés.

 Configuration générale, pour accéder aux paramètres suivants :

o le nom du site, le message à afficher quand le site est en travaux, les méta

données du site (description du site, les mots clefs),

o les règles pour définir les droits des utilisateurs : inscription à partir de

l’interface web, mise à jour des données utilisateur à partir du site Web …,

Joom

la! 1.5 pour les nuls - v1.33 p 48/177

Chapitre : Vos premiers pas avec Joomla!

o les règles retenues pour la gestion des médias : format supportés, taille

maximale d'un fichier ...

o la gestion du cache, le mode debug, la gestion des sessions administrateur,
o le choix du fuseau horaire,
o des paramètres techniques sur le serveur, le transfert FTP, la base de

données,

o les réglages pour l'envoi de mails, utilisé notamment par la rubrique

contactez-nous.

Vous retrouverez aussi d'autres fonctions transverses dans d'autres menus comme :

 la gestion des langues dans le menu Extensions,
 dans le menu Outils, la vérification globale du site et le nettoyage du cache.

5.5.2 Le menu Menus

Ce menu, comme son nom l’indique, vous permet de créer autant de menus que vous le
souhaitez et de les gérer en y ajoutant des liens vers des composants que vous aurez
installé (livre d’or, forum…), des liens vers des sections de contenu, des catégories, des
pages extérieures à votre site. Notez bien qu’à chaque fois que vous créerez un nouveau
menu, le module associé sera automatiquement créé.

 l'item Gestion des menus permet de gérer les menus (gérer = créer, modifier ou

supprimer, publier ou dépublier) et d'accéder aux différents items des menus et de
les gérer.

 lorsque vous supprimez un menu, il est mis dans la corbeille et l'item suivant Gestion

de la corbeille permet de récupérer un menu jeté par inadvertance ou de vider la

corbeille

 les items suivants correspondent aux noms des menus. Vous pouvez ainsi accéder

directement aux items d'un menu donné et les gérer.

5.5.3 Le menu Contenus

Ce menu vous permet de gérer toute la partie « contenu » de votre site. C’est là que vous

créerez la section Amérique du Sud, la catégorie Argentine et ce fameux article sur la ville de

Buenos Aires. Vous pourrez aussi y gérer les éléments qui vont apparaître dans la page
d'accueil, ainsi que l'archivage de vos articles.

5.5.4 Le menu Composants

Avec le menu Composants, vous pourrez administrer les composants Joomla!, aussi bien

ceux présents nativement dans Joomla! comme ceux que vous aurez installés par la suite.

Voici une première liste des composants installés avec Joomla! :

 Le composant Bannières vous permet de gérer les bannières - publicitaires ou non -

que vous voulez afficher dans votre site.

 Le composant Contacts vous permet de définir les contacts que les visiteurs de votre

site pourront contacter par email.

 Le composant Fils d’actualités vous permet de gérer les flux d’actualité – flux RSS –

externes que vous voulez afficher dans votre site.

 Le composant Sondage vous permet de créer vos sondages.

Joom

la! 1.5 pour les nuls - v1.33 p 49/177

Chapitre : Vos premiers pas avec Joomla!

 Le composant Recherche vous fournit des statistiques sur le moteur de recherche

installé sur votre site.

 Le composant Liens web vous permet de gérer la liste des sites web dont vous

voulez afficher les liens dans votre site.

5.5.5 Le menu Extensions

Avec ce menu, vous accédez à la gestion de tous ces composants supplémentaires :

 le premier item, Installer/Désinstaller, vous permet d'ajouter ou de supprimer des

extensions – composants, modules, plugins, templates -,

 avec l'item Gestion des modules, vous pourrez gérer les modules du site par les

visiteurs - le frontend - mais aussi ceux qui constituent la partie administration - le
backend -. Vous pourrez choisir

o de les publier ou pas,
o de les placer au bon endroit, dans la colonne de gauche ou dans la colonne

de droite, en haut, en bas ...

o de les ordonner les uns par rapport aux autres…,
o de paramétrer ces différents modules.

 l'item Gestion des plugins permet, comme son nom l'indique, de gérer les plugins

mais personnellement, je n’y touche pas beaucoup ...

 l'item Gestion des templates vous permet d’assigner un template à votre site ou à la

partie administration du site. Vous accédez alors aux paramètres du template :
couleurs, en tête … et vous pouvez même éditer les principaux fichiers du template :

o le fichier index.php qui structure l’affichage des différents éléments dans les

pages de votre site Web,

o les feuilles de styles comme template_css.css qui contiennent les règles pour

afficher les différents textes de votre site.

Mais il existe de meilleurs outils pour modifier ces fichiers et de toute façon, il vaut
mieux faire une copie avant de les modifier.

 l'item Gestion des langues permet de choisir la langue par défaut.

Pour ceux qui n'ont pas tout suivi, la gestion des composants, une autre forme d'extension,
est faite au travers du menu précédent !

5.5.6 Le menu Outils

Ce menu comprend :

 la gestion de la messagerie privée pour les échanges avec les autres

administrateurs : lecture des messages et écriture d'un message,

 l'envoi de mails en nombre,
 la vérification globale du site, une action qui permet de clore toutes les opérations

de mise à jour en cours,

 le nettoyage du cache, important lors de mise à jour importante pour prendre en

comte les modifications.

Le menu Aide comme son nom l’indique ... ! Attention elle est (encore) en anglais.

Joom

la! 1.5 pour les nuls - v1.33 p 50/177

Chapitre : Vos premiers pas avec Joomla!

5.6 Pour aller plus loin

5.6.1 Un premier exemple avec la configuration globale

Dans le menu de l’interface d’administration, choisissez dans le menu Site l’option

Configuration globale.

L’écran suivant apparaît :

N’oubliez pas de bien configurer votre site :

 Dans Paramètres de localisation, choisissez l’heure de Paris (si vous habitez en

France bien sûr)

Joom

la! 1.5 pour les nuls - v1.33 p 51/177

Chapitre : Vos premiers pas avec Joomla!

 Dans Réglages email, afin de tester les fonctions liées au mail, configurez les

paramètres de votre boîte aux lettres et du serveur SMTP de votre fournisseur
d’accès Internet ; ceci vous permet d’envoyer des messages :

o Serveur e mail : choisissez Serveur SMTP dans la liste proposée
o Remplissez le champ Adresse de l’expéditeur avec votre adresse email ;

remplissez aussi le Nom de l’expéditeur

o Ensuite, en fonction des paramètres de votre boîte aux lettres, remplissez les

champs Utilisateur SMTP, Mot de passe SMTP si vous avez coché la case

Identification SMTP requise et Hôte SMTP.

Avec ce paramétrage, vous pourrez tester les fonctions Contacts et envoi de mail.

Remarque : Un site web envoie des messages mais généralement n’en reçoit pas !

5.6.2 Et ensuite ?

Avant de commencer à construire votre site, nous vous invitons à tester les différentes
fonctionnalités offertes par le jeu d’exemples fourni avec Joomla!

 Connectez-vous sur la partie administration à partir du menu de gauche,

 Créer un article, une rubrique, une section, publiez-les et visualisez les résultats,

 Tester le moteur de recherche,

 Créer un contact, insérez un élément de menu Contacts et envoyez vous ainsi un

mail,

 Changez les couleurs du template, changez de template …

Vous pouvez faire ce que vous voulez, et même tout casser car vous ne risquez rien.
Ensuite, à côté de ce site de tests, installez-vous une nouvelle instance de Joomla! pour

construire votre site.

5.7 Quelques limitations sur un site en local

Le site installé sur votre micro-ordinateur ne se comporte pas tout à fait comme le site que
vous allez installer chez votre hébergeur.

Les causes sont assez faciles à comprendre :

 Les versions des différents logiciels Apache, PHP et MySQL ne sont pas les mêmes,

 Le paramétrage n’est pas le même : sur une offre mutualisée, l’hébergeur doit

imposer certaines règles pour assurer la sécurité de toutes ses plateformes

 Votre micro n’a pas de relais de messagerie pour l’envoi et la réception de mails.

Vous aurez du mal à tester certaines fonctions en local comme la ré écriture des url,
l’envoi de newsletter, la fonction Contactez-nous …

Joom

la! 1.5 pour les nuls - v1.33 p 52/177

Chapitre : La gestion des articles

6 La gestion des articles

6.1 Introduction

Même si elle présente des limites qui pourront paraître contraignantes pour certains, la
gestion du contenu est l’une des grandes forces de Joomla. Dans la suite du document nous
allons mettre en place une structure d'articles catégorisés comme suit :

Un exemple de sections, de catégories et d'articles

Sections Catégories Articles

Japon

Asie

Guangzhou

Chine

Santiao du Chili

Chili

Puerto Monte

Buenos Aires

Argentine

Amérique du Sud

Tokyo

Hokkaido

Kyoto

Pekin

Nanjing

Shenzhen

Arica

Saita

Ushuaia

La Paz

Santa Cruz

Bolivie

Potosi

Copacabana

Soient 2 sections, Asie et Amérique du Sud ; dans la section Asie, 2 catégories, Japon et
Chine ; et dans la catégorie japon, 3 villes ...

Un article catégorisé est placé dans une structure Section / Catégorie. Pour bien

comprendre cette structure il faut simplement prendre en compte ces 3 règles :

 Une section est un conteneur parent ; elle ne peut contenir que des catégories.
 Une catégorie est un conteneur enfant du conteneur section ; elle ne peut contenir

que des articles.

 Un article ne peut appartenir qu’à une seule catégorie.

Joom

la! 1.5 pour les nuls - v1.33 p 53/177

Chapitre : La gestion des articles

Conclusion: pour créer un article, il faut au préalable avoir créé au minimum une section et
une catégorie.

Cette organisation permet de structurer le contenu de manière logique, elle est indispensable
si vous souhaitez publier beaucoup d'articles sur votre site.

Elle permet par ailleurs d'afficher l’ensemble des articles relatifs à une catégorie (ou à une
section), de manière dynamique. Par exemple, si dans un menu vous créez un lien vers une
catégorie, ce lien permettra d'afficher dynamiquement tous les articles rattachés à cette
catégorie.

Lors de la saisie d’un article, si vous ne remplissez pas le champ section, Joomla! lui
attribuera la valeur non catégorisé ; c’est une section comme une autre … De même si
vous ne renseignez pas le champ catégorie, vous aurez droit à la catégorie non catégorisé.

6.2 Comment classer vos articles

6.2.1 Création d’une section

 Sur le panneau d'administration, cliquez sur l'icône Gestion des sections ; vous

pouvez aussi choisir dans le menu Contenu l'item Gestionnaire de section,

 Dans la barre d'infos en haut, cliquez sur le bouton Nouveau,
 Saisissez un Titre,

 La saisie des autres paramètres est facultative : vous pouvez fournir une description,

limiter l'accès des articles de cette section en choisissant dans l'item Niveau d'accès

Enregistré ou Spécial ...

>> Les différents niveaux d’accès sont définis dans le paragraphe Les différents niveaux

d'accès

en page 106.

 Enfin, sauvegardez les modifications en cliquant sur le bouton Sauver et retournez

au panneau d'administration en sélectionnant dans le menu Site l'item Panneau
d'administration.

Joom

la! 1.5 pour les nuls - v1.33 p 54/177

Chapitre : La gestion des articles

Voilà, la section Amérique du sud est maintenant créée.

N’oubliez pas l’alias ! Si vous utilisez la fonction de ré écriture des urls – pour plus de
détails, se reporter au paragraphe La ré écriture des url de votre site en page 149 – l’alias de

la section va apparaître dans l’adresse des pages concernant cette section.
Ainsi, avec notre exemple, si l’alias de la section est amerique-du-sud, l’url de la page sera

de la forme www.mon-site.fr/amerique-du-sud ....

Une solution consiste à ne pas saisir d’alias ; Joomla! vous en proposera un et s’il ne vous
convient pas, vous pourrez le changer ensuite !

NOTE : vous ne pouvez pas supprimer une section tant qu'elle contient des catégories et, de

même, vous ne pouvez pas supprimer une catégorie tant qu'elle contient des articles (même
s'ils sont dans la corbeille!).

Alors supprimez les articles et videz la corbeille avant de supprimer une section ou une
catégorie

6.2.2 Création d’une catégorie

La démarche est similaire :

 Sur le panneau d'administration, cliquer sur l'icône Gestion des catégories,

Dans la barre d'infos en haut, cliquez sur le bouton Nouveau,

 Saisissez un Titre et choisissez dans l'item Section la section Amérique du sud que

nous avons créée à l'étape précédente,

 La saisie des autres paramètres est facultative : vous pouvez fournir une description,

limiter l'accès des articles de cette section en choisissant dans l'item Niveau d'accès

Enregistré ou Spécial ...

 Enfin, sauvegardez les modifications en cliquant sur le bouton Sauver.

Attention ! Choisissez des titres différents pour chaque catégorie. Si 2 catégories ont le

même titre, Joomla! et vous-même vous allez vous mélanger les pinceaux ! Et, quelque soit
le titre que vous choisissez ici, vous pourrez choisir le titre qui apparaîtra sur les pages de
votre site.

Joom

la! 1.5 pour les nuls - v1.33 p 55/177

Chapitre : La gestion des articles

Comme pour les sections, l’alias est utilisé pour la ré écriture des url. Avec l’exemple choisi,

vous obtiendrez une url de la forme www.mon-site.fr/amerique-du-sud/chili ....

6.3 La création d’un article

Dans le panneau d'administration, cliquer sur l'icône Ajouter un nouvel article.

Vous pouvez aussi cliquer dans le panneau d'administration sur l'icône Gestion des

articles et, dans la barre d'infos en haut, cliquez sur le bouton Nouveau.

L’écran suivant apparaît :

Toute cette page, n’apparaît pas à l’écran ! Il vous suffit de scroller – faire défiler vers le bas

- la page pour voir le bas de la page. Cette page se décompose en plusieurs zones :

 En haut, la barre d’infos avec les boutons,
 En dessous, une zone de saisie des caractéristiques de l’article,

Joom

la! 1.5 pour les nuls - v1.33 p 56/177

Chapitre : La gestion des articles

 Ensuite, la zone de saisie de l’article, surmontée de la barre d’outils de l’éditeur,

 A gauche, une zone Paramètres : Paramètres – Article, Paramètres – Avancés,

Informations des méta-données

 Enfin, en bas de la page, quelques boutons : Image, Saut de page, Lire la suite …

Nous allons vous présenter toutes ces fonctions dans les paragraphes qui suivent.

6.3.1 La structure d'un article

Un article comprend :

 un titre,
 des paramètres comme

o le nom de l'auteur, la date de création, la date de modification
o des données de classification : nom de la section et de la catégorie qui

contient l'article

o des méta données pour faciliter les recherches au travers des moteurs de

recherche

o et tout un tas de paramètres très utiles ...

 un texte d'introduction, ou accroche ; dans le monde journalistique on parle aussi de

chapeau. Ce texte va apparaître sur la page de votre site lors de l'affichage d'une
liste d'articles (voir affichage de type blog) ; il présente l'article et invite l'internaute à
lire la suite de l'article.

 et enfin le corps de l'article, encore appelé texte principal de l'article !

6.3.2 La saisie d'un article

Enfin, vous allez créer votre premier article ! Vous entrez dans la fenêtre de création comme

nous vous l'avons indiqué précédemment (icône Ajouter un nouvel article dans le panneau

d'administration)

La barre d'infos comprend les boutons suivants :

 un bouton Prévisualiser qui vous donne un premier aperçu de votre article, assez

approximatif avec la plupart des templates,

 mais si vous voulez vous rendre compte du résultat final, et que vous avez déjà créer

le menu qui permet d’afficher cet article, appuyez sur le bouton

un nouvel onglet en appuyant sur le bouton

et allez sur votre site sur

, puis ouvrez

l'article modifié. N'oubliez pas de rafraîchir l'affichage (commande actualiser dans
Firefox, 3e bouton à gauche)

 si tout cela vous convient, appuyez sur Sauver,

Joom

la! 1.5 pour les nuls - v1.33 p 57/177

Chapitre : La gestion des articles

 ou sinon appuyer sur Annuler pour tout effacer ...

Dans la zone de saisie des caractéristiques de l’article :

 Saisissez le titre de votre article ; ce titre s'affichera dans les pages web (à moins que

dans le paramétrage vous refusiez l'affichage du titre),

 Si vous ne saisissez pas la zone Alias, Joomla! génèrera lui même un Alias à partir

du Titre en remplaçant les blancs et les caractères spéciaux par des caractères
ANSI,

 Classez votre article en sélectionnant une valeur dans le menu Section et une valeur

dans le menu Catégorie,

 Vous pouvez choisir de publier l'article (et l'article apparaîtra automatiquement dans

le menu qui affiche la section ou la catégorie) ou simplement préparer le travail pour
une publication future.

 Enfin, comme la page d'accueil est une sélection d'articles, vous pouvez choisir de

faire paraître cet article dans la page d'accueil.

Dans la zone de saisie du texte de l'article, vous pouvez soit saisir un texte court, soit

structurer votre article en 2 parties :

 un texte d'accroche, qui correspond au texte d'introduction de l'article, qui va

apparaître sur la page d'accueil ou sur la page présentant les différents articles d'une
section ou d'une catégorie (présentation de type blog),

 le corps de l'article, encore appelé texte principal de l'article.

Pour séparer en deux l’article saisi, lors de l’affichage en mode blog par exemple, et insérer

un lien Lire la Suite, cliquez sur le bouton Lire la suite en bas de la zone de saisie ; une

ligne de pointillés rouges apparaît alors dans la zone de saisie.

En dessous de la zone de saisie du texte, vous trouvez 3 boutons :

Joom

la! 1.5 pour les nuls - v1.33 p 58/177

Chapitre : La gestion des articles

 Image pour insérer une image dans l'article (voir plus bas),
 Saut de page pour introduire un saut de page au milieu du corps du texte (voir plus

bas),

 Lire la suite pour séparer le texte d'introduction du corps du texte de l'article, comme

nous venons juste de vous le dire.

Le nouvel article a été créé avec succès. Notez les filtres d'affichage (section, catégorie id),
qui vous permettront de retrouver rapidement un article dans la liste de tous les articles du
site.

6.4 Les paramètres de publication d'un article

Vous pouvez définir les paramètres de publication d’un article à 3 niveaux :

 Un niveau global, applicable par défaut à tous les articles de votre site.
 Un niveau menu, où, pour un élément de menu, vous définissez comment vous

voulez voir afficher les articles de cet élément.
Ainsi, vous allez définir comment vous voulez voir afficher les articles pour un

élément de menu donné, mais aussi pour la page d’accueil, car celle-ci est un
élément de menu (menu Home dans le menu Main menu).

 Un niveau article, où vous allez définir les règles de publication particulières à un

article donné.

Concrètement comment ça marche lors de l’affichage d’un article ?

Joomla! regarde la valeur du paramètre définie au niveau de l’article ; il y a 3 valeurs
possibles : Oui/Montrer, Non/Masquer ou Paramètres Globaux.

 Si la valeur saisie est Oui/Montrer ou Non/Masquer, Joomla! exécute l’action

demandée et il n’y a pas d’autres contrôles.

 Si la valeur est Paramètres Globaux, Joomla! regarde la valeur définie au niveau de

l’élément de menu concerné :

o Si la valeur saisie est Oui/Montrer ou Non/Masquer, Joomla! exécute l’action

demandée et il n’y a pas d’autres contrôles.

o Si la valeur saisie au niveau de l’élément de menu est Paramètres Globaux,

Joomla! va chercher l’action demandée au niveau global et l’exécute.

6.4.1 Les paramètres de publication d’un article par défaut

La première fois que vous saisissez un article, il vous faut faire quelques réglages pour

définir ces Paramètres globaux :

 Cliquez dans le panneau d'administration sur l'icône Gestion des articles, ou bien

cliquez sur l'icône Ajouter un nouvel article puis, dans la barre d'infos sur le bouton

Annuler,

 Dans la barre d'infos, cliquez sur Paramètres et vous voyez alors apparaître une

fenêtre au milieu de l'écran qui va vous permettre d’accéder aux différents
paramètres de publication, rangés par bloc.

Voici une description rapide des différents paramètres :

 Dans le premier bloc, vous pouvez notamment choisir d’afficher le titre de l'article ou

de le cacher, d’afficher ou non l’introduction de votre article si vous avez choisi de le

Joom

la! 1.5 pour les nuls - v1.33 p 59/177

Chapitre : La gestion des articles

publier en mode blog. L’option Afficher les non autorisés vous permet d’afficher à

tous les visiteurs le titre et le texte d’intro d’un article avec un accès limité.

 Le second bloc permet d’afficher, en dessous du titre d'un article, le nom de la

section et le nom de la catégorie le contenant et, en cliquant sur le nom de la

section (ou de la catégorie), de voir tous les articles contenus dans cette section (ou
cette catégorie); ces options sont peu utilisées. Si vous rendez le titre de la catégorie
cliquable, l'appui sur le titre de la catégorie fera s'afficher la liste de tous les articles
de la catégorie :

 C'est généralement dans le troisième que l'administrateur intervient : selon les choix

que vous allez retenir pour votre site web, vous n'allez pas forcément afficher la date
de dernière modification de l'article (affichée en bas de l'article dans certains

templates), ou même la date de création. L'item Afficher la navigation permet
d'afficher en bas de chaque article les boutons Précédent et Suivant pour passer

d’un article à l'autre ...

 Le quatrième bloc permet de faire apparaître les icônes Imprimer, Envoyer,

Générer un fichier pdf, votez sur l'article ... Attention avant d'activer une icône

comme Générer un pdf ! il vaut mieux vérifier avant que la fonction marche bien

avec votre template et votre hébergeur.

Joom

la! 1.5 pour les nuls - v1.33 p 60/177

Chapitre : La gestion des articles

 Lorsque vous décidez de créer des flux RSS encore appelés fils d’actualités, il faut

activer le module Syndication pour générer ces flux (voir dans l’exemple fourni avec
Joomla! le libellé Feed Entries - et le bloc suivant vous permet de choisir de

n’afficher que le texte d’introduction ou tout l’article,

 Dans le bloc suivant, la fonction Option de filtrage est décrite dans le paragraphe Le

filtrage du contenu

du chapitre Maintenance et autres réglages en page 136.

Le plus simple est de tester les différentes options et de vérifier le rendu : avec votre
navigateur, vous ouvrez un onglet sur les pages d'administration et un autre onglet sur le site
lui même pour voir le résultat (n'oubliez pas de rafraîchir la page du site pour voir avant et
après)

Et de toutes façons ces choix pourront être modifiés pour chaque article !

6.4.2 Les paramètres de publication des articles d’un menu

Lorsque vous créez un menu, vous voyez dans l’onglet Paramètres Composants les

paramètres d’affichage propres aux articles de cet ensemble, comme décrits dans les

paragraphes Liste d’articles

et Articles en mode blog en page 88 .

Attention, si un article est aussi publié sur la page d’accueil, les paramètres retenus pour
l’affichage sont ceux définis pour l’ensemble de la page d’accueil, comme décrits dans le

paragraphe Configurer l’affichage !

en page 97 .

6.4.3 Les paramètres de publication d'un article

Lorsque vous créez ou éditez un article, un certain nombre de paramètres sont disponibles
dans le volet de droite:

 Paramètres - article : Joomla! pré remplit certains champs comme le nom de

l'auteur, la date de création, la date de dernière mise à jour ... et la même la date de
fin de publication si vous voulez voir disparaître un article de votre site à une date
donnée. Vous pouvez ici modifier ces valeurs.

Joom

la! 1.5 pour les nuls - v1.33 p 61/177

Chapitre : La gestion des articles

 Paramètres avancés : vous retrouvez ici toute une série de paramètres que vous

avez déjà saisis dans le chapitre précédent pour l'ensemble des articles. Ceci vous
permet de changer ce comportement par défaut pour l'article que vous venez de

saisir. Vous pouvez aussi changer le libellé Lire la suite ...

 Informations des méta données : Vous pouvez ici saisir les données qui vont

permettre le référencement de votre site, et de cet article en particulier.

Les informations saisies servent à renseigner les balises <meta name= …> placées en
haut de page et normalement utilisés par les moteurs de recherche, quoique beaucoup
de moteurs de recherche ne les utilisent plus. Voici quelques valeurs particulières du
champ Robots :

o noindex indique au robot de ne pas indexer la page
o nofollow indique au robot de ne pas suivre les liens derrière cette page

6.5 La saisie d’un article

6.5.1 L'éditeur de texte

Nous vous présentons ici l’éditeur fourni par défaut avec Joomla! mais il existe d’autres
éditeurs comme JCE ; rassurez-vous : vous retrouverez dans la plupart des éditeurs ces
commandes, et d’autres !

L'éditeur est un plugin que vous pouvez configurer ; vous pouvez configurer notamment la

barre d'outils ; pour la configuration de ce plugin, rapportez vous au paragraphe La

configuration de l'éditeur de texte
…

en page 77.

Voici la barre d’outils proposée par l’éditeur en mode Avancé :

dans le chapitre Modules, menus, composants et plugins

En mode étendu, vous pouvez obtenir une barre avec beaucoup plus d’outils :

Le mode d’emploi est simple ; par exemple :

 Pour mettre un mot en gras, sélectionnez le et cliquez sur l’icône ou ,

 Pour justifier un paragraphe, sélectionnez le avec la souris et cliquez sur l’icône

Certaines icônes correspondant à des fonctions non accessibles dans la phase de saisie
sont estompées, comme l’icône chaîne dans l’écran ci-dessus. Voici une rapide description
des boutons proposés par défaut en modes avancé et étendu ; certaines fonctions
complexes sont décrites ensuite comme la gestion des images, des liens …

Joom

la! 1.5 pour les nuls - v1.33 p 62/177

Chapitre : La gestion des articles

A

6.5.2 Les fonctions de base de l'éditeur

Sur la première ligne de la barre d’outils :

Met le texte sélectionné en gras. (B comme Bold ou G comme Gras)

Met le texte sélectionné en italique.

Souligne le texte sélectionné. (U comme Underline ou S comme Souligné)

Barre le texte sélectionné

Aligne le texte sélectionné à gauche.

Aligne le texte sélectionné au centre.

Aligne le texte sélectionné à droite.

Justifie le texte sélectionné.

Applique un style css du template au texte sélectionné – fonction difficile

à utiliser avec l’éditeur proposé par défaut avec Joomla!

pplique un format conventionnel (les standards HTML) au texte

sélectionné : paragraphe, Adresse, Titre 1 …

Les fonctions proposées sur la seconde ligne

Liste à puces. En cliquant une première fois, vous créez la liste (indentation1du
paragraphe) ; en cliquant une seconde fois, vous annulez la mise en forme.

Liste numérotée

Réduit l'indentation.

Augmente l'indentation.

Annule la dernière opération.

Refait la dernière opération annulée.

Insère ou modifie un lien hypertexte. Allez au paragraphe Comment créer un lien

vers une autre page dans ce chapitre en page 69.

Efface les liens hypertexte qui sont sélectionnées.

1

Indentation d’un paragraphe : mise en retrait du paragraphe.

Joom

la! 1.5 pour les nuls - v1.33 p 63/177

Chapitre : La gestion des articles

A

Insère un lien dans une page (saut à l’intérieur d’une même page)

Insère ou modifie une image. Pour l’insertion d’une image, le bouton en bas de la

page est plus simple d’emploi (voir le paragraphe La gestion des images
chapitre en page 70

).

Nettoie le code et retire les paramètres non désirés. Cet outil est très utile lorsque
vous copiez du contenu provenant de logiciels de bureautique.

Accès à l’aide en ligne de l’éditeur

Affiche le texte au format HTML ; cette fonction est utile pour contrôler le bon
codage de la page, voire modifier le code html généré. Attention ! la modification
du code html est une opération dangereuse !

Les fonctions présentes sur la dernière ligne

▬ Insère une ligne horizontale

dans ce

Supprime les styles appliqués du texte sélectionné. Cet outil est très utile pour
supprimer le style de contenu provenant de logiciels de bureautique !

ffiche le cadre d’un tableau. Vous pouvez construire des tableaux avec un cadre

invisible ; cette fonction visualise les bordures de votre tableau.

Transforme le texte sélectionné en Exposant

Transforme le texte sélectionné en Indice

Insérer un caractère spécial. L'appui sur ce bouton fait apparaître une fenêtre avec
une liste de caractères spéciaux ; cliquer sur le caractère voulu pour l'insérer dans
votre texte à l'endroit du curseur.

6.5.3 Les autres fonctions proposées en mode étendu

La première ligne comprend les fonctions supplémentaires suivantes :

Applique une police de caractères au texte sélectionné. A déconseiller

sauf cas particulier.

Applique une taille de caractères au texte sélectionné.

Sur la seconde ligne :

Recherche un mot ou une lettre dans un texte

Recherche un mot ou une lettre dans un texte et le remplace par le texte saisi

Joom

la! 1.5 pour les nuls - v1.33 p 64/177

Chapitre : La gestion des articles

Insertion de la date courante ; le format est défini lors de la configuration du plug-in

Insertion de l’heure courante ; le format est défini lors de la configuration du plug-in

Applique la couleur au texte sélectionné

Applique la couleur au fond du texte

Afficher l'éditeur en pleine page / Réduire

La troisième ligne vous propose la boîte à outils pour créer et gérer les tableaux :

Insère un nouveau tableau

Définit les propriétés de la ligne sélectionnée du tableau

Définit les propriétés de la cellule sélectionnée du tableau

Ajouter une ligne au tableau avant la ligne courante

Ajouter une ligne au tableau après la ligne courante

Supprime la ligne courante

Ajoute une colonne au tableau avant la colonne courante

Ajoute une colonne au tableau après la colonne courante

Supprime la colonne courante

Divise les cellules

Fusionne les cellules sélectionnées

Vous trouvez ensuite les fonctions suivantes :

Insère un smiley (ou emoticone)

Insère / édite un fichier multi média (formats Flash, QuickTime, RealMedia,
Shockwave, Windows Média)

Insère une ligne horizontale « configurable » : vous pouvez choisir la largeur de la
ligne, son épaisseur (hauteur), proposer un effet relief …

Précise que l’on écrit de gauche à droite

Précise que l’on écrit de droite à gauche

Joom

la! 1.5 pour les nuls - v1.33 p 65/177

Chapitre : La gestion des articles

La quatrième ligne propose d’abord des fonctions de copier coller très intéressantes

Coupe le texte sélectionné

Copie le texte sélectionné

Colle le texte précédemment sélectionné à l’endroit où est positionné le curseur.

Colle le texte sélectionné après l’avoir nettoyé (suppression des balises html)

Colle le texte sélectionné dans un document Word après l’avoir nettoyé

(suppression des codes proposés par Word) (voir le paragraphe Comment coller

un texte à partir d'un document Word dans ce chapitre en page 66).

Sélectionne l’ensemble du texte de l’article

Elle propose ensuite la gestion de calques :

Insère un calque

Place le calque devant

Place le calque derrière

Fixe la position de l’élément sélectionné (position absolue)

Les autres fonctions ajoutées dans la dernière ligne sont les suivantes :

Permet de modifier le style du texte sélectionné

Visualise certains caractères cachés comme les espaces insécables ; un second
appui sur ce bouton désélectionne cette fonction

Insère un espace insécable

6.5.4 Comment coller un texte à partir d'un document Word

Vous avez saisi le brouillon de votre article sous Word ou un autre traitement de texte
comme OpenOffice Writer et vous voulez le publier ...

Le format de fichier utilisé par Microsoft Word est très différent du format html ; si vous faites

un simple couper-coller, Word laissera un tas de scories dans la page de votre site qui

pourront perturber l’affichage de vos pages.

Cette remarque s’applique aussi au copier coller à partir du contenu d’un email ou d’un texte
extrait d’un autre outil bureautique.

Mais vous avez les outils nécessaires pour reprendre ce texte et le convertir au format html ;
ce chapitre vous donne quelques conseils pour la mise en forme.

Joom

la! 1.5 pour les nuls - v1.33 p 66/177

Chapitre : La gestion des articles

La méthode la plus radicale et la plus sûre : passer par l'intermédiaire d'un éditeur de
texte !

Si vous voulez être sûr d'avoir un code html propre, vous pouvez utiliser la méthode suivante

Préparez votre texte sous Word :

 Supprimez les tableaux et les images, les effets de style : le texte doit être du texte

brut non formaté !

 Sélectionnez le texte à copier,

 Copiez le texte par la commande Edition Copier ou le raccourci Ctrl C (maintenez la

touche Ctrl de votre clavier enfoncée et appuyez en même temps sur la touche C)

Passez par l'intermédiaire d'un éditeur de texte basique

 Prenez un éditeur simple comme notepad ou Block Edit

 Placez-vous dans l'éditeur et copier la sélection dans l’éditeur, avec la commande

Crtl V ; nettoyez, le cas échéant, les caractères spéciaux.

Copier le résultat dans la page contenant l'article

 Recommencez l'opération : sélectionnez tout le texte dans l'éditeur de texte

(commande Crtl A ) et copiez le dans le presse papier (avec la commande Crtl C),

 Placez-vous dans la fenêtre de saisie de Joomla! et copiez, avec la commande

Copier ou la commande Crtl V.

Il ne reste plus qu'à refaire la mise en page - mais au moins elle est cohérente avec le reste
du site.

Si vous êtes sur Mac, vous savez que la touche Crtl est remplacée par la touche Pomme !

La méthode la plus simple : l’outil coller Word

Les risques :

- La présence de balises saut de ligne et saut de paragraphes qui se traduira par desécarts
entre les paragraphes de textes variables

- Une reprise aléatoire des tableaux.

Préparez votre texte sous Word :

 Supprimez les tableaux et les images, les effets de style : le texte doit être du texte

brut non formaté !

 Sélectionnez le texte à coller,

 Copiez le texte par la commande Edition Copier ou le raccourci Ctrl C (maintenez la

touche Ctrl de votre clavier enfoncée et appuyez en même temps sur la touche C)

Retournez sur l’écran de saisie de l’article :

 Placez vous sur l’endroit où vous souhaitez coller le texte,

 Appuyez sur l’icône et l’écran suivant apparaît …

Joom

la! 1.5 pour les nuls - v1.33 p 67/177

Chapitre : La gestion des articles

 Collez le texte par la commande Crtl V (maintenez la touche Ctrl de votre clavier

enfoncée et appuyez en même temps sur la touche V),

Ensuite, dans tous les cas, vous reprenez les outils offerts par Joomla! pour faire la mise en
page.

La méthode à déconseiller !

Préparez votre texte sous Word :

 Supprimez les tableaux et les images, les effets de style : le texte doit être du texte

brut non formaté !

 Sélectionnez le texte à coller,

 Copiez le texte par la commande Edition Copier ou le raccourci Ctrl C (maintenez la

touche Ctrl de votre clavier enfoncée et appuyez en même temps sur la touche C)

Retournez sur l’écran de saisie de l’article :

 Placez vous sur l’endroit où vous souhaitez coller le texte,

 Collez le texte par la commande Crtl V (maintenez la touche Ctrl de votre clavier

enfoncée et appuyez en même temps sur la touche V),

 Word laisse pas mal de scories pour définir les polices de caractères, leur taille, leur

couleur .. Je préfère tout nettoyer et reprendre les styles définis dans le template pour
conserver une cohérence dans la présentation des articles. Il vous suffit alors de

sélectionner l'ensemble du texte et choisir les bons outils : le pinceau
messy code - ou mieux encore la gomme

 Refaire l'opération plusieurs fois et dans les cas les plus récalcitrants éditez le texte

"remove formating"

- Cleanup

au format html pour le corriger ou supprimer le paragraphe qui vous résiste ...

Joom

la! 1.5 pour les nuls - v1.33 p 68/177

Chapitre : La gestion des articles

Pourquoi vous présenter cette méthode alors que nous vous la déconseillons ?
Si vous laissez d’autres personnes saisir des articles, elles risquent fort de faire un simple

copier coller et il vous sera peut être utile de connaître ces commandes si vous récupérez

sur votre site un article mal formaté !

6.5.5 Comment créer un lien vers une autre page

Vous voulez faire un lien entre le document que vous saisissez et un autre document de
votre site ou sur un site Web externe …

 Ouvrez le navigateur (Internet Explorer ou autre) sur la page cible, par exemple :

http://www.joomla.fr/

 Il vous faut maintenant mémoriser cette url ; deux solutions s’offrent à vous :

o Vous copiez cette adresse sur une feuille de papier
o Mieux, vous la placez dans le presse-papier de votre ordinateur : positionnez-

vous sur la barre de navigation de votre navigateur, sélectionnez l'adresse et

appuyez sur les 2 touches Ctrl C (Ctrl+C)

 Revenez dans Joomla! sur la page du document où vous voulez introduire ce lien et

sélectionnez la zone de texte qui porte le lien (dans notre exemple, la chaîne de

caractères retenue est Joomla! France)

 Choisissez la commande Insérer/Modifier un lien

La fenêtre suivante s'ouvre ;

Joom

la! 1.5 pour les nuls - v1.33 p 69/177

Chapitre : La gestion des articles

Remplissez alors le formulaire :

 Placez le curseur dans la fenêtre Link URL et tapez l'url de la page cible à la main ou

faites la commande Ctrl V pour coller l'adresse mémorisée dans le presse papier

 Vous pouvez choisir d'ouvrir cette page cible dans la page du site ; il est préférable

de choisir l'option Ouvrir dans une nouvelle fenêtre – Open in new windows.

 La zone Info-bulle comprend le titre de la page cible ; saisissez le lien sans faute

d’orthographe (cette donnée est exploitée par les moteurs de recherche)

 Et terminez en appuyant sur le bouton Insérer - Insert !

REMARQUES :

Si vous voulez faire un lien sur une adresse e mail, dans le champ Link URL, insérer la
valeur MAILTO avant l’adresse : - MAILTO : pré[e-mail] – et lorsque
l’internaute cliquera sur ce lien, son logiciel de messagerie s’ouvrira avec en destinataire
l’adresse indiquée !

Si vous faites un lien vers une page du site, il faut saisir une adresse relative, c'est-à-dire
une adresse sans le nom de domaine du site ; ainsi il faut remplacer

http://www.monsite.com/mapage.htm par /mapage.htm ,

6.5.6 Pagination d'un article

Prenons l'exemple d'un article qui traiterait de la démographie, de l'histoire, du climat, des
données économiques de la ville de Santiago du Chili. Si vous êtes prolixe, l'article risque
d'être particulièrement long. La conséquence directe c'est que vos visiteurs devront utiliser la
barre de défilement verticale de leur navigateur pour parcourir l'article dans son intégralité.

Dans certains cas comme celui-ci, il peut être utile de « paginer » un article, c'est à dire le
découper en plusieurs parties accessibles via un index. Joomla! va vous permettre de créer
cet index en quelques clics seulement!

 Editez l'article de votre choix (menu Contenu / Tous les articles)
 Insérez la commande de saut de page en cliquant sur le bouton Saut de page qui se

trouve en bas de la zone de saisie. Renseignez alors le titre de la seconde page.

 Une ligne en pointillés gris matérialise le saut de page.

6.6 La gestion des images

Pour agrémenter vos articles vous souhaiterez certainement y insérer à un moment ou à un
autre des images ou des photos …Rien de plus facile avec les plug-ins de gestion des
images ... (!)

Bon d'accord, commençons par le commencement.

6.6.1 Préparez vos images

Les images que vous allez utiliser doivent respecter quelques règles :

 Choisissez des images au format jpeg, sauf si vous voulez un fond transparent –

format png- ou vous insérez un schéma – format gif -.

 Les images doivent être re dimensionnées à la bonne dimension ... Une image qui

prend toute la largeur de la page ne peut dépasser 490 pixels de large ! Ceci peut
vous sembler petit mais il faut tenir compte de l'affichage sur des petits écrans !

Joom

la! 1.5 pour les nuls - v1.33 p 70/177

Chapitre : La gestion des articles

Certes, les outils proposés par Joomla! permettent de redimensionner les images d’un
appareil photo mais il vaut mieux réduire leur taille avant de les mettre sur votre site :

 pour réduire le temps de téléchargement de vos pages,
 pour réduire le volume Web de votre site, et diminuer ainsi la facture chez votre

hébergeur.

Comment mettre en forme vos photos ? Il suffit d'utiliser un logiciel de retouche d'images

fourni avec votre appareil photo ou avec un logiciel comme The Gimp (très complet) ou

paint.net (plus simple).

6.6.2 Ranger vos images

D'abord, vous devez vous procurer vos images puis les stocker dans un répertoire précis de

Joomla! en l'occurrence, il s'agit du répertoire /images/stories, Si vous avez beaucoup

d'images à gérer, il est préférable de créer différents sous-répertoires pour classer les
images, et s'y retrouver ! Par exemple, dans l'exemple proposé au début de ce chapitre,
vous pouvez créer :

 un sous répertoire /images/stories/asie,
 un sous répertoire /images/stories/amerique_du_sud.

Remarque : pour ne pas avoir d'ennuis, choisissez pour les répertoires et les images des
noms sans caractères spéciaux : caractères accentués, espaces, blancs ….

6.6.3 Charger vos images sur le site

Il y a 2 façons de procéder, qui dépendront essentiellement de la quantité d'images que vous
souhaitez transférer sur votre site. Dans le cas de figure le plus simple vous souhaitez
simplement insérer une nouvelle image dans un article. Il vous suffit d'utiliser le

Gestionnaire de médias accessible depuis la console d'administration par le menu Site /
Gestions des médias :

Joom

la! 1.5 pour les nuls - v1.33 p 71/177

Chapitre : La gestion des articles

o Dans la fenêtre Fichiers, choisissez le répertoire stories ou l'un de ses sous

répertoires.

Pour faciliter le classement des images, nous vous conseillons de les ranger
par répertoire. Pour créer un sous répertoire, il vous suffit de saisir dans la
zone de texte sur fond jaune, en haut à droite, le nom du sous répertoire que

vous voulez créer – par exemple mes_images – et de cliquer sur le bouton

Créer un dossier en haut à droite,

o Dans la fenêtre Transférer un fichier, le bouton Parcourir les fichiers vous

permet de sélectionner sur votre micro ordinateur les images à transférer, le

bouton Lancer le transfert réalise le chargement des fichiers sélectionnés.

ANOMALIE : Chez mon hébergeur, la fonction Transférer un fichier ne marchait pas : tout

semble bien se passer mais cela se plante à la fin …La configuration utilisée par mon
hébergeur n'apprécie pas l'animation flash ...

Alors, il suffit d'aller dans le menu Configuration globale - Système - et dans l'onglet

Paramètres des médias, il faut cocher Non pour le paramètre Activation de l'interface de
transfert en flash.

Cette méthode a ses limites: si vous souhaitez transférer des dizaines d'images, vous allez
devoir répéter cette opération des dizaines de fois ... Il y a beaucoup plus simple
heureusement :

 Si vous êtes en local, utilisez l'explorateur de fichiers pour copier vos photos dans le

dossier qui va bien.

 Si votre site est (déjà) hébergé sur Internet, utilisez votre client FTP pour les uploader

(transfert de votre micro-ordinateur sur le répertoire images de votre site).

6.6.4 Insertion d'une image dans un article

Bon, ceci étant fait, cliquez sur le menu Contenu / Tous les articles puis éditez l'article

dans lequel vous allez insérer une image (cliquez sur le titre de l'article pour passer en mode
édition).

 Placez le curseur à l'endroit où vous souhaitez insérer l'image,

 Cliquez sur le bouton Image en base de l'écran, la fenêtre suivante s’ouvre :

Joom

la! 1.5 pour les nuls - v1.33 p 72/177

Chapitre : La gestion des articles

 Sélectionner l'image à insérer, en changeant éventuellement de répertoire,

 Une fois l'image sélectionnée, l'url de l'image apparaît dans le champ url, -

images/stories/mes_images/hotel.jpg par exemple

 Si vous souhaitez aligner l'image par rapport au texte, choisissez dans la liste

Alignement le type d'alignement : à gauche ou à droite,

 Si vous voulez que l’image apparaisse sur votre site avec une légende, saisissez le

titre de l'image et cochez à côté la case Légende.

 Appuyez sur le bouton Insérer.

Une fois revenu dans l’écran de l’éditeur, cliquez sur l’image : des poignées – sous de petits
carrés sur le bord de l’image – apparaissent :

 il suffit de tirer sur l’une des poignées aux 4 coins pour redimensionner l’image tout

en gardant les mêmes proportions,

 en tirant sur les poignés sur les côtés, vous déformez les proportions de l’image.

De retour sur l’écran de gestion de l’article, cliquez sur le bouton Appliquer et regardez le
résultat, en ouvrant une seconde fenêtre sur le site web (il suffit d’appuyer sur le bouton Pré

visualiser). Il est bien entendu possible d'insérer plus d'une image dans un article ; vous

devez alors répéter cette opération autant de fois qu'il y a d'images à insérer.

Remarque : Attention ! l'url saisie doit être une url relative, de la forme

images/stories/articles.jpg.
Si l'adresse saisie est une adresse absolue, lorsque vous allez transférer les données sur un

site distant, Joomla! ira chercher les images sur votre micro ordinateur ... En cas de

problème, tapez dans le champ répertoire, en haut de la page, le caractère / pour faire

apparaître le chemin relatif.

Notes :

Vous avez peut être vu que vous pouvez directement transférer l'image de votre micro
ordinateur sur votre site à partir de cet écran de saisie, avec les boutons dans la fenêtre

Transférer :

Joom

la! 1.5 pour les nuls - v1.33 p 73/177

Chapitre : La gestion des articles

 la commande Parcourir les fichiers vous permet de sélectionner l'image à transférer

sur le site,

 la commande Lancer le transfert permet de télécharger l'image sur le site, dans le

répertoire indiqué en première ligne,

 il vous reste alors à sélectionner l'image ainsi téléchargée et à appuyer sur le bouton

Insérer, après avoir saisi son titre.

6.6.5 Et la marge autour de l’image ?

Dans la plupart des templates que j’ai utilisés, il n’y a pas de marge autour des photos …
Alors comment faire pour mettre une marge autour de l’image ?

Le plus simple est de revenir dans la page de saisie de l’article, de sélectionner l’image et

d’utiliser l’outil

dans l’éditeur.

Une fenêtre s’ouvre au milieu de l’écran : choisissez l’onglet Appearance et, si vous voulez
une marge de 10 pixels autour de l’image, mettez 10 dans les champs Vertical space et

Horizontal space.

Joom

la! 1.5 pour les nuls - v1.33 p 74/177

Chapitre : La gestion des articles

Vous constatez aussi que vous avez 2 paramètres pour redimensionner l’image. Si vous
souhaitez conserver les mêmes proportions entre la hauteur et la largeur, vous saisissez 150

dans la seconde case et vous laissez cochée la case Constrain proportions !

Appuyez sur le bouton Update et regardez le résultat :

6.7 L’insertion d’un document

Vous voulez insérer un document au format pdf – ou dans un autre format - dans un article
de votre site ! Rien de plus simple, il suffit de télécharger ce fichier, d’insérer le logo pdf par
exemple dans votre article et un lien sur cette icône vers ce fichier.

Etape 1 : téléchargez le document sur votre site

L’outil le plus adéquat est le gestionnaire de médias que vous avez déjà utilisé pour charger
des images :

 Créez votre formulaire sur votre micro-ordinateur avec un nom simple, sans blanc ni

caractères spéciaux,

 Sélectionnez dans le menu Site l’item Gestion des médias,
 Avec le bouton Créer un dossier, créez un sous dossier documents dans le

répertoire stories … comme cela vous aurez tous vos documents et les icônes
associés dans le même sous répertoire du répertoire stories !

 Parcourir le disque de votre micro-ordinateur pour sélectionner le fichier à

télécharger et lancer le transfert.

Attention ! Le nom du document ne doit contenir aucun caractère spécial : blanc, caractère

accentué, apostrophe …

Etape 2 : téléchargez l’icône pdf

Vous pouvez créer le lien sur un bout de texte, mais, pour faire beau, vous pouvez aussi
insérer dans l’article qui contient le formulaire l’icône qui représente un fichier pdf … Vous
pouvez trouver cette icône sur le site d’Adobe et l’enregistrer sur votre micro-ordinateur :

vous placez alors le pointeur de votre souris sur l’image, vous appuyez sur le clic droit et
vous sélectionnez dans la fenêtre la commande Enregistrer l’image sous …

Ensuite, comme toute autre image sur votre micro-ordinateur, vous la téléchargez sur votre
site avec le gestionnaire des médias

Joom

la! 1.5 pour les nuls - v1.33 p 75/177

Chapitre : La gestion des articles

Etape 3 : créer votre article avec le lien vers le document

 Créez l’article où vous souhaitez, insérez le document, insérez l’image de l’icône pdf,

sélectionnez l’image et choisissez la commande Insérer/Modifier un lien

 Attention ! il faut retenir votre souffle ! Il vous faut taper l’adresse correcte sans vous

tromper ! Soit images/stories/documents/test.pdf si le nom du document à insérer

est test.pdf

 Vous testez et, quand ça marche, vous recommencez en insérant le même lien sur le

groupe de mots contenant le nom du document, ici formulaire d’inscription …

ASTUCE : vous trouvez cela trop compliqué … Alors cherchez une extension pour vous
faciliter la vie, JCE Editor par exemple.

Remarque : si vous avez beaucoup de documents à télécharger, regardez du côté des

extensions de téléchargment comme Remository ou RokDownloads.

Joom

la! 1.5 pour les nuls - v1.33 p 76/177

Chapitre : Modules, menus, composants et plugins …

7 Modules, menus, composants et plugins …

Bon et bien voilà ! Les articles sont créés et rangés par catégories, elles-mêmes contenues
dans des sections. Le moment est venu de rendre visible tout cela sur votre site.

Comment ? On vous a déjà tout expliqué dans le chapitre 2 de ce document ! Pour faire très
simple :

 Le module est un bloc que l’on trouvera généralement autour du corps de la page

web, par exemple le menu à gauche de l'article,

 Le composant, c’est une mini application qui gère le corps de la page,

 Le plugin, c'est le bout de code qui fait quelque chose quand vous tapez sur une

touche de votre clavier !

Ce chapitre est un gros morceau ! Alors nous allons procéder par étape :

 D’abord, nous allons commencer ce chapitre par la gestion des modules de façon

générale, avant de nous focaliser sur un module particulier : le module qui permet
l’affichage d’un menu.

 Ensuite nous allons étudier les items de menus utilisés pour la publication des

articles avant de jeter un coup d’œil sur la page d’accueil.

 Et il y a toujours un composant derrière tout cela, nous continuerons par un petit tour

sur certains composants et modules standard, avant de jeter un coup d’œil sur les
plugins.

7.1 La gestion des modules

Notez qu'il existe d'autres types de modules:

 Modules installés nativement par Joomla! : Page d’accueil, Derniers Articles,

Articles les plus lus, Sondage...

 Modules installés avec les extensions que vous allez charger,

 Modules créés par vous : vous pourrez y saisir du texte par exemple.

7.1.1 Position des modules

A droite, à gauche, en haut ou ailleurs, tout est possible à condition que le template que vous
utiliserez prenne en charge ces positions. Notez par exemple que le template par défaut de
votre nouveau site comprend 3 colonnes : une colonne à gauche, une large colonne centrale
et une dernière à droite, ce n'est pas le cas de tous les templates.

Pour identifier les positions de modules prises en charge par un template :

 cliquez sur le menu Extensions / Gestion des templates,

 sélectionner le template que vous avez retenu pour votre site et cliquez dans la barre

d'infos sur l'icône Pré visualiser.

Le choix des positions de modules est à la discrétion des développeurs de templates, mais

généralement la position left correspond à la colonne de gauche, la position right à la
colonne de droite. Les positions user1 et user2 se situent le plus souvent au-dessus du
corps de la page, appelé également mainbody.

Joom

la! 1.5 pour les nuls - v1.33 p 77/177

Chapitre : Modules, menus, composants et plugins …

Concrètement, prenons comme exemple la page d’accueil du site fourni par défaut avec
Joomla! . C’est un site basé sur le jeu d’exemples fourni avec le package Joomla! et réalisé

avec le template rhuk milkyway. Ce template définit plusieurs positions dans lesquels vous

allez pouvoir placer les modules que vous voulez

(le rendu de la copie d’écran sur papier est très moyen .. faites le test sur votre micro ! )

 En haut, vous avez écrit en rouge le nom de la première position – top -, avec en

dessous la position user 3,

 Sur la position gauche – left -, vous avez 4 modules définis …

Ça ne vous parle toujours pas? Bon, allez faire un tour dans la liste des modules de site

(menu Extensions / Gestion des modules) : la page suivante vous montre la liste des

modules avec leur emplaceemnt dans la page :

Joom

la! 1.5 pour les nuls - v1.33 p 78/177

Chapitre : Modules, menus, composants et plugins …

Quelques remarques

 En dessous du libellé Gestion des modules, vous voyez que le mot Site est en

gras : vous affichez les modules utilisés du côté Site, le côté visible par tous. Si vous
cliquez sur le libellé Administrateur, vous verrez la liste des modules utilisés côté

Administration du site.

 La liste contient le nom du module, son état (publié ou non), son niveau d’accès, sa

position, son type …

 Dans le haut de la fenêtre, vous avez un certain nombre de filtres :

o Sélectionner le template : en choisissant votre template, vous écartez les

modules qui ne sont visibles d'aucune page (Champ Page = Aucun) et ceux
qui sont publiés dans les positions qui n'existent pas dans votre template,
(attention, il y a une anomalie sur ce filtre en version 1.57)

o Sélectionner la position : vous pouvez voir tous les modules à gauche par

exemple – position left -,

 Sélectionner l'état correspond à l'état activé – publié - ou non publié …

7.1.2 Ordre des modules

Si par exemple plusieurs modules sont publiés en position left, ils seront affichés l'un au

dessous de l'autre. Avant tout, pour bien voir les choses, dans l'écran précédent, vous

pouvez placer des filtres (sélectionnez la position left dans l’exemple précédent)

Vous souhaiterez peut-être modifier l'ordre dans lequel ils seront affichés. Pour ce faire vous

avez le choix entre cliquer sur les petites flèches vertes (vers le bas ou vers le haut)

ou saisir un numéro d'ordre en regard de chaque module dans la colonne Trier, puis

valider en cliquant sur l'icône représentant une disquette.

7.1.3 Activation/Désactivation des modules

A partir de cet écran, vous pouvez voir si un module est publié :

le statut Activé (encore appelé publié dans l'ancienne version) d'un module est

représenté par un signe vert

le statut Désactivé (encore appelé non publié) est représenté par une croix rouge.

Pour basculer du statut désactivé en statut activé, il suffit de cliquer sur la croix rouge en

regard du module et inversement …

Joom

la! 1.5 pour les nuls - v1.33 p 79/177

Chapitre : Modules, menus, composants et plugins …

Il est possible d'activer (publier) ou de désactiver (dépublier) plusieurs modules en une seule

fois en cochant la case précédente, le Nom du module, puis en cliquant sur le bouton

Activer (ou Désactiver) dans la barre d'outils en haut.

7.1.4 Les autres paramètres visibles sur cette page

Dans cette page, vous pouvez aussi voir les informations suivantes :

 Le niveau d’accès : Public, Enregistré ou Spécial. Public signifie que ce module

est visible par tous, Enregistré ou Spécial qu’il n’est visible que par des utilisateurs
identifiés ; voir le paragraphe Les différents niveaux d'accès

gestion des utilisateurs

 La position, comme nous en avons parlé dans un paragraphe précédent,
 Les pages dans lesquelles ce module apparaît, ou plus exactement, vous pouvez

en page 106 pour la description de cette fonction

choisir si, lorsque l’internaute a cliqué sur un menu, le module va être affiché : la

valeur Tous signifie que le module est toujours affiché, la valeur Variable signifie

qu’il n’est pas toujours affiché …

 La colonne Type comprend le nom technique du module

dans le chapitre La

7.2 Pour aller plus loin

Lorsque dans l’écran précédent, vous cliquez sur le nom d’un module, l’écran suivant
apparaît :

Voici l’exemple du module main menu . La partie à gauche, Détails, est commune à tous les
modules ; la partie droite, Paramètres est spécifique à chaque module ; il comprend les
onglets Paramètres du module, Paramètres avancés et Autres paramètres.

Joom

la! 1.5 pour les nuls - v1.33 p 80/177

Chapitre : Modules, menus, composants et plugins …

7.2.1 Détails d’un module

Nous vous avons déjà décrit presque tous les paramètres !

 Le Titre est le titre du module qui va s’afficher sur le site, si vous cochez l’option

suivante Montrer le titre,

 La position du module (à gauche, à droite, au dessus …) et l’ordre d’affichage du

module dans la zone,

 La gestion du niveau d’accès est décrite dans voir le paragraphe Les différents

niveaux d'accès

dans le chapitre La gestion des utilisateurs en page 106 ; elle permet

de n’afficher un module que pour des utilisateurs authentifiés.

7.2.2 Afficher un module en fonction de la page visitée

Cette fonctionnalité s'applique à n'importe quel type de module autonome. Dans la liste des

modules du site vous noterez que chaque module a une valeur Tous, Variables ou Aucun
dans la colonne page :

 Tous signifie que le module sera visible sur toutes les pages du site,
 Variables signifie que le module ne sera affiché que sur les pages activées par

certains modules,

 Aucun signifie que le module ne sera jamais affiché, même s'il est publié!

Pour paramétrer cette fonction, il faut entrer dans la gestion du module ; dans l’écran

précédent, vous avez le bloc Affectation de menu :

Vous pouvez décider d’afficher un module sur toutes les pages ou de ne l’afficher que sur
certaines pages ; dans ce cas, comme l’action qui déclenche l’affichage d’une page est
l’appui sur un item du menu, vous allez décidez alors sur quels items du menu va s’afficher
ce module :

 Cochez la case Sélectionner le(les) élément(s) de menu depuis la liste,

 Sélectionnez le menu ou les menus concernés …

Vous pouvez faire une sélection multiple en maintenant la touche Crtl appuyée et en cliquant

sur chacun des menus retenus. Vous voyez une sélection multiple dans l’exemple ci-dessus

Joom

la! 1.5 pour les nuls - v1.33 p 81/177

Chapitre : Modules, menus, composants et plugins …

Un autre exemple avec le jeu d’exemple fourni par Joomla! :

Nous allons illustrer cette fonctionnalité en créant un module placé dans un coin de la page
d’accueil ; Ce module comprendra un texte de présentation du site qui ne sera visible qu'en
page d'accueil.

 Ouvrez le menu Extensions / Gestion des modules.

 Afin d'aérer la page d'accueil et laisser la place au module que nous allons créer,

dépubliez les modules Bannières, Derniers articles et Articles les plus lus. Vous
pouvez aussi dépublier les modules en position right.

 Cliquez sur le bouton Nouveau et choisissez l’item html personnalisé
 Donnez un nom au module, sélectionnez la position user1, saisissez un texte de

présentation de votre site dans la zone de saisie Contenu …

 Cochez la case Sélectionner le(les) élément(s) de menu depuis la liste et

sélectionnez Home,

 Voyez le résultat sur la page d'accueil du site.

 Cliquez sur n'importe quel autre lien et observez le résultat.

7.2.3 Les autres fonctions pour paramétrer un module

Le contenu du reste de l’écran dépend du module choisi ; généralement, vous avez deux

blocs Paramètres du module : Paramètres Avancés et Paramètres - Système ; en

dehors de paramètres spécifiques au module, vous trouvez des paramètres pour définir les
règles d’affichage du module. Généralement, les valeurs par défaut conviennent et, en cas
de modification possible, c’est dans le mode d’emploi fourni avec le template que vous aurez
les explications !

7.2.4 La liste des modules proposés par Joomla!

Lorsque vous cliquez sur le bouton Nouveau, voici la liste des modules à votre disposition :

En dessous du titre Module, vous avez vu que le mot Site était en noir et en gras : vous êtes
sur l’onglet des modules pour la partie Site, c’est à dire la partie visible des internautes ; en

Joom

la! 1.5 pour les nuls - v1.33 p 82/177

Chapitre : Modules, menus, composants et plugins …

cliquant sur Administrateur, vous passez sur l’onglet des modules utilisables côté
Administration du site.

Quand vous passez la souris sur le nom d’un module, une fenêtre décrivant le module

s’affiche, comme ici la fenêtre décrivant le module Articles en rapport. Voici quelques

détails sur ces modules :

 Affichage du fil (mod_Feed) : ce module affiche un flux RSS venant d’un autre site,
 Articles en rapport (mod_related_item) : avec ce module, Joomla ! recherche tous

les articles qui ont des mots clefs en commun avec l’article affiché,

 Bannière (mod_banners) : ce module permet d'afficher les bannières, activées dans

le composant 'bannière', sur votre site. En cliquant sur l’image associée à la
bannière, le visiteur de votre site est redirigé vers le site de votre sponsor.

 Connexion (mod_login), pour gérer l’authentification des utilisateurs enregistrés (voir

paragraphe Le module de

 Contenu archivé (mod_archive) : ce module affiche un calendrier mensuel des

dans le chapitre La gestion des utilisateurs en page 113 )

éléments archivés ; il vous suffit de cliquer sur le nom d’un mois pour voir tous les
articles archivés datés de ce mois-là. Lorsque vous archivez un article – voir

paragraphe A propos de l'archivage

dans ce chapitre en page 95 -, cette liste est

automatiquement mise à jour. ,

 Contenu le plus lu (popular) (mod_mostread) : ce module affiche le titre des articles

les plus lus de votre site,

 Dernières actualités (mod_latestnews) : affiche la liste des derniers articles publiés

(ou mis à jour),

 Encapsuleur (Wrapper) (mod_wrapper) : permet d’insérer une page Web dans votre

site (en utilisant une i Frame)

 Fils d’Ariane (mod_breadcrumbs) : affiche le chemin suivi pour accéder à la page

affichée, par exemple Accueil > Amérique du Sud > Chili ; vous pourrez choisir dans

la configuration du module le nom du premier élément, Home ou Accueil,

 Flash d’information (mod_newsflash) : affiche au hasard un article différent à

chaque rafraîchissement de la page ; cet article appartient généralement à une
catégorie particulière contenant des brèves. Il peut aussi afficher plusieurs articles
horizontalement ou verticalement

 HTML personnalisé (mod_custom) : affiche une zone de texte personnalisée,
 Image au hasard (mod_random_image) : affiche au hasard une image, classée dans

un répertoire particulier,

 Menu (mod_mainmenu) : affiche un menu,
 Pied de page (mod_footer) : affiche les informations en bas de page, avec le

copyright Joomla!,

 Qui est en ligne (mod_whosonline) : affiche le nombre d’internautes connectés ; ce

module apparaît par défaut sur les pages de la partie administration,

 Recherche (mod_search) : un module de recherche sur votre site : vous tapez un

mot et vous trouvez tous les articles qui en parlent !

 Section (mod_sections) : affiche la liste des sections, ou du moins de celles que

vous avez choisi d’afficher (une table des matières de votre site en quelque sorte),

 Sondage (mod_poll) : affiche un sondage que vous avez conçu avec le composant

associé,

 Statistiques (mod_stats) : affiche quelques données statistiques sur votre site ;

Joom

la! 1.5 pour les nuls - v1.33 p 83/177

Chapitre : Modules, menus, composants et plugins …

 Syndication : ce module crée un flux RSS (ou fil d’actualité) à partir des articles de

votre site ; les internautes pourront alors s’abonner au flux RSS de votre site !

Le nom entre parenthèses correspond au nom technique du composant ; c’est ce nom qui

apparaît dans la liste présentée avec l’écran Gestion des modules. Comme vous pouvez le

constater, certains modules sont plus réservés à l’administrateur du site.
L’exemple de site fourni avec Joomla! vous donne un exemple d’utilisation de tous les

modules destinés aux internautes … Vous n’avez qu’a chercher sur la page d’accueil pour
les trouver !

7.3 La gestion des menus

Dans la liste des modules, vous voyez certains modules qui gèrent des menus. Nous allons
maintenant décrire cette fonction menu.

Dans l'exemple proposé précédemment, nous avons introduit 2 sections - Asie et Amérique
du Sud - et 5 catégories - Japon, Chine, Chili, Argentine et Bolivie -. Nous vous proposons
de créer un nouveau menu Amérique du Sud pour afficher les articles des catégories Chili,
Argentine et Bolivie..

Attention ! Nous vous conseillons de conserver le menu principal - main menu - car il a des

propriétés assez particulières ... En le supprimant sans prendre de précautions, vous
pourriez avoir de mauvaises surprises.

7.3.1 Création d’un nouveau menu et du module associé

Nous allons maintenant créer un menu et le module associé afin d'y placer des liens vers les
articles ou les catégories d'articles que nous avons créés.

 Choisissez dans le menu Menu l'item Gestions de menus,

 Cliquez sur le bouton Nouveau dans la barre d'outils,

Joom

la! 1.5 pour les nuls - v1.33 p 84/177

Chapitre : Modules, menus, composants et plugins …

Une fenêtre apparaît alors avec l'ensemble des paramètres de configuration du menu :

 Le champ Type de menu est le nom utilisé par Joomla! pour identifier le menu dans

le code. Ce nom doit être unique et vous ne devez pas utiliser d'espace ou de
caractères spéciaux pour ce nom.

 Le champ Titre est le nom tel qu'il sera vu sur le site par vos visiteurs.
 N’oubliez pas de remplir le dernier champ Titre du module ! C’est le nom donné au

module qui va gérer votre menu ! Si vous l’omettez, le module qui contient votre
menu ne sera pas publié ...

Renseignez les trois champs puis cliquez sur le bouton Sauver. Le nouveau menu a été

créé avec succès.

ATTENTION : si vous ne remplissez pas le dernier champ Titre du module, le nouveau

menu que vous avez créé ne va pas apparaître dans la liste des modules et vous ne pourrez
pas le publier !

7.3.2 La gestion du module associé au menu

Voyons voir ce qui s'est passé du côté des modules du site (menu Modules / Modules du

Site).

Vous pouvez constater que le module Amérique du Sud a été créé automatiquement, qu'il
n'est pas publié (non visible sur le site) et qu'il est en position Left, tout en haut. Vous pouvez
activer sa publication et le descendre en dessous de main_menu.

Joom

la! 1.5 pour les nuls - v1.33 p 85/177

Chapitre : Modules, menus, composants et plugins …

En cliquant sur le nom du module, amerique_du_sud, vous allez accéder à l’ensemble des

paramètres du module.

Bon, Joomla! a réalisé une configuration par défaut de l’ensemble des paramètres et nous
n’allons pas

Quelques repères :

 L’onglet Affectation du menu permet de choisir dans quelle page sera affiché ce

 Dans l’onglet Paramètres du module, vous pouvez modifier le style de menu selon



rentrer d

menu ; cette fonction a été décrite précédemment.

les instructions fournies avec le template ou, dans le cas de menus avec des
menus, pour préciser comment vous voulez gérer l’affichage des sous menus ; cette

fonction sera décrite dans le paragraphe La gestion de sous menus
Dans l’onglet Paramètres avancés, vous pouvez gérer le

menu.

Ainsi, dans l'exemple du template rhuk_milkyway, il faut saisir _menu dans la zone
Suffixe de classe de module. Et vous trouverez dans les feuilles

template (fichier ccs) une classe style –menu
règles sont précisées dans les informations fou

7.4 La publication de vos article

ans tous les détails !

en page 90.

style pour afficher votre

de styles du

pour définir le style du menu. Ces

rnies avec le template.

s

so

us

7.4.1 Ajout d’un lien dans un menu

Bien, revenons à nos moutons. Après avoir s

nous proposons d'afficher tous les articles de la catégorie Chili sous la forme d

e av c le titre de chaque article, son auteur ...

 Si ce n'est pas déjà fait, cliquez sur le menu Menu / amerique_du_sud ,
 Vous pouvez aussi cliquer sur le menu Menu / Gestion des menus ; l’écran suivant

s’affiche :

Joom

la! 1.5 pour les nuls - v1.33 p 86/177

tructuré nos articles en Sections / Catégories,

ite tableau

Chapitre : Modules, menus, composants et plugins …

Cliquez alors sur l’icône

 L’écran suivant s’affiche :

Dans le menu Menus, sélectionnez le menu dans lequel vous allez ajouter des liens,
Amérique_du_sud par exemple, puis cliquez sur le bouton Nouveau. Vous découvrez alors

une première liste d'éléments de menus :

Joom

la! 1.5 pour les nuls - v1.33 p 87/177

Chapitre : Modules, menus, composants et plugins …

Nous allons nous focaliser dans un premier temps sur la publication de vos articles, avec 2
exemples : la publication de la liste des articles d’une catégorie et la publication des articles
d’une catégorie en mode blog.

Si vous voulez faire ce test, saisissez au préalable une section, une catégorie, et des articles
dans cette catégorie.

7.4.2 Liste d’articles

 Dans Lien interne, cliquez sur Articles et dans Catégorie, Liste des articles d'une

catégorie,

L’écran suivant s’affiche :

Joom

la! 1.5 pour les nuls - v1.33 p 88/177

Chapitre : Modules, menus, composants et plugins …

 Le Titre est le texte qui apparaîtra dans le menu (attention à la longueur !),
 Si vous ne remplissez pas le champ Alias, il est rempli par Joomla!! Attention, cet

alias apparaîtra dans les url si vous avez choisi d’afficher des url explicites (SEO) ; je
rappelle qu’il ne faut ni blanc, ni caractère spécial !

 Le Niveau permet de limiter l’affichage de cet item de menu aux utilisateurs

authentifiés, ce point est traité dans le paragraphe L'accès aux fonctions d'édition
chapitre La gestion des utilisateurs

 Dans l’onglet Paramètres - basique, vous choisissez :

o le nom de la catégorie d’articles à afficher,
o Vous pouvez décider de montrer ou de masquer l’en tête de la liste,
o En cochant Filtre, vous ferez apparaître une fenêtre à l’écran qui permettra à

en page 116.

l’utilisateur d’afficher les articles d’après un mot dans le titre ou le nom de
l’auteur.

 Dans l’onglet Paramètres - Avancés, vous pouvez notamment choisir dans quel

ordre vous voulez afficher les articles :

o Défaut,
o Les plus anciens en premier,
o Les plus récents en premier,
o Par titre, dans l’ordre alphabétique (de A à Z),
o Par titre, dans l’ordre alphabétique inverse (de Z à A),
o Par auteur, dans l’ordre alphabétique (de A à Z),
o Par auteur, dans l’ordre alphabétique inverse (de Z à A),
o Les plus populaires, c'est-à-dire les plus lus, d’abord
o Les moins populaires,
o Ordre : l’ordre que vous avez défini dans la gestion des articles !

du

 Dans l’onglet Paramètres - Avancés, vous pouvez modifier les paramètres

d’affichage des articles que vous aviez défini par défaut lors de la saisie d’un article,

au paragraphe Les paramètres de publication d’un article par défaut

 Dans l’onglet Paramètres - Système, vous pouvez modifier le style d’affichage (ccs)

en page 59,

et le Titre de la page qui va s’afficher lorsque l’internaute va sélectionner cet item de

menu, si le nom de la catégorie ou de la section ne vous convient pas !

Pour en savoir plus sur un paramètre, survolez les noms de champs pour afficher une
infobulle explicative),

 Voyons ce que cela donne sur le site en cliquant sur les boutons et

 Si vous ne voyez pas le lien, c'est que le module Amérique du Sud n'est pas publié;

rendez-vous dans la liste des modules du site pour y remédier !

7.4.3 Articles en mode blog

Nous proposons d'afficher tous les articles de la catégorie Chili sous la forme dite blog : un

titre, un texte d'introduction et un lien vers la suite de l'article.

Joom

la! 1.5 pour les nuls - v1.33 p 89/177

Chapitre : Modules, menus, composants et plugins …

 Allez dans la page de gestion du menu Amérique du Sud et cliquez sur le bouton

Nouveau,

 Dans Lien interne, cliquez sur Articles et dans Catégorie, Articles d'une catégorie

donnée en blog,

Vous retrouvez un écran de saisie somme toute assez comparable à celui pour la Liste des
articles d'une catégorie. Cependant, dans la partie droite, Paramètres - Basique vous

pouvez gérer la disposition des articles : la configuration par défaut vous propose

o dans la partie Principal, en haut, un article,
o dans la partie Intro qui suit, 4 articles répartis en 2 colonnes,
o enfin, l'affichage de liens pour les 4 articles qui suivent.

Vous pouvez modifier le nombre d'articles à afficher en page d'accueil, le nombre de
colonnes... Par exemple, si vous souhaitez afficher tous vos articles sur une colonne, vous

devez passez la valeur du champ Colonnes de 2 à 1. Les options d'affichage sont multiples,

à vous de tester!

7.4.4 La gestion de sous menus

Joomla! permet très simplement de hiérarchiser les liens en se basant sur une structure lien

enfant / lien parent.

Par exemple, vous avez créé votre site pour présenter vos voyages et vous pensez
qu’afficher la liste de toutes les villes que vous avez visitées dans le menu de gauche
prendrait trop de place … Alors, utilisez les sous menus : déclarez le lien Argentine comme

parent des liens Buenos Aires, Salta et Ushuaïa :

 Lorsque l’internaute se connecte sur la page d’accueil, il ne voit dans le menu de

gauche que la liste des pays,

 En cliquant sur l’élément Argentine, il fait apparaître, en dessous de l’élément

Argentine, les liens liens Buenos Aires, Salta et Ushuaïa

Vous avez un exemple de sous menu dans le jeu d’exemples fourni avec Joomla! :

L’élément de menu What’s new in 1.57 a pour parent l’élément de Menu Joomla! Overview :

Joom

la! 1.5 pour les nuls - v1.33 p 90/177

Chapitre : Modules, menus, composants et plugins …

Dans la définition de cet élément de menu – commandes Menu – Main Menu puis
cliquez sur What’s new in 1.57 - , vous voyez que dans la fenêtre Elément parent,
l’item Joomla! Overview est sélectionné

Lorsque que vous avez sélectionné Main menu – commandes Menu – Main Menu – vous
voyez que l’item What’s new in 1.57 apparaît en décalage.

Joom

la! 1.5 pour les nuls - v1.33 p 91/177

Chapitre : Modules, menus, composants et plugins …

Concrètement, sur la page d’accueil, vous ne voyez que Joomla! Overview mais si vous
cliquez sur Joomla! Overview, vous voyez apparaître les sous menus :

(le menu avant le clic)

(le menu après le clic sur Joomla ! Overview)

Par défaut, seul le lien parent est visible … Il faut cliquer sur le lien parent pour afficher les
sous menus …

Vous pouvez choisir de toujours afficher les sous menus : il vous suffit d’aller dans la

configuration du module qui gère l’affichage de ce menu – sélectionnez le menu Gestion

des modules puis cliquez sur Main Menu - et de cocher le bouton radio Oui face au

paramètre Toujours afficher les sous menus dans l’onglet Paramètres :

Pour le menu horizontal, les règles sont quelque peu différentes et dépendent du template.

7.5 Les éléments de menu

Dans le paragraphe précédent, nous avons étudié 2 éléments de menu pour publier vos
articles. Maintenant, nous allons étudier en détail tous les autres éléments de menu.

Lorsque dans un menu, vous appuyez sur le bouton Nouveau, vous voyez apparaître toute

la liste des éléments de menus :

Joom

la! 1.5 pour les nuls - v1.33 p 92/177

Chapitre : Modules, menus, composants et plugins …

Nous allons d’abord étudier la première rubrique – Lien Interne – Articles avant de regarder

les autres éléments.

7.5.1 Les éléments de menus pour gérer un article

La première catégorie - Lien interne - Articles - permet de publier tout article du site :

 Archives

o Liste des articles archivés : cette fonction permet de publier tous les articles

archivés, classés par date. l'archivage d'un article (ou le retrait d'un article des

archives) se fait à partir de la Gestion des articles. Pour plus de détails, vous
pouvez consulter le paragraphe A propos de l'archivage

 Article

o Un article ; cette fonction permet de publier un article ; ceci permet d'afficher

par exemple toujours le même texte d'introduction dans la page d'accueil.

o Proposition d'article : avec cette fonction, un utilisateur ayant le statut

d'auteur (ou plus) pourra proposer un nouvel article. Pour plus de détails,

vous pouvez consulter le paragraphe L'accès aux fonctions d'édition
chapitre La gestion des utilisateurs

 Catégorie

o Articles d'une catégorie donnée en blog : c'est l'affichage des articles d'une

catégorie sous forme de blog (titre, texte d'introduction) comme décrit
précédemment.

o Liste des articles d'une catégorie : c'est l'affichage des articles d'une

catégorie sous forme d'une liste (titre, date, auteur), comme décrit
précédemment..

en page 116.

en page 95.

dans le

 Page d'accueil

o Page d'accueil au format blog : la fonction pour publier la page d'accueil, qui

n'est qu'une sélection d'articles du site. Le paragraphe Gestion de la page

d'accueil du site

en page 95 donne de plus amples informations sur ce

module.

Joom

la! 1.5 pour les nuls - v1.33 p 93/177

Chapitre : Modules, menus, composants et plugins …

 Section

o Articles d'une section donnée en blog : c'est l'affichage des articles d'une

section sous forme de blog (titre, texte d'introduction).

o Liste des articles d'une section : c'est l'affichage des articles d'une section

sous forme d'une liste (titre, date, auteur).

7.5.2 Les autres éléments de menus

 Lien interne : l'élément de menu génère une page à partir des données du site :

articles, contacts, ... En cliquant sur ces catégories, vous allez faire apparaître le
détail de chaque catégorie ...

o Articles : vous trouverez ici toute la boîte à outils pour gérer les articles,

décrite dans le paragraphe précédent.

o Contacts : tout pour afficher une page où l’internaute sera invité à vous

envoyer un mail ; cet élément s’appuie sur le composant Contacts. Pour en
savoir plus, consultez le paragraphe Avant propos

99

.

o Fils d’actualités, pour ouvrir une page contenant les actualités d’un autre

site ; la gestion des flux externes se fait au travers du composant associé.

o Sondage, pour afficher le résultat d’un sondage, géré par le composant du

même nom.

o Recherche : alors que le module vous affiche une fenêtre pour saisir le mot à

chercher, ici vous avez une page complète avec plusieurs critères pour faire
votre recherche et afficher les résultats,

o Utilisateur : vous retrouvez des éléments pour la gestion des utilisateurs.

Pour en savoir plus, consultez le paragraphe Le module de

La gestion des utilisateurs

o Liens Web, pour afficher les liens Web (vos sites préférés) ou inviter les

en page 113.

internautes à vous proposer des liens Pour en savoir plus, consultez le

paragraphe Liens Web

o Encapsuleur, pour afficher une page externe dans votre site.

dans ce chapitre en page 101.

dans ce chapitre en page

dans le chapitre

 Lien externe, l’élément du menu contient un lien vers une page Web externe,
 Séparateur, pour la mise en forme de vos menus,
 Alias : Si vous souhaitez appeler dans 2 menus le même élément de menu, 2 liens

sur la page d'accueil par exemple, il vaut mieux la seconde fois déclarer un alias vers

le premier élément accès à la page d'accueil.

7.5.3 Eléments d’un menu, modules, composants …

Vous allez trouver des éléments de menus qui traitent des mêmes sujets que les modules et
vous allez peut être vous poser alors la question : quelle est la différence entre les deux ?

 Un élément de menu provoque l’affichage d’un composant au milieu de la page, alors

que le module est un bloc sur une page …

Par exemple module Recherche et élément de menu Recherche :

 Le module vous affiche une fenêtre pour saisir le mot à chercher,

Ce module s’appuie sur un plug in qui va analyser le texte saisi pour activer la
recherche.

Joom

la! 1.5 pour les nuls - v1.33 p 94/177

Chapitre : Modules, menus, composants et plugins …

 Avec l’élément de menu, vous faites appel à un composant qui affiche une page

complète avec plusieurs critères pour faire votre recherche et afficher les résultats et
il y a toujours un plugin qui analyse le texte saisi par l’internaute.

Plus généralement, vous voyez que, pour réaliser une fonction complexe, il faut associer les
différents objets que sont composants, modules, éléments de menu et plugin …

7.5.4 A propos de l'archivage

Vous pouvez « archiver » un article en passant par le menu Contenu / Tous les articles.
Vous devez ensuite cocher le(s) article(s) à archiver puis cliquer sur le bouton Archiver dans

la barre d'outils Joomla!
Pour sortir un article des archives, vous devez passer par le même chemin : cochez l’article

archivé concerné et appuyez le bouton Désarchiver.

Vous pouvez afficher les articles archivés de 2 manières :

 En ajoutant un lien dans un menu : choisissez dans Archives, Liste des articles

archivés : cette fonction permet de publier tous les articles archivés, classés par

date. l'archivage d'un article (ou le retrait d'un article des archives) se fait à partir de

la Gestion des articles.

 En ajoutant le module Contenu archivé, Ce module affiche un calendrier mensuel

des éléments archivés..

7.6 Gestion de la page d'accueil du site

Comme nous l’avons décrit dans le chapitre Introduction à Joomla! , la page d’accueil

proposée par Joomla! affiche un composant qui propose l’affichage d’une sélection d’articles
du site en mode blog.

Comment ça marche ? Lorsqu’un internaute se connecte sur votre site, Joomla ! va chercher

dans le menu Main menu l’élément de menu précédé d’une étoile, l’étoile signifiant ici que

cet élément est utilisé par défaut. L’élément proposé dans l’exemple fourni avec Joomla! est

l’élément Home – ou Accueil - dont le type est Page d’accueil en mode blog.

Nous allons d’abord vous montrer comment gérer ce composant.

7.6.1 Ajouter un article en page d'accueil

Vous pouvez afficher n'importe quel article avec le composant page d'accueil. Pour ce

faire, vous avez plusieurs possibilités :

Joom

la! 1.5 pour les nuls - v1.33 p 95/177

Chapitre : Modules, menus, composants et plugins …

 Rendez-vous dans la liste des articles - menu Contenu / Gestion des articles et

dans la colonne page d'accueil, cliquez sur la croix rouge

pour la transformer en

 Dans l'en tête de la page proposée pour créer ou gérer un article, sélectionnez

l'option Page d'accueil (2

e

colonne) et cochez la case Oui.

7.6.2 Classer vos articles en page d’accueil

Pour afficher la liste de tous les articles affichés en page d'accueil vous devez passer par le

menu Contenu / Gestion de la page d'accueil.

L’écran suivant s’affiche :

Joom

la! 1.5 pour les nuls - v1.33 p 96/177

Chapitre : Modules, menus, composants et plugins …

De là, vous pourrez gérer les articles de la page d’accueil, et plus particulièrement retirer
certains articles de la page d’accueil, changer l’ordre d’affichage des articles. Par défaut,
Joomla! vous propose d'afficher les articles dans l'ordre où vous les créez mais vous pouvez

modifier l’ordre d’affichage, avec les flèches

par exemple !

7.6.3 Configurer l’affichage !

L’affichage de cette sélection d’articles se fait par le paramétrage d’un élément de

menu Home ou Accueil que l’on retrouve dans le menu Main Menu :

L’élément associé est un élément un peu particulier, Page d’accueil au format blog, choisi
dans la liste des éléments de menus : Lien Interne – Article – Page d’accueil ; cet élément
se gère comme l’élément Catégorie - Articles d’une catégorie donnée en blog dont nous

avons parlé précédemment.

Pour accéder au paramétrage :

 Ouvrez le menu Menu / Mainmenu (lui et pas un autre!)
 Editez le lien Accueil (ou Home si vous avez conservé le titre anglais) ... et voilà!

Joom

la! 1.5 pour les nuls - v1.33 p 97/177

Chapitre : Modules, menus, composants et plugins …

Vous retrouvez dans l’onglet Paramètres – Basique les règles d’affichage des articles ;

dans l’exemple choisi, nous avons l’affichage des 10 premiers articles en mode blog (si la
page d’accueil en comprend 10) sur une seule colonne …

7.6.4 Welcome to the Frontpage

Si vous cliquez sur l’onglet Paramètres – Système, vous voyez apparaître la mention
Welcome to the Frontpage qui a traumatisée plus d’un néophyte !

Vous savez comment faire pour vous’en débarrasser : saisissez un autre titre (qui apparaîtra
comme titre de votre page dans votre navigateur) et, le cas échéant, cochez sur le bouton

radio Non pour le paramètre Afficher le titre de la page pour ne pas le voir en en-tête de

votre page d’accueil !

7.6.5 Et pour changer l’affichage en page d’accueil

Si vous ne voulez pas afficher en page d’accueil une sélection d’articles de votre site, il vous
suffit, dans le menu main menu, de choisir l’élément qui vous convient, de le sélectionner et

de cliquer sur l‘icône

La sélection d’articles Page d’accueil en format blog peut être appelée par un autre

élément de menu.

.

7.7 Eléments de menus et composants

Nous avons déjà parlé de composants comme le composant qui gère le contenu d’une page
mais il existe aussi des composants qui sont des mini applications intégrées à votre site. Ces
composants disposent de leur propre interface de configuration accessible par l’interface
administrateur.

Nous allons vous présenter ici les composants standards qui s’appuient généralement sur
des éléments de menus

Joom

la! 1.5 pour les nuls - v1.33 p 98/177

Chapitre : Modules, menus, composants et plugins …

7.7.1 Les composants standards

Cliquez sur Composants ; l’écran suivant apparaît :

Dans l’exemple ci-dessus, vous voyez apparaître la liste des composants proposés par
défaut avec Joomla! :

 Le composant Bannières gère des images qui contiennent un lien vers un sponsor.

L’affichage de la bannière est géré par un module,

 Le composant Contacts permet de créer un annuaire de contacts. L’usage de ce

composant est décrit ci-après dans le paragraphe Contacts

 Le composant Fils d’actualités gère des flux RSS venant d’autres sites Web.

.

L’affichage de ces flux se fait par un élément de menu (Lien interne)

 Le composant Sondage vous permet de créer un petit sondage : une question et

plusieurs réponses possibles (appelées options). L’affichage du sondage sur votre
site se fait au travers d’un module ; la consultation des résultats au travers d’un
élément de menu (Lien interne)

 Le composant Recherche est le moteur de recherche intégré à votre site. Le

lancement de ce moteur de recherche se fait

o soit au travers d’un module : (affichage d’une fenêtre pour saisir le mot à

rechercher)

o soit au travers d’un élément de menu (Lien interne) qui affiche une page

complète avec plusieurs critères de recherche

o via l’interface d’administration, vous pouvez gérer des statistiques sur les

recherches effectuées par les visiteurs de votre site.

 Le composant Liens Web gère les pages contenant des liens vers d’autres sites

Web ; L’usage de ce composant est décrit ci-après dans le paragraphe Liens Web

7.7.2 Contacts

.

Ce module permet de créer un annuaire de contacts avec pour chacun la possibilité
d’afficher les coordonnées complètes, une image et un formulaire de contact par mail. C’est

ce composant qu’on utilise généralement pour créer une page Contactez-nous sur un site

Web.

Tout contact doit être rangé dans une catégorie :

 Si vous n’avez qu’un seul contact, vous devez le mettre dans une catégorie, que

vous pouvez appeler Contacts …

Joom

la! 1.5 pour les nuls - v1.33 p 99/177

Chapitre : Modules, menus, composants et plugins …

 Mais supposons que vous faites le site d’un club sportif, vous pouvez créer une

catégorie Bureau où vous mettrez la liste des membres du bureau de l’association, et
une catégorie Entraîneurs sportifs …

Pour créer un contact, il faut d’abord créer une catégorie :

 Dans le menu Composants, sélectionnez Contacts puis Catégories,
 Cliquez sur l’icône Nouveau,
 Saisissez le nom de la catégorie dans le champ Titre ; Joomla! met à jour le champ

Alias automatiquement et les autres champs ne sont pas utilisés … Si vous en

doutez, il suffit de cliquer sur l’icône Aide !

Vous pouvez ensuite créer le contact :

 Dans le menu Composants, sélectionnez Contacts puis Contacts,
 Cliquez sur l’icône Nouveau,

Détails :

 Saisissez le nom du contact dans le champ Nom ; Joomla! met à jour le champ Alias

automatiquement ;

 Choisissez une catégorie

 Le champ Lier à l’utilisateur permet de faire un lien entre un contact et un

utilisateur : même adresse électronique, paramètres en commun …

Informations

 Remplissez les différents champs qui décrivent le contact ; le terme Position du

contact désigne le poste ou le statut du contact

Joom

la! 1.5 pour les nuls - v1.33 p 100/177