✐ ✐
✐ ✐
Toutes les marques citées dans cet ouvrage sont des
marques déposées par leurs propriétaires respectifs.
ISBN 978-2-10-072396-6
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page III — #3
✐ ✐
Remerciements. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . XIII
Avant-propos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . XV
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page IV — #4
✐ ✐
Procédures et qualité . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
1.4 Transférer votre site chez votre hébergeur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
Découvrir le monde de l’hébergement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Effectuer la migration de vos données . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
1.5 Mettre à jour son site Joomla! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
Qu’est-ce qu’une mise à jour ? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
Est-il nécessaire de faire une mise à jour ? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
Anticiper les problèmes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
Mise à jour facile et automatique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
Mettre à jour son site manuellement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page V — #5
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page VI — #6
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page VII — #7
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page VIII — #8
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page IX — #9
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page X — #10
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XI — #11
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XII — #12
✐ ✐
Index. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 257
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XIII — #13
✐ ✐
Remerciements
Parce que Joomla! est un projet construit par des développeurs bénévoles et qu’il est le fruit du
travail d’une communauté, nous tenons ici à remercier et à féliciter l’ensemble des développeurs
ayant pris part au projet. Merci également aux millions d’utilisateurs quotidiens dont les retours
permettent l’amélioration continue de ce projet collaboratif. Ils contribuent avec les 3 millions de
messages sur le forum de www.joomla.org à l’émergence d’idées nouvelles et à l’amélioration
continue de ce logiciel de gestion de contenu.
Merci à la communauté francophone de Joomla! Ce site est une mine d’information et nous
invitons tous les utilisateurs de Joomla! à parcourir les différents espaces : portail, extensions,
aide, communautés et supports, les forums bien sûr dans lesquels vous trouverez bien des
réponses à vos problèmes.
Plus particulièrement nous tenons à dédicacer ce livre aux administrateurs et modérateurs
du site www.joomla.fr et aux membres de l’AFUJ (Association Francophone des Utilisateurs de
Joomla) qui nous ont permis d’apprendre, tout simplement, à utiliser et apprécier ce CMS si
polyvalent.
À la communauté française de Joomla!
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XIV — #14
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XV — #15
✐ ✐
Avant-propos
Pour la petite histoire, le projet Joomla! est hérité du projet Mambo, qui existe toujours.
Créé en août 2005 par une bonne partie des développeurs du projet Mambo qui ont opéré
une scission avec la société propriétaire du nom, Joomla! a très rapidement bénéficié du
soutien des utilisateurs et d’une excellente notoriété. Le 1er septembre 2005, le nom du
projet devient « Joomla ». Il s’agit de l’orthographe anglaise du mot arabe « jumla » qui
peut être traduit par « phrase ». Le mot existe également en swahili et en urdu et signifie
« tous ensemble », c’est la traduction retenue par la communauté. Nous invitons ceux
parmi vous qui s’intéresseraient à la genèse du projet à lire ce rappel des faits qui date
de l’époque de la scission : http://forum.joomla.fr/showthread.php?1738-Mambo-part-en-
vrille&p=8500#post8500.
Avertissement
Le nom JoomlaTM (www.joomla.org) est utilisé sous licence limitée de Open Source Matters
(opensourcematters.org), le propriétaire mondial de la marque de commerce. Le présent ouvrage
n’est ni affilié à Open Source Matters ou au projet Joomla! ni approuvé par l’un ou par l’autre.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XVI — #16
✐ ✐
Vous pouvez administrer votre site sans jamais voir une seule ligne de code : c’est ce qui a fait la
popularité de Joomla!. Cela veut dire que pour la mise à jour des contenus de votre site, vous n’êtes
plus obligé de posséder les compétences d’un développeur ou d’y faire appel.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XVII — #17
✐ ✐
Avant-propos XVII
site « Centre régional d’information des Nations Unies pour l’Europe occidentale » des Nations
Unies, au plus culturel à l’image du site du château de Versailles, en passant par le site du
constructeur automobile Peugeot, découvrez, naviguez : souvent, des exemples valent mieux que
des mots.
Centre régional d’information des Nations Unies pour l’Europe occidentale – Le centre (UNRIC), ouvert en
2004, fournit des informations et de la documentation aux pays suivants : Allemagne, Belgique, Chypre, Danemark,
Espagne, Finlande, France, Grèce, Irlande, Islande, Italie, Luxembourg, Malte, Monaco, Norvège, Pays-Bas, Portugal,
Royaume-Uni, Saint-Marin, Saint-Siège et Suède. Ce site Joomla! est accessible en 13 langues : http://www.unric.org
Vous trouverez d’autres sites réalisés avec Joomla! sur l’annuaire des sites Joomla! : http://community.
joomla.org/showcase.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XVIII — #18
✐ ✐
Musée Geggenheim – Musée d’art de renommée internationale mais également une des plus importantes icônes
architecturales du XXe siècle, le Musée Guggenheim est à la fois un centre culturel, un établissement d’enseignement et
le cœur d’un réseau international de musées : http://www.guggenheim.org
Château de Versailles – Le château de Versailles se relooke avec un Joomla! en trois langues dont le chinois. Achetez
vos billets en ligne, naviguez entre le Grand Trianon et les jardins grâce à une carte interactive, une vraie splendeur (le
site aussi bien sûr) : http://www.chateauversailles.fr
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XIX — #19
✐ ✐
Avant-propos XIX
Peugeot – Découvrez le site officiel du constructeur français dans sa livrée multilingue et plein écran :
http://www.peugeot.com
En aucun cas, un prestataire ne peut vous faire payer le logiciel Joomla!. Par contre, vous pouvez
tout à fait acheter une prestation comprenant l’installation, le paramétrage ou bien une formation.
Vous trouverez toutes ces informations dans ce livre.
Le logiciel Apache (le serveur Web) est également gratuit, tout comme Linux et le logiciel
MySQL (le serveur de base de données). En revanche, vous allez devoir acheter un espace
disque (pour stocker les fichiers de Joomla! et les vôtres), de la bande passante (pour faire
transiter vos données) et payer pour certaines fonctionnalités telles que l’administration de vos
noms de domaines, l’accès FTP (qui vous permet d’envoyer vos fichiers sur le serveur Web) et
quelques autres dont nous parlerons plus loin : tout ceci faisant référence à ce que l’on appelle
habituellement l’« hébergement ». Il existe différents types d’hébergement, mais presque tous les
hébergeurs en proposent un de type LAMP (Linux + Apache + MySQL + PHP). C’est précisément
ce qu’il vous faut !
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XX — #20
✐ ✐
À partir de la version 1.6, nous avions eu droit à une refonte en profondeur des fonc-
tionnalités majeures : la gestion des droits des utilisateurs, l’arborescence des contenus et de
nombreuses améliorations du code. Les nouveautés proposées depuis la version 3 vont vous
permettre d’aller encore plus loin et encore plus facilement.
Vous pouvez enfin profiter des templates « Responsive », ces chartes graphiques qui adaptent
leur ergonomie en fonction de la taille de l’écran du navigateur. Cela vous permet de proposer
votre site aussi bien pour des utilisateurs sur ordinateur que pour les utilisateurs dotés de tablettes
et de smartphones. La version 3 de Joomla! est d’ailleurs livrée avec un template responsive côté
administration et un template responsive côté utilisateur.
Côté développeur, en plus de l’interopérabilité avec « Microsoft SQL Server », Joomla est
maintenant utilisable avec une base de données PostgreSQL. Les développeurs seront ravis
d’apprendre l’intégration du Bootstrap de Twitter dans le JUI (l’interface graphique de Joomla!),
sous la forme d’un SDK.
D’autre part, la raison d’être de Joomla! étant de gérer du contenu, il nous a semblé
important de concevoir un ouvrage non seulement consacré à la mise en ligne et à la publication
des contenus multimédia, mais également à ce qui est le fer de lance des webmestres, à savoir
le référencement au sens large.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XXI — #21
✐ ✐
• Guillaume-Nicolas MEYER
Diplômé en informatique et en communication Guillaume-Nicolas Meyer a exercé comme
développeur, chef de projet web et chargé de communication digitale, en web-agency,
SSII, PME et chez des institutionnels. Utilisateur de Joomla! depuis sa création, il y a
10 ans, l’auteur a conçu par exemple un portail multilingue suite à une subvention
de la commission européenne, un site marchand pour 100 000 clients, des actions de
positionnement numérique, des portails de veille, etc. Intervenant à l’université et en école
de commerce (Licence, Master), il est actuellement manager chez ERDF.
• David PAULY
Développeur informatique de formation, David Pauly est aujourd’hui responsable des
applications collaboratives au sein d’un grand groupe industriel. Spécialiste en intégration
des systèmes d’information, il est autodidacte et passionné des technologies Web depuis
plus de quinze ans. Habitué à gérer des volumes de données conséquents, il lui fallait
un gestionnaire de contenu capable de répondre à tous les cas de figures. Aujourd’hui,
avec sa version 3, Joomla! est pour lui sans conteste le CMS le plus pratique et le plus
polyvalent du marché.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XXII — #22
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XXIII — #23
✐ ✐
Les fichiers
téléchargeables
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page XXIV — #24
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 1 — #25
✐ ✐
PREMIÈRE PARTIE
Installer, paramétrer
et découvrir Joomla!
Bienvenue dans le monde du Web facile. En adoptant Joomla!, vous faites beaucoup plus que
de simplement choisir un nouveau logiciel : vous entrez dans le monde de l’open source, du
logiciel libre et vous faites désormais partie de la communauté de Joomla!, qui, en plus des
développeurs, compte de nombreux utilisateurs prêts à vous aider.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 2 — #26
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 3 — #27
✐ ✐
1
Installer votre Joomla!
Objectif
Ce chapitre va vous aider à mettre en place un Joomla! opérationnel et prêt à l’emploi. Que
vous n’ayez aucune connaissance technique ou que vous soyez le roi du php.ini, vous aurez,
à l’issue de ce chapitre, installé le gestionnaire de contenu le plus populaire et efficace du
moment.
1.1 PRÉREQUIS
Avant de vous lancer dans l’installation de Joomla!, et quelle que soit l’option que vous choisirez
(chez l’hébergeur ou en local), il vous faut au minimum quatre outils pour travailler : un éditeur
de texte, un client FTP, un logiciel de décompression et un navigateur Web, et ce, quel que
soit votre système d’exploitation (Windows, Macintosh, Linux). Les prérequis suivants sont pour
Windows, mais il existe des équivalents pour Macintosh et Linux.
Note aux utilisateurs de Joomla! 1.5 à 2.5 : sachez que l’installation n’a pas spécialement changé.
Notez néanmoins que vous pouvez désormais définir vous-même l’identifiant du super-administrateur.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 4 — #28
✐ ✐
Un éditeur de texte
Un éditeur de texte est un logiciel qui lit « comme du texte » un langage de programmation. Le
code lu n’est pas interprété ou exécuté, il est seulement présenté dans l’éditeur pour être modifié.
Rassurez-vous, vous n’avez rien à programmer dans Joomla! : il n’est donc pas nécessaire de
connaître un langage de développement. Néanmoins, un tel programme vous sera toujours
utile, par exemple pour modifier le fichier de configuration de Joomla!, ce qui sera le cas si vous
décidez d’installer Joomla! en local et que vous le transférez ensuite chez un hébergeur.
Nous vous proposons d’utiliser un outil gratuit et très performant favorisé par de nombreux
développeurs en environnement professionnel : Notepad++. Ce petit éditeur est extrêmement
polyvalent puisqu’il vous permet d’éditer plus d’une vingtaine de langages de programmation
différents. Il propose de surcroît la coloration syntaxique pour chaque langage : les balises,
fonctions et textes sont ainsi présentés dans différentes couleurs.
Un client FTP
Un client FTP permet de se connecter à distance sur un serveur pour y télécharger des fichiers. On
parle de « client » en opposition au « serveur » FTP, parce qu’il dépose (« upload ») ou récupère
(« download ») des fichiers sur le serveur.
Sans client FTP, vous ne pourrez pas déposer les fichiers chez votre hébergeur ni mettre à
jour les fichiers d’un site. Le deuxième prérequis est donc l’installation d’un client FTP sur votre
poste. Pour cela, nous vous proposons l’utilisation de FileZilla, gratuit et rapide.
Vous trouverez sur le site www.filezilla.fr toutes les explications pour son installation et son
utilisation ainsi que des tutoriels courts ou des vidéos.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 5 — #29
✐ ✐
1.1 Prérequis 5
Avouez que c’est moins facile à lire... Par ailleurs, vous n’avez ni image, ni vidéo, ni son, ni
lien, ce qui limite tout de suite l’intérêt du Web.
L’une des règles de l’art que doit suivre tout site Web est de pouvoir être lisible sous différents
navigateurs et différents systèmes d’exploitation. Pourquoi est-il important de souligner cette
évidence ? Tout simplement parce que le code source d’une page n’est pas interprété à l’identique
suivant que vous êtes sur Windows ou Linux, et que vous utilisez Internet Explorer, Mozilla
Firefox ou Google Chrome. Le code « valide » est défini par le W3C, un consortium qui définit
quelles normes le code doit adopter. L’écriture du code ne respecte pas toujours ces normes (les
développeurs n’ont pas tous le même niveau) et les navigateurs n’interprètent pas forcément le
code comme ils le devraient (eux aussi n’ont pas tous le même niveau).
S’il est plus difficile d’avoir trois ordinateurs à la maison ou au bureau pour tester Windows,
Linux et Macintosh, vous pouvez tout à fait installer plusieurs navigateurs sur un même poste.
Nous vous conseillons toutefois la dernière version d’Internet Explorer, Mozilla Firefox et Google
Chrome.
Astuce : pour vérifier à quoi ressemblera votre site sous différents navigateurs et systèmes d’exploita-
tion, vous pouvez utiliser le site http://browsershots.org qui vous créera à la volée des copies écran
du rendu en fonction des environnements choisis. Même si le processus est très lent, il s’avère très
pratique.
Conseil : pour fonctionner, Joomla! a besoin de trois éléments : un serveur Web, un serveur
de base de données et les librairies du langage PHP (utilisé pour interpréter le code de
Joomla!). Si vous ne savez pas à quoi servent ces éléments, rendez-vous à la section
« Comment Joomla! fonctionne-t-il ? » de l’Avant-propos.
Fort heureusement, des packs regroupant tout ce qu’il vous faut pour travailler existent pour
les systèmes d’exploitation Windows, Macintosh et Linux.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 6 — #30
✐ ✐
Que vous soyez sur Windows, Linux ou Macintosh, nous vous proposons d’utiliser un
environnement qui inclut le serveur Web « Apache », le serveur de base de données « MySQL »
et les librairies du langage « PHP ». Nous vous présentons ci-après l’installation de la suite
WampServer sur Windows.
Paramétrage de WampServer
Chaque version d’Apache, de MySQL et de PHP dispose de sa propre configuration et de
ses propres fichiers (données pour MySQL). Cela signifie que vous pouvez changer de version
d’Apache, de MySQL ou de PHP au sein même de WampServer, ce qui vous permet de reproduire
votre environnement de production au détail près.
WampServer dispose d’un « TrayIcon » (une icône dans la zone de notification rapide de
Windows) vous permettant de gérer et de configurer simplement vos serveurs, sans toucher aux
fichiers de configuration.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 7 — #31
✐ ✐
1.1 Prérequis 7
Avec un clic droit, vous pouvez changer la langue du menu de WampServer. Avec un clic
gauche sur l’icône de WampServer, vous pouvez notamment (figure 1.1) :
• gérer les services d’Apache et de MySQL ;
• passer en mode « en ligne » / « hors ligne » (accessible à tous ou limité à localhost) ;
• installer et changer de version d’Apache, de MySQL et de PHP ;
• activer et désactiver les extensions PHP dont vous avez besoin ;
• gérer les paramètres de configuration de vos serveurs ;
• accéder à vos logs.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 8 — #32
✐ ✐
Pas de migration
Ce n’est pas un petit travail que vous vous épargnez là. Il faut en effet savoir que beaucoup
de problèmes durables sur un site ont pour origine une mauvaise migration ou les bugs en
résultant. Si tout se passe bien, vous avez juste à « uploader » vos fichiers sur un coin de serveur
et à importer votre base de données. Quelques paramétrages dans le fichier de configuration
de Joomla! et le tour est joué... Mais il est vraiment rare que cela se passe ainsi.
En général, vous ne travaillez pas sous Linux, ni avec les mêmes versions d’Apache de
MySQL, de PHP, ni les mêmes « librairies » PHP, vous imaginez donc qu’il peut facilement y avoir
des problèmes de compatibilité.
Le problème le plus fréquent est celui de l’encodage. Les caractères sont encodés sous un
certain format dans votre base de données locale et lorsque vous les importez sur le serveur de
production, il y a une différence à l’affichage (par exemple des caractères bizarres remplacent
les lettres accentuées, rendant un texte de présentation ou un article illisibles). Nous verrons plus
loin comment corriger ce problème.
Un autre problème majeur est l’interopérabilité : imaginons que vous soyez amené à créer
votre site en local, c’est-à-dire sur votre poste, dans l’idée de saisir vos contenus tranquillement
et de tester vos fonctionnalités. Vous utilisez un composant qui permet de générer des images
miniatures à partir de photos que vous lui envoyez, puis de les afficher sur le site via une galerie
d’images qui propose dynamiquement différentes tailles d’images à télécharger. Une fois votre
site terminé, vous opérez une migration de l’ensemble sur votre serveur de production. Vous
vous apercevez alors que votre composant ne fonctionne pas du tout. Ce n’est pas un simple
bug : il ne fonctionne pas car la « librairie PHP » qui est installée chez vous n’est tout simplement
pas présente sur le serveur de votre hébergeur. Ne vous imaginez pas qu’il suffit de contacter
votre hébergeur pour qu’il rajoute un « package » et redémarre un serveur sur lequel tournent
déjà de nombreux autres sites Web...
Gain de productivité
L’autre avantage de travailler directement en production est de gagner du temps. Par exemple,
dans le cas où votre site est censé être mis à jour par différentes personnes, il est rare que
celles-ci soient toutes géographiquement présentes au même endroit. Mettre votre Joomla! en
ligne en offrant la possibilité aux auteurs concernés de pouvoir commencer directement à saisir
leur contribution vous permettra de gagner du temps, ce qui ne vous empêchera pas de travailler
sur des ajustements de la charte graphique ou sur des fonctionnalités.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 9 — #33
✐ ✐
En travaillant en production, vous pourrez former les utilisateurs, leur permettre de commen-
cer à saisir, vous assurez que tout ce que vous mettez en œuvre fonctionnera à l’identique – ce
qui est vraiment important – tout en vous assurant une présence sur Internet.
Votre site en 10 minutes ? Joomla! est devenu si populaire que les professionnels de l’hébergement
proposent maintenant de vous le pré-installer, prêt à l’emploi. Les hébergeurs populaires en France
comme OVH ou 1&1 vous expliqueront dans leur interface comment, en quelques clics, installer le
CMS Joomla! sur un espace que vous aurez acheté.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 10 — #34
✐ ✐
Pour le choix de votre nom de domaine, optez pour quelque chose de simple et facile
à retenir comme www.joomla.fr plutôt que d’essayer de décrire votre activité aux moteurs
de recherche comme www.lassociation-des-utilisateurs-de-joomla-qui-sont-vraiment-gentils.org.
Même si cette façon de faire était à la mode pendant un moment, les moteurs de recherche,
Google notamment, indiquaient en septembre 2012 que le poids de ce critère avait diminué
dans son algorithme. Un bon nom de domaine est toujours important (un ou deux mots-clés),
en revanche fini les phrases à rallonge qui tentent de répondre à une requête précise.
Créez un répertoire : une fois que vous êtes à la racine de votre hébergement, faites
un clic droit dans la fenêtre de votre site distant et choisissez Nouveau dossier. Nommez-le
« joomla », par exemple, puis appuyez sur la touche Entrée.
Uploadez les fichiers Joomla! : vous allez maintenant envoyer les fichiers Joomla! chez
votre hébergeur. Dans la fenêtre « Site local », à gauche, ouvrez le répertoire dans lequel l’archive
de la dernière version de Joomla! a été décompressée. Sélectionnez les fichiers, faites un clic
droit et cliquez sur Envoyer (figure 1.4).
La zone du bas va se remplir de tous les fichiers à uploader et la zone du haut va afficher
les opérations effectuées par FileZilla. Attendez que la zone du bas soit complètement vide. Il
peut arriver que la zone de droite « Site distant » n’affiche pas tous les fichiers et dossiers, cliquez
alors dans la zone, puis pressez sur la touche F5 pour rafraîchir l’écran.
Vous pouvez maintenant passer à l’étape suivante.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 11 — #35
✐ ✐
Astuce : pour le nom de votre base de données, veillez à ne pas utiliser de caractères spéciaux, de
lettres accentuées, de point, de caractères d’échappement comme les « », les / ou les \. Préférez les
intitulés en minuscules avec des « underscores » pour que cela soit plus lisible : « joomla_site_test ».
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 12 — #36
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 13 — #37
✐ ✐
Les données de configuration : il s’agit de données très importantes, puisque c’est dans
cette partie que vous allez saisir le nom de votre site et sa description (voir le chapitre 9 sur le
référencement pour plus de détails). C’est également là que vous allez saisir les informations
du compte du « super-administrateur », c’est-à-dire du compte qui a « tous les droits » : adresse
e-mail, identifiant et mot de passe (figure 1.7).
Conseil : n’oubliez pas qu’un mot de passe trop simple est plus facile à mettre en échec.
Site hors-ligne : ce bouton est extrêmement pratique (figure 1.8) car il vous permet de
basculer votre site « hors-ligne ». C’est-à-dire que votre site présente une page d’accueil avec
un message que vous pourrez paramétrer une fois l’installation terminée et un logo. Cela vous
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 14 — #38
✐ ✐
permet de travailler dans votre environnement de production, sans pour autant que votre site
soit accessible. En effet, seules les personnes authentifiées peuvent accéder au site.
Si vous installez votre site sur un hébergement distant, nous vous recommandons d’activer
cette option.
Une fois tous les champs remplis, cliquez sur le bouton « suivant ».
L’interface va ensuite vous demander un « préfixe des tables ». Par défaut, l’installateur de
Joomla! va générer un code aléatoire qui servira à préfixer les tables de la base de données. Il
s’agit d’une mesure de sécurité et nous vous invitons à ne pas modifier ce champ (figure 1.10).
Pour les utilisateurs qui souhaitent utiliser plusieurs CMS sur la même base de données (un
Joomla! et un WordPress par exemple), nous vous conseillons de choisir vous-même le préfixe
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 15 — #39
✐ ✐
des tables. Indiquez par exemple « j_site_a_ » pour votre site « A ». Si vous devez un jour modifier
des éléments directement dans la base de données ou exporter une partie de celle-ci, vous
pourrez ainsi vous y retrouver plus facilement.
Enfin les boutons « Sauvegarder » ou « Supprimer » sont utiles si vous avez déjà procédé à
l’installation d’un site Joomla! sur votre espace d’hébergement.
Configuration principale : vous retrouverez ici les éléments saisis à l’étape 1, n’hésitez
pas à utiliser le bouton « précédent », en haut de page pour modifier ces informations. Vous
pourrez également les modifier, une fois l’installation terminée.
Configuration de la base de données : cette partie affiche tous les paramètres
nécessaires à la bonne utilisation de la base de données.
Pré-installation : cette rubrique recense des informations du serveur web sur lequel vous
procédez à l’installation. Vous y trouverez en autre la version du langage PHP utilisée (notez-la
quelque part, elle vous sera demandée si vous posez des questions sur un forum). Le dernier
point est important, il vous indique si le fichier configuration.php (celui qui contient toutes les
informations ci-dessus et bien d’autres) est modifiable. Si ce n’est pas le cas, vous ne pourrez
pas modifier la configuration de votre site dans l’administration de Joomla!. Tous les boutons
devraient être au vert.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 16 — #40
✐ ✐
Paramètres recommandés
À ce stade, un contrôle de la configuration du serveur Web (le vôtre en local ou celui de votre
hébergeur) est effectué, avec des paramètres qui sont obligatoires et d’autres recommandés. Si
tous les éléments indispensables sont au vert, continuez en cliquant sur le bouton Suivant.
Si vous êtes en local et que les boutons « Afficher les erreurs » et « Output buffering » sont en
orange (figure 1.12), c’est que vous n’avez pas préparé votre serveur Wamp pour Joomla! et nous vous
invitons à consulter, la sous-partie « préparer WampServer pour Joomla! » au début de ce chapitre.
Pour tout autre problème, et comme il est impossible de traiter tous les cas particuliers,
orientez-vous vers les forums de la communauté française de Joomla! qui recensent, entre
autres, de nombreux cas particuliers chez les hébergeurs les plus connus (1&1, Free, OVH, etc.).
L’écran final de l’installateur s’est chargé (figure 1.14) et il vous annonce que Joomla! est
installé. Pour autant, il vous reste une dernière tâche à effectuer avant de profiter de votre site. Il
va falloir que vous supprimiez le répertoire « Installation », situé à la racine du site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 17 — #41
✐ ✐
Une fois que ce sera fait, vous pourrez vous connecter à votre site et à son espace
d’administration.
Depuis l’écran final de l’installateur, cliquez sur le bouton « Supprimer le répertoire
d’installation » (figure 1.14).
L’écran d’authentification
C’est un écran auquel vous allez devoir vous habituer. En effet, dès que vous voudrez intervenir
dans votre espace d’administration, il faudra passer par l’étape d’authentification. Saisissez votre
identifiant et votre mot de passe et cliquez sur « Connexion ».
Petite astuce : quel que soit votre navigateur, enregistrez l’adresse de l’espace d’administration dans
vos favoris (marque-pages, bookmarks), vous pourrez ainsi y accéder rapidement (même en local).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 18 — #42
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 19 — #43
✐ ✐
Bootstrap Twitter
L’intégration du Bootstrap de Twitter dans l’architecture de Joomla! (JUI) a donné un coup de
fouet aux développements car ce SDK est vraiment conçu comme une couche web. Il propose en
effet d’implémenter facilement HTML 5, CSS3 et des requêtes JQuery (javascript) pour concevoir
des interfaces homme machine (IHM) « responsive » (figure 1.17), c’est-à-dire que la charte
graphique de votre site s’adapte au support de navigation (écran 22 pouces, 10 pouces, tablette,
smartphone) de façon intelligente.
Il s’appuie pour cela sur une grille (voyez-la comme un tableau Microsoft Excel), qui va vous
permettre de jouer sur les emplacements et leur taille, pour avoir toujours un rendu graphique
qui soit visuellement accessible. Découvrez Bootstrap sur http://twitter.github.com/bootstrap/.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 20 — #44
✐ ✐
Reproduisez votre environnement de production en local : avant de faire une manipulation sur
votre serveur de production, testez-la en toute sécurité sur un environnement similaire. Installez par
exemple WampServer (disponible sur www.wampserver.com).
Librairies indispensables
Les éléments suivants sont nécessaires à l’installation de Joomla!. Si l’un de ces éléments n’est
pas disponible chez votre hébergeur, Joomla! ne fonctionnera pas correctement. La configuration
doit supporter : la compression Zlib (mod_zlib), XML (mod_xml), MySQL –mod_mysql), le parseur
INI et JSON. De plus, la directive MB Language doit être sélectionnée par défaut, MB String
Overload doit être défini à « Off », et le fichier « configuration.php » doit être disponible en
écriture.
Normalement ces paramètres ne sont pas indispensables, mais ils peuvent gêner certains
fonctionnements.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 21 — #45
✐ ✐
Conseil : n’allez pas trop vite, prenez votre temps. Il n’y a rien de plus frustrant que de
supprimer une base par erreur, sans sauvegarde... Nous en savons quelque chose, cela nous
a valu quelques cheveux blancs.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 22 — #46
✐ ✐
se connectera sur celle-ci. Vous pouvez demander au programme d’installation de supprimer les
tables de l’ancienne base de données ou de les renommer. Si vous choisissez de les renommer,
le préfixe en place sera remplacé par le préfixe « bak_ ».
Procédures et qualité
Si vous êtes un professionnel, nous ne saurions que trop vous conseiller la rédaction d’une
procédure d’installation. Cette procédure devrait s’inscrire dans vos processus qualité. Si vous
n’en avez pas, c’est le moment d’en mettre une en place.
Si vous savez répondre aux questions suivantes, vous n’avez pas besoin de conseils, sinon...
• Comment allez-vous faire pour vous remémorer toutes les étapes d’une installation qui
date de six mois ?
• Comment allez-vous transmettre les informations nécessaires à une tierce personne (un
autre développeur par exemple) sans rien oublier d’important ?
• Comment allez-vous stocker les backups de bases de données que vous avez planifiés
régulièrement ?
• Comment allez-vous gérer le « versioning » des documents (images, pdf, etc.) que vous
mettez à disposition sur votre site ?
Conseil : la rédaction d’une procédure d’installation vous permettra de résoudre tous ces
cas concrets de la vie d’un projet. Le temps que vous passerez à la rédiger sera largement
récupéré lorsque vous devrez faire face à l’une ou l’autre de ces situations, le plus souvent
dans l’urgence.
Procédure d’installation
L’idéal est d’archiver toutes les opérations que vous avez effectuées lors de l’installation et de la
configuration de votre site et lors de l’installation des données, car vous en aurez besoin à de
nombreuses occasions.
Tout d’abord notez les modifications que vous effectuez dans la configuration de Joomla!.
Référencez ensuite chaque extension que vous installez, sa version et les dates de mise à jour.
Listez également dans votre procédure les points à vérifier après une mise à jour ou la
modification d’éléments de configuration (liens vers les catégories, certains libellés, formulaires
de contact, réécriture d’URL, etc.).
Vous avez terminé votre site Joomla! sur votre poste, en local. Le temps est désormais venu de le
mettre en production. Pour ce faire, vous allez copier votre base de données et vos fichiers sur
l’espace mis à disposition chez votre hébergeur. Il ne vous restera alors plus qu’à modifier la
configuration de votre site pour qu’il fonctionne. Allons-y étape par étape.
Attention ! Avant de choisir votre hébergeur, vérifiez qu’il supporte bien Joomla! en proposant PHP
5.3.1 et MySQL 5.1 au minimum.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 23 — #47
✐ ✐
Le vocabulaire
• Adresse IP : une adresse IP (pour Internet Protocol en anglais) est un numéro qui
permet d’identifier chaque matériel informatique (ordinateur, serveur, routeur, imprimante,
etc.) connecté à un réseau informatique utilisant l’Internet Protocol. C’est-à-dire que
votre ordinateur personnel (directement connecté à votre fournisseur d’accès) et votre
ordinateur d’entreprise (connecté à son réseau interne) utilisent le même protocole et ont
deux adresses différentes. Il existe deux versions pour écrire les adresses IP, la plus utilisée
comprend quatre nombres compris entre 0 et 254 séparés par des points. Par exemple :
72.249.159.57 désigne le serveur hébergeant le site joomla.org.
• DNS : il s’agit du système de résolution de nom de domaine (DNS pour Domain Name
System en anglais) permettant d’établir une correspondance entre une adresse IP et un
nom de domaine.
• Nom de domaine : vous en connaissez des dizaines de tête (ebay.fr, facebook.com,
lemonde.fr, etc.). Un nom de domaine est un « masque » vers une adresse IP. Per-
sonne ne se souviendrait de 72.249.159.57, alors que tout le monde se souvient de
www.joomla.org.
• Pointer : synonyme de « diriger vers ». On dit qu’on fait « pointer » un nom de domaine
vers une adresse IP.
• Serveur mutualisé ou hébergement mutualisé : dans le cadre d’un hébergement
mutualisé, vous partagez les ressources et le matériel de votre hébergement (mémoire
vive, espace disque, bande passante, etc.) avec les autres clients.
• Serveur dédié : dans le cadre d’un hébergement dédié, vous louez à votre hébergeur
un serveur uniquement dédié à vos sites ou applications. Vous et vous seul utilisez la
puissance de calcul du serveur, sa mémoire, etc.
• TTL : si vous entendez parler de TTL, c’est que vous avez fait une redirection de votre
nom de domaine et que vous vous demandez à quel moment il va pointer au bon endroit.
L’acronyme TTL (pour Time To Live en anglais) est utilisé par les serveurs DNS et désigne
le temps pendant lequel une information donnée doit être conservée en cache par le
serveur (il s’agit le plus souvent de l’adresse IP ou du répertoire vers lequel pointe un nom
de domaine ou un autre serveur DNS). Passé ce délai, l’information doit être considérée
comme obsolète et être mise à jour. Certains hébergeurs ont des TTL de 10 minutes,
d’autres de 24 heures ; c’est pourquoi il faut anticiper ce genre de manipulation en vous
renseignant auprès de votre hébergeur.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 24 — #48
✐ ✐
Si vous n’êtes pas développeur ou formé aux bases de données, gardez la méthode rapide et
cliquez sur « Exécuter ».
Votre navigateur va alors vous demander à quel endroit enregistrer le fichier d’export. Nous
vous conseillons de vous faire un répertoire à part, uniquement pour cette occasion. Vous y
stockerez aussi bien le fichier d’export que votre copie de Joomla!.
À savoir : chez certains hébergeurs, les serveurs de bases de données sont lents (disponibilité
du serveur, bande passante...). Si vous avez un gros volume de données à importer, sachez
que l’opération peut prendre plusieurs secondes.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 25 — #49
✐ ✐
Les paramètres de connexion à la base de données : si vous avez installé votre site
en local, il y a de fortes chances que les paramètres de connexion à votre base de données
ressemblent à ceci :
Remplacez « localhost » par le nom du serveur de base de données indiqué par votre
hébergeur puis remplacez « root » par votre identifiant de connexion. Indiquez ensuite dans le
champ $password, votre mot de passe et remplacez « demo_joomla » par le nom de la base de
données créée chez votre hébergeur.
Modifier les chemins : Joomla! utilise deux « chemins » vers des répertoires pour sa gestion
courante. Il va falloir que vous lui indiquiez où il va trouver son répertoire de journalisation (log)
et son répertoire temporaire (tmp).
Configuration en local :
Attention ! En local si vous utilisez Windows, le chemin sera indiqué avec des « \ », alors
que, à distance, votre serveur fonctionne probablement sous Linux et utilise lui des « / ».
$log_path = '/httpdocs/monsite/www/logs';
$tmp_path = '/httpdocs/monsite/www/tmp';
Les autres paramètres : ne vous inquiétez pas à ce stade du nom de votre site, de
l’adresse e-mail utilisée par le site et autres paramètres qui vous semblent importants. Vous
pourrez les modifier dans la configuration générale de votre site, une fois que celui-ci sera en
ligne. L’important dans une migration, c’est de récupérer correctement vos données et que votre
site fonctionne.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 26 — #50
✐ ✐
secondaires. Il y a eu plus de 20 versions de la 1.5 par exemple. Chacune d’entre elles (de
la 1.5.1 à la 1.5.26) a apporté son lot de mises à jour de sécurité, de correction de bug,
d’amélioration de l’interopérabilité, etc.
Une mise à jour comprend l’intégralité du code Joomla!, c’est beaucoup plus pratique
que de transmettre uniquement les fichiers mis à jour. Il suffit généralement de remplacer vos
fichiers de production par les nouveaux fichiers. Pour chaque mise à jour, le site www.joomla.fr
rédige un article expliquant pourquoi il est pertinent de passer à la nouvelle version. Presque
systématiquement, la communauté met en place des packs spécifiques pour passer d’une version
à une autre.
Quoi qu’il en soit, une mise à jour apporte plus de sécurité à votre site et n’en modifie en
rien son fonctionnement. Si vous avez travaillé sur certains fichiers ou que vous avez réalisé des
développements spécifiques, faites toujours une sauvegarde.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 27 — #51
✐ ✐
En général, les retours des utilisateurs sont très rapidement pris en compte, mais si vous avez
un site en production et qu’il est stable, nous vous recommandons d’attendre trois mois environ
pour effectuer une migration vers une nouvelle version de Joomla! 3. Durant ce laps de temps,
la majorité des petits bugs restant aura été identifiée et corrigée et vous pourrez passer sans
crainte à cette nouvelle version de Joomla! qui apporte tant de fonctionnalités nouvelles.
Conseil : si vous ne voyez pas l’intérêt fonctionnel de mettre à jour votre site ou si vous jugez
cela trop contraignant, dites-vous bien qu’à chaque nouvelle version, votre site devient plus
vulnérable et que, lorsque vous vous déciderez, la mise à jour sera plus compliquée. C’est
pourquoi nous vous recommandons, lors de la sortie d’une nouvelle version, de mettre vos
sites à jour sans trop attendre. Vous trouverez les meilleures recommandations à propos des
mises à jour sur le site www.joomla.fr.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 28 — #52
✐ ✐
utilisé (ordinateur, tablette, smartphone), permettant ainsi d’offrir une meilleure expérience de
navigation à l’utilisateur.
Si vous avez créé votre template à partir d’un des templates de base et que vous n’avez pas
changé son nom, prenez garde, celui-ci sera écrasé et vous perdrez votre mise en page.
Le choix des pros : nous avons fait le choix de vous proposer la solution la plus facile et la plus
conviviale pour mettre à jour votre site Joomla!.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 29 — #53
✐ ✐
Conseil : si vous en avez la possibilité, regardez vos statistiques pour savoir à quel moment vous avez
le moins de visites et planifiez votre mise à jour en conséquence.
Voici, dans l’ordre, la liste des opérations que vous allez effectuer :
• mettre votre site hors ligne ;
• purger votre cache ;
• sauvegarder votre base de données ;
• sauvegarder vos fichiers ;
• écraser les fichiers Joomla! par ceux de la nouvelle version.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 30 — #54
✐ ✐
Conseil : mieux vaut un site « en maintenance » pendant une heure que la perte de la
commande d’un client.
Dans l’espace d’administration, rendez-vous dans le menu « Système » et cliquez sur le sous-
menu « Configuration ». Dans la zone des paramètres du site, indiquez « oui » pour site hors-ligne
(figure 1.25). Nous vous conseillons d’indiquer autant que possible la date ou l’heure à laquelle
vous comptez réouvrir le site (prévoyez large) et sauvegardez. Votre site affiche maintenant un
message d’indisponibilité. Vous avez la possibilité d’ajouter votre logo en sélectionnant une
image dans le champ « Image hors-ligne ». Vous pouvez même demander à un webdesigner
de modifier cette page pour qu’elle ait l’apparence du reste de votre site. Cliquez ensuite sur le
bouton « Enregistrer » en haut à gauche de la page pour valider le changement.
Dans un nouvel onglet, vérifiez que votre site est bien hors-ligne et qu’il affiche le message
convenu (figure 1.26).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 31 — #55
✐ ✐
pour chaque composant et chaque module du système, le nombre de fichiers mis en cache. Par
exemple, la figure 1.27 nous indique que le groupe « thumbs », a 77 fichiers dans le cache, ce
qui représente un poids de 474,65 kb. Cliquez sur la case à cocher en haut à gauche de la liste
pour tout sélectionner, puis cliquez sur le bouton Supprimer situé en haut à gauche (figure 1.27).
Conseil : sauvegardez le fichier généré sur votre site, dans un répertoire spécifique, pour
être sûr de ne pas le supprimer par erreur.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 32 — #56
✐ ✐
Conseil : Certains hébergeurs fournissent une interface de transfert de fichier FTP depuis leur
interface de gestion, évitant ainsi d’avoir recours à FIleZilla pour de longs transferts. Dans le cas de
1&1 notamment, leur interface propose la décompression de fichier archive Zip. Ceci vous permet
ainsi de ne faire le chargement que d’un seul gros fichier, que leurs serveurs se chargent ensuite de
décompresser.
En résumé
Vous avez maintenant effectué les opérations les plus techniques requises par Joomla! et vous
allez enfin pouvoir en apprécier toute la puissance. N’hésitez pas à passer du temps sur la prise
en main, afin de ne pas passer à côté d’une fonctionnalité qui pourrait vous rendre service ou
tout simplement pour bien profiter de toutes les options offertes par le logiciel.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 33 — #57
✐ ✐
2
Prise en main
Objectif
À l’issue de ce chapitre, non seulement vous ne serez plus perdu dans Joomla!, mais vous
pourrez également en expliquer le fonctionnement à un collègue. Les informations dont nous
nous sommes servis ici nous ont permis de former des dizaines d’utilisateurs à Joomla!.
Beaucoup évoluaient jusqu’alors dans un environnement bureautique simple : traitement de
texte, tableur, messagerie e-mail ; ils sont désormais tous auteurs ou webmestres gérant au
quotidien leur site en le mettant à jour et en rajoutant des pages.
Le principe
Les systèmes de gestion de contenu sont légions et vous en utilisez tous les jours.
Leur caractéristique commune est d’offrir un système permettant à plusieurs auteurs de
gérer (création, modification, publication, suppression) des contenus (textes, images, éléments
multimédias). Pour réaliser cette prouesse technique, plusieurs briques sont indispensables : il en
faut une pour gérer les utilisateurs et leurs différents droits, une pour gérer la chaîne éditoriale
(workflow), une pour le traitement des données et enfin, une pour l’affichage.
Rappel : aujourd’hui, tous les CMS séparent la forme du contenu, c’est ainsi que vous pouvez
travailler sur vos données, sans vous préoccuper de la façon dont elles vont être restituées. Vous
pouvez donc confier à vos experts métier la rédaction des pages les concernant et parallèlement
demander à votre webdesigner de modifier la typographie utilisée, voire même la charte graphique
dans son ensemble.
Il existe différents types de systèmes, offrant des niveaux très variables de fonctionnalités,
de facilités d’utilisation et de modularité. Au sens systémique, un tableau noir d’école avec ses
craies est un système de gestion de contenu. Bien sûr, avec un tel système, vous aurez sans
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 34 — #58
✐ ✐
doute des problèmes de diffusion (surtout si le tableau n’a pas de roulettes) et des problèmes de
sécurisation des données (une éponge peut détruire vos données). Par analogie, un classeur, un
bloc de Post-it, un logiciel de traitement de texte ou un tableur de gestion des stocks sont autant
de systèmes de gestion de contenu.
Dans la famille des CMS, Joomla! est sans doute le plus polyvalent des outils. C’est aussi le plus
important, car les sites Web varient énormément d’une culture à une autre, d’un secteur à un
autre, d’une langue à une autre. Voyons maintenant les différentes briques qui le composent.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 35 — #59
✐ ✐
de suppression par erreurs) et des éditeurs qui pourront mettre en ligne. Tout ceci s’appelle une
chaîne éditoriale.
La gestion de la restitution graphique : dans un CMS, votre contenu est stocké dans
une base de données sous forme de code. Cela signifie qu’il est « appelé » puis mis en forme par
Joomla!. Une charte graphique dans Joomla! est modifiable avec un minimum de connaissances
techniques. Pour autant, l’aspect graphique d’un site ayant toute son importance, nous vous
conseillons de faire appel à des professionnels du webdesign possédant des notions de couleur,
de typographie, d’ergonomie et de webmarketing. Si vous souhaitez tout gérer vous-même,
sachez qu’il existe de nombreux « templates » payant, à moins de 50 €, conçus pour s’adapter à
vos contraintes et totalement administrables sans compétences techniques particulières.
L’accessibilité de Joomla!
Conseil : pour ne pas tout confondre entre sémantique, CSS, accessibilité et XHTML, lisez
l’article de Raphaël Goetter sur Alsacréations : http://www.alsacreations.com/article/lire/575-
XHTML-CSS-accessibilite-confusions-et-amalgames.html.
Dans toutes les langues : Joomla! est un projet international : des développeurs du
monde entier participent à l’élaboration de nouvelles fonctionnalités et les besoins, parfois
spécifiques, d’une culture viennent enrichir chaque jour ce projet. C’est ainsi que depuis la
version 1.5 de Joomla! (en 2006), l’internationalisation permet de traduire tous les textes
statiques d’un site (côté visiteur et côté administration). Cela vous permet par exemple d’offrir un
site en chinois (grâce à un encodage UTF-8 des caractères au format Unicode 16), administré
en arabe (support de l’écriture de droite à gauche). Avec la version 3 vous allez découvrir à quel
point il est facile d’éditer un site multilingue avec des menus et des contenus spécifiques pour
chaque langue.
Tableless : depuis la version 1.6 de Joomla! (2010), les développeurs peuvent lire dans
les explications du code « Tableless com_content layouts » ; ce qui signifie qu’il n’y a plus de
tableaux HTML utilisés pour afficher les articles et les pages de votre site (mis à part ceux que
vous y mettrez). Les tableaux (invisibles à l’internaute) étaient utilisés pour gérer la disposition
des emplacements sur le site (par exemple : une colonne à droite, un module en haut à gauche
et un en haut à droite, un en-tête et un pied de page).
L’accessibilité, une nécessité : les experts en optimisation pensent depuis plusieurs années
que l’accessibilité des pages à une réelle incidence sur le référencement d’un site. Nous vous
invitons à lire le très bon article d’Andy Hagans à ce sujet intitulé : « Vous aimez l’accessibilité ?
Les moteurs de recherche aussi ! » disponible à cette adresse :
http://www.pompage.net/traduction/accesibilitemoteursderecherche.
C’est tellement vrai qu’en 2007, Charl van Niederk s’est vu récompensé au Google « Summer
of Code » pour son projet sur la production du code généré par Joomla! au format XHTML.
C’est dire si Google et les moteurs de recherche en général apprécient les sites qui respectent
les standards et favorisent l’apparition de ce que l’on appelle désormais le Web sémantique.
Responsive web design : entre 2005 et 2008, les webmasters qui regardent les résolutions
d’écran de leurs visiteurs ont pu compter jusqu’à 400 résolutions d’écran différentes, ce qui
correspond à la multitude d’écrans disponibles sur le marché, aussi bien pour les ordinateurs,
que les tablettes ou les smartphones. Pour s’adapter, il a fallu repenser la façon dont on réalisait
techniquement le design des sites web, de là est née l’idée du responsive web design.
Avec la version 3.0 de Joomla! (2012), les développeurs ont décidé de se baser sur le
Bootstrap fourni par Twitter (http://twitter.github.com/bootstrap) pour concevoir les nouveaux
templates Joomla!. Cela ne signifie pas que tous les templates Joomla! s’adapteront aux
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 36 — #60
✐ ✐
smartphones ou tablettes, mais que les intégrateurs chargés de transformer un dessin en charte
graphique auront l’opportunité de le faire.
Si vous souhaitez en savoir plus sur le responsive web design, je vous propose de consulter
l’article de Gaétan Weltzer disponible sur http://designspartan.com/info_generale/responsive-
design-definition-fonctionnement-ressources-et-tutoriels/.
Pour bien commencer, il faut s’approprier les termes utilisés dans Joomla! que nous reprenons
dans ce livre. Comme nous l’avons vu, il est important de savoir qu’il y a deux espaces distincts
dans votre site Joomla!. Le premier, c’est le site en lui-même, visible par les internautes ; le
second, c’est l’espace d’administration, qui est un espace fermé, accessible uniquement avec
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 37 — #61
✐ ✐
un mot de passe. C’est dans l’espace d’administration que vous allez gérer vos contenus et vos
utilisateurs.
Conseil : pour chercher un terme précis dans ce livre, référez-vous à l’index à la fin de
l’ouvrage.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 38 — #62
✐ ✐
fonctionnalités liées aux templates, mais sachez déjà que vous pouvez en faire coexister plusieurs
sur le même site, ce qui s’avère très utile pour créer des « univers » différents. Vous pouvez
ainsi afficher une page d’accueil verte et avoir un espace dédié (accessible ou non après
authentification) en rouge.
Publier/Dépublier : il s’agit d’une notion importante et qui est valable pour tous les CMS.
Lorsque vous créez un article dans l’espace d’administration, il est stocké dans la base de
données. Cela ne veut pas dire pour autant qu’il est visible sur votre site Web ! En publiant votre
article, votre catégorie ou votre menu, vous les rendez visibles. En dépubliant, vous ne supprimez
pas l’élément concerné, vous le rendez simplement invisible pour le visiteur. Sachez que vous
avez la possibilité de programmer la publication d’un article (date de début et de fin). Il vous est
également possible de programmer la publication d’un module, comme vos dernières actualités.
Enregistrer : lorsque vous avez modifié un article ou un élément de menu et que vous
souhaitez vérifier la modification sur le site, cliquez sur Enregistrer et rechargez la page du site sur
laquelle vous travaillez : vous pourrez ainsi visualiser les modifications. Si vous souhaitez créer
plusieurs articles, catégories ou modules à la suite, vous apprécierez vite le bouton « Enregistrer &
nouveau ».
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 39 — #63
✐ ✐
Comme vous pouvez le constater, votre site est déjà constitué de plusieurs éléments. Vous
y trouverez plusieurs menus qui vous permettront de naviguer dans le site, des éléments
d’ergonomie, un moteur de recherche interne qui offre à vos visiteurs la possibilité de chercher
dans votre site et différents articles à la une. Promenez-vous dans le site afin d’avoir une idée de
l’environnement de vos futurs contenus.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 40 — #64
✐ ✐
Regardez maintenant comment les composants pré-installés de Joomla! peuvent vous aider
à construire votre site. Cliquez sur Galerie Photo puis sur Animaux pour afficher les albums
photos des parcs australiens (figure 2.6).
Pour réaliser cette galerie photos, rudimentaire, mais efficace, créez une catégorie d’articles
« album 1 » par exemple. Créez plusieurs articles et insérez-y la miniature d’une de vos photos,
un lien « lire la suite », puis la photo en grande taille (attention toutefois aux dimensions de
l’image et à son poids pour un affichage correct). Paramétrez l’affichage de la catégorie pour
que le texte d’introduction ne soit pas visible une fois « rentré » dans l’article. Pour rendre plus
dynamique cette galerie, vous pouvez également ajouter un lien hypertexte vers la photo de
grande taille sur la miniature.
Site de boutique de fruits : pour visiter ce second site, cliquez sur Sites exemples dans le
menu haut puis sur Boutique de fruits (figure 2.7).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 41 — #65
✐ ✐
Ce site n’est pas un site d’e-commerce (voir à ce sujet l’extension spécifique VirtueMart sur
www.joomla.fr), mais il est suffisant pour présenter l’activité d’une boutique : ses produits, les
recettes associées, un plan d’accès et un formulaire de contact. Le site permet également de
renseigner ses clients et offre même un accès privatif aux fournisseurs.
Le moteur de recherche : parce que les utilisateurs ont pris l’habitude de se servir d’un
moteur de recherche, c’est un outil qu’il ne faut pas négliger et qu’il convient de proposer
systématiquement à vos visiteurs, d’autant que celui de Joomla! 3 est très performant.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 42 — #66
✐ ✐
L’espace d’administration se situe à une adresse Web différente de la page d’accueil de votre
site et est régi par des règles d’accès qui permettent à des utilisateurs de s’y connecter et d’y
effectuer les tâches pour lesquelles vous leur avez donné des droits (créer une nouvelle catégorie,
une actualité, un nouveau produit, etc.). Tout ce que vous y ferez se répercutera sur la partie
visible du site.
Rendez-vous, en local ou sur le Web, à l’adresse de votre site. Saisissez pour cela le nom du
site suivi de « /administrator » :
http://localhost/monsite/administrator
ou
http://www.mon-site.fr/administrator
Le panneau d’administration
Le panneau d’administration est un carrefour que vous emprunterez souvent. Il vous permet
en effet d’accéder à tout ce qui est administrable dans Joomla! : configuration, gestion des
utilisateurs, des articles, des medias, des extensions, etc. Le panneau d’administration (figure 2.9)
est composé d’une barre de menu, d’icônes d’accès rapides et de modules présentant les
utilisateurs connectés et les articles populaires de votre site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 43 — #67
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 44 — #68
✐ ✐
avez à votre charge la traduction des contenus, sachez que 59 langues sont disponibles
pour l’interface de Joomla! 3, y compris des langues avec des alphabets autres que latin,
comme le cyrillique, et même des langues se lisant de droite à gauche comme l’arabe.
Avoir plusieurs de ces langues dans un même site ne pose aucun problème. Si vous
cliquez sur le menu Extensions, puis Gestion des langues, vous verrez (figure 2.11) que
les données d’exemple ont bien installé deux langues : le français et l’anglais. L’interface
vous informe que le français est la langue par défaut.
Aide : ce menu est une mine de ressources en ligne. Parmi ces ressources, la plus pratique
est sans doute « l’Aide de Joomla! » qui ouvre, dans l’administration de votre site, un lien vers
l’aide française. Les autres liens vous orientent vers la communauté internationale de Joomla!
(forums et wikis de la documentation, en anglais). Vous trouverez également dans ce menu des
liens vers les extensions, les traductions, les ressources, le portail communautaire, le centre de
sécurité, les ressources pour les développeurs et la boutique Joomla!.
Le Forum de support officiel est en anglais tandis que le Forum joomla.fr est en français.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 45 — #69
✐ ✐
Astuce : vous pouvez composer le panneau d’administration qui vous convient en activant ou en
désactivant certains modules (figure 2.13). Rendez-vous pour cela dans le menu « Extensions » puis
dans « Gestion des modules ». Sur le premier filtre situé à gauche, choisissez « Administration ». Les
seuls modules qui s’afficheront alors seront ceux réservés à l’administrateur. Si vous ne voulez plus
afficher les « Utilisateurs connectés » par exemple, il vous suffit de dépublier le module du même
nom en cliquant simplement sur la coche verte.
Utilisateurs connectés : s’affichent ici les cinq derniers utilisateurs connectés sur le site à
l’instant où la page se charge. Vous les identifiez par leur nom d’utilisateur, l’endroit où ils se
trouvent (sur le site ou dans l’espace d’administration) et leur identifiant. Pour charger la fiche
d’un utilisateur, il suffit de cliquer sur son nom.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 46 — #70
✐ ✐
Articles populaires : vous pouvez utiliser cette liste comme un écran de statistiques
basiques. Les cinq articles les plus populaires sont listés ici, par ordre du nombre de clics.
Vous trouverez ici le nom de l’article, sa date de création et le nombre de clics. On parle de
« statistiques basiques » car le nombre de requêtes n’est en effet pas synonyme de nombre de
visiteurs ou de nombre de pages vues. Nous vous conseillons donc d’installer un système de
statistiques plus évolué de type « Google Analytics » (voir le chapitre 9 sur le référencement).
Articles les plus récents : ce sont tout simplement les cinq derniers articles ajoutés, listés
du plus récent au plus ancien. Ils sont identifiés par leur nom, leur auteur et leur date de création.
En résumé
Comme avec tout nouvel outil, vous passerez par une période d’apprentissage. Cette période
sera grandement facilitée par l’ergonomie intuitive de Joomla!. Une fois que vous vous serez
approprié la logique de cet excellent CMS, il ne s’agira plus d’un Joomla!, mais de votre site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 47 — #71
✐ ✐
3
Paramétrer
votre Joomla!
Objectif
Paramétrer votre site Joomla! revient en fait à effectuer toute une série de réglages pour que
le site fonctionne à votre manière. À la fin de ce chapitre un peu plus technique que les
autres, vous aurez pris connaissance de toute une série de variables qui optimisent certaines
fonctionnalités et qui en interdisent d’autres. Votre site sera alors prêt à être utilisé, en toute
sécurité.
Une fois que votre Joomla! est installé, certains paramètres doivent être configurés immédia-
tement. Pourquoi ? Parce qu’ils conditionnent le fonctionnement d’un certain nombre d’éléments
qui ne sont pas anodins. Rien n’étant figé dans le marbre, vous pourrez bien entendu revenir
ultérieurement sur ces paramètres et ainsi modifier vos premiers choix.
Même si vous souhaitez publier tout de suite votre premier article, ce serait une erreur de ne
pas modifier ou de ne pas prendre connaissance de ces éléments importants. En effet, ceux-ci
déterminent de manière significative l’usage de votre site et impactent aussi bien sa mise en
page que son positionnement sur les pages de résultats des moteurs de recherches.
Pour accéder à ces différents réglages, cliquez sur Configuration dans le menu Système ou
bien, sur le panneau d’administration (page d’accueil une fois que vous êtes connecté dans le
back-office), cliquez sur Configuration dans le bandeau de gauche. L’espace de configuration
est composée de 5 onglets : Site, Système, Serveur, Droits et Filtre de texte.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 48 — #72
✐ ✐
Le fichier de configuration
Le fichier de configuration est un élément vital de votre site, car il contient notamment les identifiants
et adresses permettant la connexion de Joomla! au serveur de base de données. Soyez donc prudent
dans les modifications que vous y apporterez.
Paramètres du site
Dans les réglages du site, on rencontre des paramètres fondamentaux, comme le nom de votre
site ou, plus simplement, son statut : « en ligne » ou « hors ligne ».
Nom du site : le nom de votre site va s’afficher à différents endroits : dans la barre de titre
du navigateur, dans l’en-tête des e-mails que le système envoie (par exemple dans le cas de la
création d’un compte ou du renouvellement d’un mot de passe). Le nom sera également repris
dans les flux RSS propulsés par le site et il pourra, si le template y fait appel, s’afficher sur toutes
les pages du site, à côté de votre logo par exemple. C’est le cas du template par défaut livré
avec Joomla! 3 comme le montre la figure 3.1. Si vous faites une modification, appuyez sur le
bouton vert Enregistrer en haut à gauche et allez voir sur le site pour constater les changements.
Site hors ligne : Joomla! vous offre la possibilité, en un simple clic, de mettre votre site
hors ligne. Cette fonctionnalité peut s’avérer très pratique lorsque vous installez un nouveau
composant et que vous voulez le tester avant de le proposer à vos visiteurs, ou bien dans le cas
d’une opération de maintenance ou d’un changement de template. Sans aucune incidence sur
vos données, le site affichera alors le message que vous aurez saisi dans cette rubrique.
Pour faire basculer votre site hors ligne, cliquez simplement sur le bouton Oui et sauvegardez.
Dans la fenêtre de votre navigateur, visitez alors votre site pour voir à quoi il ressemble. Cette
manipulation ne bloque en rien l’accès à l’espace d’administration, ce qui permet à vos auteurs
et à vous-même de continuer à travailler et même de naviguer dans le site puisqu’il suffit
de vous authentifier pour y accéder (même identifiant et mot de passe que pour accéder à
l’administration).
Message hors-ligne : vous avez le choix de ne pas faire apparaître de texte, hormis le
nom de votre site et le formulaire d’authentification, ou de sélectionner un message spécifique.
Si vous avez un site multilingue, sélectionnez plutôt l’option « Message défini par la langue du
site », ainsi, en fonction de la langue du navigateur, Joomla! affichera le message par défaut :
« Ce site est en maintenance. Merci de revenir ultérieurement. »
Message spécifique : nous vous conseillons de mentionner en quelques mots les raisons
pour lesquelles le site est hors ligne ainsi qu’une adresse e-mail ou un numéro de téléphone pour
que les visiteurs puissent poser des questions ou se renseigner en cas d’urgence (figure 3.2).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 49 — #73
✐ ✐
Image hors ligne : pour customiser votre page d’attente et la mettre à vos couleurs (logos,
charte graphique), vous pouvez y ajouter une image. Imaginez qu’il s’agit de la devanture d’un
magasin en travaux. Mieux vaut une belle affiche avec une date d’ouverture que des cartons qui
laissent à penser que le magasin n’ouvrira jamais.
Essayons avec une image disponible depuis votre ordinateur. Cliquez sur le bouton
Sélectionner, une fenêtre pop-up va s’ouvrir. Dans la partie basse de la fenêtre, cliquez sur
le bouton parcourir (figure 3.3) puis naviguez sur votre ordinateur à la recherche d’une image et
sélectionnez-la. Cliquez sur Ouvrir puis, dans la fenêtre pop-up sur le bouton bleu Démarrez
l’envoi. Votre image va alors être transférée et apparaître dans le répertoire d’images de Joomla!.
Cliquez ensuite sur l’image que vous venez d’ajouter, son URL va s’afficher dans le champ
juste en dessous. Cliquez sur le bouton bleu Insérer situé en haut à droite et la fenêtre pop-up se
refermera. Cliquez sur le bouton vert Enregistrer en haut à gauche de la page et allez voir sur
votre site. N’oubliez pas de rafraîchir la page en appuyant sur F5.
Éditeur par défaut : Joomla! est compatible avec plusieurs éditeurs de texte. Il faut en
choisir un par défaut qui sera alors l’éditeur courant utilisé sur votre site. Vous pouvez bien sûr
ajouter d’autres éditeurs, tels que JCE par exemple.
Un éditeur de texte ou WYSIWYG (What you see is what you get) vous permet d’obtenir le
rendu écran de ce que vous avez saisi. L’éditeur est extrêmement important pour vous et vos
auteurs, car c’est lui qui vous permet de mettre vos contenus en forme (gras, italique, couleur,
image, lien hypertexte, etc.), sans aucune connaissance en HTML ou en CSS. Les éditeurs de
texte d’aujourd’hui proposent des interfaces comparables à celles des logiciels de traitement de
texte que nous utilisons quotidiennement ; et c’est une des raisons de la popularité des CMS.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 50 — #74
✐ ✐
Par défaut, Joomla! vous propose d’utiliser l’éditeur TinyMCE (figure 3.5).
Pour utiliser un autre éditeur de texte (notre préférence va à JCE), installez-le via le menu
Extensions, puis revenez ici pour le sélectionner par défaut. Si plusieurs éditeurs sont installés
sur votre Joomla!, ceux-ci seront accessibles à vos auteurs, éditeurs et modérateurs. Ils pourront
alors sélectionner celui qu’ils préfèrent dans leur profil utilisateur.
Captcha par défaut : depuis la version 2.5, Joomla! est livré avec le captcha « ReCaptcha »
(figure 3.6) mis au point par des chercheurs de l’Université Carnegie-Mellon et qui est, depuis
2009, propriété de Google. Google s’en sert notamment sur les formulaires de mises à jour de
Google Street View. L’objectif du captcha est de différencier un humain d’un robot et donc de
diminuer les phénomènes de SPAM. Si vous souhaitez utiliser le captcha sur vos formulaires de
contact généré par Joomla!, vous devrez vous créer un compte (gratuit) sur l’interface de Google
et déclarer votre site (communiquer son URL).
Accès par défaut : il s’agit du niveau d’accès par défaut qui sera attribué à un nouvel
utilisateur. Cette option n’est pas importante si vous gérez vous-même la création de compte. En
revanche, si vous autorisez la création automatisée des comptes utilisateurs via l’interface du site
prévue à cet effet, faites bien attention à ce que vous choisissez !
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 51 — #75
✐ ✐
Paramètres système
Dossier « logs » : les « logs » ou fichiers de journalisation en français peuvent vous être
extrêmement utiles si vous avez un souci avec un composant ou autre. Sauf si vous savez
ce que vous faites, ne modifiez pas ce chemin d’accès.
Serveur d’aide : à partir de la version anglaise officielle, de nombreuses communautés
internationales ont créé leur version d’aide en ligne. Sélectionnez la version française ou la
langue que vous désirez.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 52 — #76
✐ ✐
Paramètres de débogage
Sous le nom un peu barbare de « débogage » se cache en fait une histoire poétique. Le débogage
est l’équivalent français du fait d’enlever des « bugs ». Dans les années 1950, les premiers
ordinateurs étaient équipés de grosses ampoules. De tout petits moustiques (« bug » en anglais)
les faisaient claquer, rendant ainsi les calculateurs hors d’usage. Héritage de cette époque,
lorsqu’une fonction fait « planter » un système, on parle alors de « bug » ou de « bog » ; d’où un
« débogage » qui permet aux développeurs de trouver la source d’un problème.
Attention ! Un débogage en production peut nuire à votre image. En effet, il pourrait sembler non
professionnel, voire dangereux, d’afficher en production des informations sur les fonctions utilisées,
un composant qui ne fonctionnerait pas bien ou sur des chemins d’accès (path) à votre système.
Débogage système : activez cette option si vous désirez voir s’afficher les erreurs SQL.
Attention, elles seront affichées aussi bien dans l’administration que sur votre site, dans un encart,
en bas de page.
Débogage de langue : Joomla! est traduit dans presque toutes les langues, avec des
qualités parfois variables. Si vous désirez modifier un fichier de langue, activez ce débogueur.
Paramètres du cache
Pour plus de détails sur ce qu’est le cache, rendez-vous au chapitre 16 dédié à la maintenance.
Cache : Joomla! vous propose deux niveaux de cache si vous souhaitez l’activer : le cache
conservateur et le cache progressif. Dès lors que vous aurez plusieurs centaines de visiteurs
uniques par jour, vous risquez de rencontrer un problème vis-à-vis de votre hébergeur (surtout si
vous êtes en mutualisé) car votre site va effectuer autant de requête PHP, ce qui risque de saturer
le serveur.
La méthode du cache conservateur ne met en cache que certains éléments d’une page de
votre site comme le contenu d’un article par exemple. Cette option permet de diviser par 2 ou 3
le temps de chargement d’une page.
Le cache progressif, lui, met un maximum d’éléments de votre site en cache tels que les
modules et menus, en plus des contenus. Ce système est vraiment pour les gros sites, néanmoins
il nécessite un plus grand espace disque.
Gestion du cache : dans Joomla! 3, seul le système de gestion par fichier est disponible.
Attention, il faut que ces fichiers soient accessibles en écriture. Si vous avez un doute, lancer
Filezilla et faite un clic droit sur le répertoire cache, à la racine de votre site. Les droits doivent
correspondre au CHMOD 777.
Durée du cache : elle est exprimée en minute. C’est ici que vous pouvez jouer sur la durée
de conservation du cache avant qu’il ne doive être renouvelé. Si vous faites peu de mises à jour,
vous pouvez opter pour un cache de 2880 minutes, ce qui correspond à 2 jours. Si vous faites
des mises à jour fréquentes, comme plusieurs news par jour, optez pour 60 minutes.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 53 — #77
✐ ✐
Tout comme les paramètres du système, les réglages du serveur sont des éléments sensibles qu’il
faut manier avec précaution. Si vous n’êtes pas développeur ou administrateur de serveur, nous
vous recommandons de ne pas modifier les paramètres par défaut.
Paramètres du serveur
Dossier temporaire : le dossier « Temp » pour « temporaire » est un dossier utilisé par Joomla!
pour y stocker de façon temporaire des fichiers, par exemple lorsque vous mettez une extension
à jour. Vous pouvez indiquer ici un chemin vers ce dossier.
Compression GZIP : ce mécanisme provoque la compression des pages avant de les
renvoyer au navigateur du client. Il faut que le navigateur et le serveur Web sachent exploiter
cette fonction. Elle est conseillée lorsque les visiteurs sont nombreux à ne pas disposer d’une
connexion ADSL. En revanche, si le serveur commence à être surchargé, il vaut mieux ne pas
activer cette option. Elle oblige à un traitement supplémentaire, sauf si la librairie de fonctions
GZIP a été intégrée directement dans le code du serveur. Pour certaines configurations de serveur,
le fonctionnement est plus rapide sans cette fonction !
Rapport d’erreurs : cela vous permet d’ajuster la densité des messages d’erreurs issues
du système de gestion d’erreurs de PHP.
Le réglage « par défaut » prend en compte les paramètres du fichier de configuration
php.ini. « Aucun » n’affiche aucune des erreurs remontées. « Simple » remonte les erreurs et les
avertissements et correspond à :
error_reporting(E_ERROR|E_WARNING|E_PARSE
« Maximum » remonte les erreurs, les avertissements et les conseils. Cela correspond à :
error_reporting(E_ALL
Attention ! Les messages d’erreur sont affichés à l’écran. Nous vous conseillons de sélectionner
« aucun » pour un site en production.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 54 — #78
✐ ✐
Forcer SSL : si vous ne savez pas ce qu’est un protocole sécurisé, ne modifiez pas la
configuration par défaut. Vous pouvez régler ce paramètre pour forcer la prise en charge SSL
seulement pour l’espace d’administration ou pour votre site tout entier.
Attention ! Pour activer la navigation par protocole sécurisé (HTTPS), il vous faut disposer
d’un certificat SSL chez votre hébergeur, ce qui n’est presque jamais le cas chez un hébergeur
mutualisé.
Localisation
Ils permettent d’indiquer le fuseau horaire dont va se servir votre site. Si vous hébergez un site
à destination d’un public français sur un serveur américain, choisissez « Paris » comme fuseau
horaire, sinon, c’est l’heure américaine qui servira de référence à votre site. Cela peut s’avérer
gênant si vous programmez la publication automatique d’articles ou d’actualités.
Paramètres FTP
Activer le FTP : certains serveurs (donc certains hébergeurs) font la différence entre un utilisateur
FTP et un utilisateur HTTP. C’est ainsi que votre site Joomla! peut se retrouver dans l’incapacité
de télécharger des fichiers, n’ayant pas les droits FTP. Dans ces cas-là, activez le FTP.
Serveur FTP : saisissez ici le nom du serveur FTP (fourni par votre hébergeur).
Port FTP : indiquez ici le port spécifié par votre hébergeur (autre que le port 21).
Identifiant FTP : saisissez votre identifiant FTP.
Mot de passe FTP : saisissez votre mot de passe FTP.
Racine FTP : lorsque vous vous connectez via FTP, vous êtes dirigé vers un dossier bien
précis, qui change selon le fournisseur d’accès. Indiquez ici le chemin d’accès à votre installation
Joomla!. On parle de « racine FTP » lorsqu’on mentionne le dossier le plus élevé auquel vous
avez accès.
Paramètres du proxy
Activer un proxy : en environnement d’entreprise, un proxy permet de faciliter et d’accélérer
la navigation vers Internet, et également d’accroître la sécurité du réseau local. Si tel est le cas,
il vous sera peut-être nécessaire de paramétrer l’accès vers le serveur proxy installé au sein de
votre entreprise.
Hôte du proxy : saisissez ici le nom du serveur assurant la fonction de proxy (fourni par
votre service informatique).
Port du proxy : indiquez ici le port spécifié par votre service informatique.
Identifiant du proxy : saisissez votre identifiant pour accéder au service.
Mot de passe du proxy : saisissez votre mot de passe pour accéder au service.
Attention ! La moindre erreur de saisie dans cette section peut rendre votre site Joomla! inutilisable.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 55 — #79
✐ ✐
En effet, vous ne pourriez plus accéder à l’interface d’administration. Si vous n’êtes pas
développeur ou habitué à manipuler des variables de serveurs, ne faites aucunes modifications.
Type : Joomla! vous propose deux types de bases de données différents : MySQL et MySQLi.
Vous n’aurez besoin de modifier ce champ qu’en cas de transfert de site.
Serveur hôte : indiquez ici le nom du serveur de votre base de données. Attention, la
majorité des hébergeurs interdit l’accès à une base de données en dehors de leurs serveurs.
Utilisateur : saisissez ici votre identifiant pour le serveur de base de données.
Nom de la base : indiquez ici le nom de la base de données.
Préfixe des tables : vous pouvez indiquer ici un préfixe différent de celui par défaut. Utile
si vous avez plusieurs sites Joomla! installés sur la même base de données.
Réglages e-mail
Serveur de mail : cela vous permet de choisir le mode d’envoi de vos e-mails. Vous pouvez
opter pour la fonction de messagerie intégrée à PHP (si votre hébergeur le permet), le programme
Sendmail, ou bien un serveur de messagerie externe.
E-mail du site : il s’agit de l’adresse de messagerie qui sera mentionnée comme étant
celle de l’expéditeur pour les messages générés automatiquement par Joomla!.
Nom de l’expéditeur : il s’agit du nom de l’expéditeur qui sera spécifié dans un message
envoyé par votre site. Profitez-en pour choisir un intitulé explicite, ainsi, les gens recevant un
message de la part de votre site seront moins tentés de le considérer comme du spam.
Accès à Sendmail : si vous désirez utiliser à la place de la fonction Mail de PHP le
programme disponible sur tous les serveurs Linux nommés Sendmail, vous devez indiquer ici le
chemin d’accès à ce programme.
Identification SMTP : si votre serveur de messagerie externe nécessite une identification,
indiquez Oui.
Sécurité SMTP : indiquez ici le type de modèle de sécurité utilisé par le serveur SMTP (SSL
ou TTL).
Port SMTP : saisissez le numéro de port utilisé par le serveur SMTP.
Utilisateur SMTP : indiquez le nom d’utilisateur fourni par votre fournisseur de messagerie
externe.
Mot de passe SMTP : indiquez le mot de passe fourni par votre fournisseur de messagerie
externe.
Serveur SMTP : il s’agit du nom du serveur SMTP de votre fournisseur de messagerie
externe.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 56 — #80
✐ ✐
Les filtres de texte permettent, comme leur nom l’indique, d’autoriser ou d’interdire certaines
chaînes de caractère dans les zones de contenu passant par un éditeur WYSIWYG. On pense
évidemment aux balises HTML, certaines vont être autorisées et d’autres non. Les filtres par
défaut proposés par Joomla! vous garantissent un bon niveau de protection.
Pour chaque groupe existant (public, invité, gestionnaire, etc.) vous pouvez définir un niveau
de filtre spécifique. Il existe 5 niveaux différents, du plus rigide au plus permissif : aucun filtre,
pas de HTML, Liste blanche, Liste noire personnalisée, Liste noire par défaut.
Les filtres de texte sont un élément important de votre sécurité. Et permettre aux auteurs de
gérer leur contenu sans filtres, par confort ou commodité, peut entraîner une faille de sécurité.
Dans l’exemple ci-dessous (figure 3.7), nous avons attribué une liste noire personnalisée au
groupe des gestionnaires.
Figure 3.7 — Utiliser les filtres de textes pour protéger son site
Cette liste noire d’exemple autorise un utilisateur membre du groupe des gestionnaires à
insérer n’importe quelle balise HTML à l’exception de celles mentionnées dans le champ de
filtre : iframe, applet, frame et script.
Les éléments qui suivent ne sont pas dans la configuration du site mais constituent des éléments
indépendants, très utiles quand on rencontre un problème technique. Pour y accéder, rendez-vous
sur l’accueil du panneau d’administration (cliquez sur l’icône Joomla pour y revenir) ou bien sur
Informations système dans le menu Système.
Informations système : les informations système vont vous renseigner sur le type de
serveur Web utilisé, son nom, la version de PHP, la version du serveur de base de données, son
interclassement et la version de Joomla!.
Paramètres PHP : c’est ici que vous allez pouvoir trouver des réponses pour votre
débogage de niveau 0, à savoir si « Safe Mode », « Magic quotes » et « Register Globals » sont
activés. Quinze paramètres sont affichés dont « Open basedir », « Display Errors », « Short open
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 57 — #81
✐ ✐
tags », « File Uploads », « Output Buffering », « Session Save Path », « Session auto start », « XML
activé », « Zlib activé », « Disabled functions », « Mbstring actif », « Iconv activé ».
Fichier de configuration : le fichier de configuration est un élément vital de votre site car il
contient notamment les identifiants et adresses pour que Joomla! se connecte au serveur de base
de données. Certaines valeurs affichées dans cet onglet sont masquées, par mesure de sécurité.
Conseil : une fois votre Joomla! installé, vous pouvez « verrouiller » le fichier de configuration
de votre site. En faisant cela, vous ôtez les droits à toutes personnes ou système (vous y
compris) de modifier les données de configuration. C’est ce que nous vous conseillons de
faire une fois que vous aurez établi votre configuration finale. Via votre logiciel FTP, modifiez
les attributs du fichier pour en interdire l’écriture.
Permissions des dossiers : cet onglet vous présente la liste des dossiers sur lesquels
Joomla! est amené à effectuer des modifications ainsi que leur état. Si l’un d’eux n’est pas
modifiable, Joomla! ne pourra pas effectuer certaines opérations, comme l’installation d’une
extension ou l’ajout d’une image par exemple. C’est souvent de là que viennent les problèmes,
soyez vigilant.
Informations PHP : élément essentiel en cas de débogage, le résultat de la fameuse
fonction phpinfo(). Si vous arrivez ici, c’est que vous êtes développeur et ce n’est pas l’objet de
ce livre que de vous expliquer où trouver l’activation de la librairie gd ou openssl.
En résumé
Prenez le temps de paramétrer convenablement votre Joomla!. Ce n’est pas tous les jours que
vous lancerez un site. Si vous ne comprenez pas certains termes, ignorez-les, le plus important
est que vous soyez à l’aise. Joomla! est comme une montre de précision, vous pouvez vous
contenter de la remonter de temps en temps, mais vous avez aussi la possibilité d’explorer le
mécanisme et de mettre vos doigts dedans. Les résultats sont les mêmes qu’en horlogerie : si
vous ne savez pas ce que vous faites, vous risquez de ne plus avoir de montre... ou de site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 58 — #82
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 59 — #83
✐ ✐
DEUXIÈME PARTIE
Gérer et publier
vos contenus
Parce que Joomla! est avant tout un gestionnaire de contenu, nous allons voir ensemble tout ce
que vous pouvez faire avec.
Qu’il s’agisse de texte ou de contenus multimédias, tous constituent le cœur du métier de
webmestre et la vie quotidienne d’un site, d’un blog ou d’un portail. Sans contenu, votre site
n’est rien d’autre qu’une enveloppe vide et fort heureusement, Joomla! vous offre plein d’outils
pour mettre en forme et valoriser vos créations.
Vous voulez présenter votre entreprise ou votre association ? Vous voulez diffuser vos vidéos
publiées sur YouTube ou Dailymotion ? Vous voulez mettre à la disposition de vos clients vos
catalogues produits et des galeries d’images ? Vous voulez relayer sur Twitter ou Facebook votre
actualité, vos événements ou ce qu’on dit de vous dans la presse ? Vous voulez afficher la météo
de votre région, proposer une banque de CV, créer vos propres formulaires d’inscription, insérer
des cartes dynamiques ou gérer votre communauté ?
C’est ici !
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 60 — #84
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 61 — #85
✐ ✐
4
Organiser votre site
Objectif
Ce chapitre doit vous permettre non seulement d’organiser vos contenus, ce qui est extrême-
ment important dans un site, mais également d’agencer votre page d’accueil ainsi que la façon
dont vont se présenter les pages de votre site Web.
Pour bien utiliser Joomla!, il faut bien comprendre qu’il y a une différence entre vos contenus
et la manière d’y accéder. Si vous créez des catégories avec une seule page à l’intérieur, par
exemple, cela se verra sur le site et risquera de pénaliser la navigation.
Soyez le plus organisé possible pour que votre site soit le plus clair possible.
Astuce de pro : n’hésitez pas à faire un petit sondage auprès de vos clients pour savoir ce qu’ils
voudraient absolument retrouver sur votre site et ce qui les intéresse moins. Vous serez surpris du
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 62 — #86
✐ ✐
résultat et cela vous permettra de répondre plus précisément à vos attentes. Si vous êtes connu dans
un secteur particulier ou dans une zone géographique limitée, vous pouvez également interroger des
prospects pour savoir quelle image ils ont de vous. Savoir quelle est la réputation de votre entreprise
peut conditionner les informations à afficher sur la page d’accueil. Une entreprise qui souffrirait d’un
manque d’identification de son activité aurait tout intérêt à présenter celle-ci visuellement sur sa
« une » et à y consacrer une page entière par exemple.
Contenant et contenu
L’avantage principal des CMS est de séparer le contenant du contenu. Vous pouvez mettre à jour
le noyau Joomla! sans que cela n’affecte vos contenus. De même, si vous changez de template,
votre site sera complètement différent et vous n’aurez pourtant pas touché au contenu ni ajouté
d’extensions tierces.
En toute logique, nous devrions vous conseiller d’adapter votre contenant à votre contenu,
mais nous allons voir que, parfois, il peut falloir faire l’inverse. En effet, il y a encore quelques
années, un site ne possédait que son propre contenu : les pages qui le composaient. Aujourd’hui
un site présente du contenu que ses auteurs n’ont pas rédigé ou ne contrôlent pas. Un site
d’e-commerce par exemple affiche les appréciations des clients sur leurs produits et un site
communautaire met en avant les commentaires de ses membres.
Bien entendu, les publicités, fils d’informations RSS et autres contenus en provenance des
réseaux sociaux (Twitter, Facebook, Viadeo, LinkedIn) sont autant d’exemples de contenus
présents sur un site, qui peuvent impacter votre contenant.
Si tout le monde se souvient de la phrase culte du monde de la presse : « Le poids des mots,
le choc des photos », c’est moins vrai pour le monde du Web.
En effet, les premiers éléments que nous percevons d’un site Web, ce sont les titres des
pages qui le composent. Quand nous lançons une recherche via un moteur de recherche, nous
ne voyons pas encore les sites, seulement une liste de liens hypertextes et leurs descriptions
associées. Le titre de votre site est donc à ce niveau votre principal vecteur de visites. D’un point
de vue général, chaque titre est important puisque chacune de vos pages est indexée dans les
moteurs de recherche et peut donc servir de point d’entrée à votre site.
Les catégories sont des dossiers virtuels dans lesquels vous allez « ranger » vos pages ou articles.
Par exemple sur un site d’e-commerce, pour trouver une pelle, vous iriez dans la catégorie
« Jardin » puis dans la sous-catégorie « Outillage ». Un site bien organisé permet à vos internautes
de trouver facilement ce qu’ils cherchent.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 63 — #87
✐ ✐
À l’heure où tous vos concurrents ont des sites Web, c’est un critère à ne pas prendre à la
légère.
Le gestionnaire de catégories
Pour accéder au gestionnaire de catégories, allez sur le menu « Contenu », puis cliquez sur
Gestion de catégories. C’est là que vous pourrez créer, modifier et supprimer vos catégories.
Si vous avez installé les données d’exemple, vous trouverez dans votre gestionnaire toute
une série de catégories, imbriquées les unes dans les autres.
Sur la partie gauche se trouve un menu muni de trois liens. Le gestionnaire de catégories,
le deuxième, est sélectionné. Le premier sert à passer au gestionnaire d’articles et le dernier au
gestionnaire des articles affichés sur la page d’accueil (articles en vedette).
Astuce pratique : en cliquant sur un titre de colonne, comme par exemple le « titre », Joomla! va
trier le tableau selon ce critère par ordre descendant (alphabétique). Un second clic triera le tableau
par ordre ascendant (alphabétique inversé).
Le statut : cette colonne vous indique l’état de publication d’une catégorie. Une catégorie
est publiée ou ne l’est pas. Une coche verte signifie que la catégorie est publiée, un rond rouge
signifie que la catégorie n’est pas publiée.
Titre : dans cette colonne apparaissent le titre de la catégorie et son alias (en plus petit sur
la droite).
Accès : indique le niveau d’accès de la catégorie. Une catégorie peut en effet être accessible
par tout le monde (accès public) ou bien être réservée seulement aux membres du site (utilisateurs
enregistrés), aux modérateurs ou administrateurs (utilisateurs spéciaux). Nous vous rappelons
que vous avez la possibilité de créer vos propres niveaux d’accès ainsi que vos propres groupes
d’utilisateurs. Une catégorie peut donc n’être accessible qu’à un niveau d’accès que vous auriez
vous-même défini (voir au chapitre 7).
Langue : dans le cadre d’un site multilingue, et pour retrouver facilement les articles rédigés
dans telle ou telle langue, le gestionnaire de catégories vous affiche la langue de la catégorie.
Vous pouvez ainsi avoir une arborescence différente d’une langue à l’autre.
ID : l’identifiant ou ID d’une catégorie est une valeur d’enregistrement interne à Joomla! : il
permet l’identification de la catégorie au sein de la base de données.
Les filtres
Vous trouverez au-dessus un filtre de recherche rapide, ainsi qu’un bouton Outils de recherche,
faisant apparaître d’autres filtres selon le niveau, le statut (publié ou non), le niveau d’accès, la
langue et les tags. Ces filtres sont très pratiques quand vous devez retrouver une catégorie dans
une grande arborescence. Cliquez sur la coche verte d’une catégorie pour la dépublier puis
sélectionnez dans le filtre le statut Non publié (figure 4.1). La page va se recharger en n’affichant
que les catégories dépubliées.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 64 — #88
✐ ✐
Détails
Dans l’onglet des détails, seul le titre de catégorie est obligatoire, tout le reste est optionnel
(figure 4.2).
Alias : l’alias d’une catégorie est important puisqu’il peut apparaître dans l’URL de vos
pages en fonction des réglages effectués dans la configuration.
Description : la description de votre catégorie est importante, surtout si les articles que vous
y rattachez traitent de vos produits. Vous pouvez inclure dans votre description des images, des
liens hypertextes, des tableaux, etc.
Parent : pour créer votre arborescence, vous pouvez avoir besoin d’imbriquer une catégorie
dans une autre. Pour rattacher une catégorie à une autre (relation parent-enfant), sélectionnez
une catégorie déjà existante dans la liste.
Tags : cette option vous permet de tagger vos catégories avec un ou plusieurs tags que vous
choisissez (voir la Gestion des Tags au chapitre 11).
Statut : par défaut une nouvelle catégorie est publiée. Vous pouvez changer son état grâce
à la liste déroulante.
Accès : niveau d’accès à la catégorie : public, uniquement accessible aux membres
(enregistrés), aux modérateurs et administrateurs (utilisateurs spéciaux) ou à un groupe que
vous auriez vous-même créé (clients).
Langue : sélectionnez la langue pour laquelle est créée cette catégorie. Les langues listées
sont celles définies dans le gestionnaire de langues.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 65 — #89
✐ ✐
Note : vous pouvez saisir une note à l’attention des autres personnes ayant accès à la
gestion des catégories. Cette note ne sera pas visible sur la partie publique du site.
Note de version : grâce à la gestion d’historique de version, vous pouvez laisser une note
correspondant à la version en cours.
Paramètres de publication
Créé par : la seule véritable option à cette étape est le choix de l’utilisateur qui crée la catégorie.
Si vous cliquez sur le bouton muni d’un petit personnage, une fenêtre pop-up va s’ouvrir avec
la liste de tous vos utilisateurs. Comme vous êtes un super-utilisateur, vous pouvez attribuer la
création d’une catégorie à quelqu’un d’autre (figure 4.3).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 66 — #90
✐ ✐
Clics : lorsque celle-ci est utilisée comme critère de navigation, ce compteur indique le
nombre de fois où la catégorie aura fait l’objet d’une visite.
ID : ne vous préoccupez pas de ce champ, il est à zéro par défaut. Un identifiant ne sera
attribué à la catégorie que lorsque vous la sauvegarderez.
Afin de centraliser l’ensemble des opérations de référencement au même endroit, les
explications relatives aux métadonnées (description, mots-clés, auteur, robots) sont présentées
au chapitre 9 dédié au référencement.
Paramètres
Type de mise en page : vous pourrez définir dans la partie 4.3, comment se présenteront
vos catégories « par défaut ». Pour autant, vous pouvez avoir envie que l’une ou l’autre de vos
catégories échappe à ce comportement par défaut. C’est pourquoi vous pouvez indiquer ici si la
catégorie se présentera comme un « blog » ou comme une « liste ».
Image : vous pouvez choisir une image pour représenter cette catégorie.
Droits de la catégorie
Cet espace regroupe la gestion des règles d’accès à une catégorie. Vous avez ainsi accès à une
gestion extrêmement fine des droits. Vous pouvez par exemple permettre à un auteur de n’écrire
que sur une catégorie, à un modérateur de modifier et supprimer deux ou trois catégories et à
un éditeur de mettre en ligne l’intégralité de vos contenus.
Par défaut, les droits des groupes sur une nouvelle catégorie sont hérités des droits définis au niveau
de chaque groupe. Si vous avez défini que les membres de votre groupe « auteurs » ne pouvaient
pas créer de catégorie, vous n’avez pas besoin de le repréciser lors de la création d’une nouvelle
catégorie. Celle-ci « hérite » des droits du groupe. En revanche, vous pouvez leur permettre de créer
des catégories uniquement pour une catégorie parente donnée.
Cliquez sur le nom d’un groupe (partie de gauche) pour afficher ses droits (partie de droite).
Les différentes actions possibles du workflow sont listées : Créer, Supprimer, Modifier, Modifier le
statut, Modifier ses éléments. Pour chaque action, sélectionnez ce que vous autorisez ou pas, ou
bien laissez les permissions attribuées aux groupes (Hérité) (figure 4.4). Cliquez sur Enregistrer
pour voir s’appliquer vos modifications.
Les explications sur l’ensemble de la gestion des droits sont présentées au chapitre 7.
Pratique : lorsque vous publiez ou dépubliez une catégorie parente, les catégories qui lui sont
rattachées subissent la même modification.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 67 — #91
✐ ✐
Pour déverrouiller la catégorie, cochez la case précédant le statut et cliquez, soit directement
sur le cadenas ou sur le bouton d’action Déverrouiller.
Mettre à la corbeille : attention, vous pouvez mettre à la corbeille une catégorie, même si
des articles y sont rattachés. Les articles de la catégorie supprimée ne sont pas supprimés, mais
ils deviennent inaccessibles sur votre site jusqu’à ce que vous les rattachiez à une autre catégorie.
En cas d’erreur, vous pouvez toujours récupérer une catégorie supprimée (voir ci-après).
Récupérer une catégorie supprimée : la corbeille est un espace très utile de Joomla!
puisque, comme dans votre ordinateur par exemple, tout y est conservé, tant que vous ne la videz
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 68 — #92
✐ ✐
pas. Si vous avez supprimé par erreur une catégorie, vous pouvez la « restaurer » en vous rendant
dans le gestionnaire de catégorie et en sélectionnant dans le filtre de statut Dans la corbeille. La
page va se recharger et afficher uniquement les catégories passées à la corbeille. Cliquez sur le
titre de la catégorie à restaurer, modifiez son état en publié ou dépublié et sauvegardez. Vous
pouvez aussi cliquer sur la case à cocher devant le nom et utiliser les boutons d’action Publier
ou Dépublier.
Vider la corbeille (supprimer définitivement un élément) : pour supprimer défini-
tivement un élément, utilisez le filtre des statuts et sélectionnez Dans la corbeille. La page va
se recharger et afficher uniquement les catégories présentes dans la corbeille. Sélectionnez les
catégories à supprimer en cochant la case devant leur nom puis cliquez sur le bouton « Vider la
corbeille ».
La case à cocher située comme un titre de colonne permet de tout sélectionner, un second
clic désélectionne tout. Vous ne pouvez pas supprimer (définitivement) une catégorie contenant
des articles, il vous faut d’abord les rattacher à une autre catégorie.
Déplacer ou Copier une catégorie : si vous souhaitez déplacer ou copier une catégorie,
vous pouvez le faire en modifiant sa fiche comme nous venons de le voir. Si vous souhaitez traiter
plusieurs catégories de la même manière, c’est possible. Sélectionnez par exemple les catégories
nommées « Beez3 » et « Protostar » en cochant la case devant leur nom. Cliquez ensuite sur le
bouton d’action Traitement.
Dans la nouvelle fenêtre, sélectionnez dans la liste déroulante la catégorie vers laquelle vous
voulez envoyer les catégories sélectionnées. Choisissez ensuite entre Copier ou Déplacer, puis
cliquez sur Traitement (figure 4.6).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 69 — #93
✐ ✐
Vous pouvez accéder à ces paramètres par les pages de gestion des catégories, de gestion des
articles et de gestion des articles en vedette. Cliquez sur le bouton Paramètres, situé à droite dans
la barre de boutons d’action. Une nouvelle fenêtre s’ouvre avec différents onglets. C’est ici que
vous allez effectuer l’ensemble des réglages concernant l’affichage de vos articles et catégories
(figure 4.7).
Comme pour tous les éléments administrables dans Joomla!, vous allez définir des règles générales,
mais rien ne vous empêche de définir des règles spécifiques pour un article ou une catégorie donnée.
Après vos modifications, n’oubliez pas de cliquer sur Enregistrer & Fermer.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 70 — #94
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 71 — #95
✐ ✐
Cela améliore l’ergonomie du site et incite à cliquer. Nous vous conseillons de coupler cette
option avec les titres cliquables.
Titre de l’article : affiche le titre de l’article à la place de « lire la suite ».
Nombre de caractères : si l’option « titre de l’article » ci-dessus est affichée, vous pouvez
indiquer ici le nombre de caractères à afficher. Utile si vous avez régulièrement des titres à
rallonge ou pour maîtriser votre affichage.
Afficher les tags : Permet de faire apparaître les tags saisis dans l’article.
Paramètres d’agencement
Paramètres de publication : si désactivée, cette option masquera les paramètres de
publication en mode création et modification d’articles. Vous empêchez ainsi le changement de
dates (de création ou de publication) ainsi que de l’auteur de l’article (figure 4.8).
Paramètres d’article : de la même manière, vous avez la possibilité de bloquer la
modification des paramétrages d’un article en création comme en modification. Vous garantissez
ainsi une publication homogène de vos articles quels qu’en soient les auteurs.
Sauvegarder l’historique : permet d’activer ou désactiver la gestion de version de vos
contenus.
Versions maximum : définit le nombre maximum de versions conservées.
Images et liens en frontal : vous autorisez l’utilisation des options standards d’insertion
d’images et de liens depuis l’interface frontale du site, pour les articles rédigés ou modifiés
depuis cette interface.
Images et lien en admin : dans le même esprit, l’accès à ces mêmes options standards
peut être retiré depuis l’interface d’administration.
Cible de l’URL A, B, et C : lorsque les options standards d’ajout de liens sont disponibles,
permet de spécifier le comportement de renvoi du lien fourni : ouverture dans la même fenêtre
(remplace l’affichage actuel), s’ouvre dans une nouvelle fenêtre de navigation, dans une fenêtre
sans navigation (de type popup), ou dans une fenêtre modale. Ce dernier choix permet d’ouvrir
une fenêtre en avant-plan, il sera nécessaire de fermer celle-ci pour reprendre la main sur
l’affichage courant du site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 72 — #96
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 73 — #97
✐ ✐
Catégories vides : voulez-vous afficher à vos visiteurs vos catégories vides ? Cela peut se
justifier dans certains cas, comme pour l’ouverture d’une nouvelle catégorie ou l’arrivée d’articles
imminents, mais sinon, évitez.
Message d’alerte : affiche un message lorsque la catégorie ne contient aucun article.
Cette option va de pair avec l’affichage des catégories vides.
Desc. sous-catégories : affiche la description des catégories « enfants ».
Nombre d’articles : affiche le nombre d’articles que contient une catégorie.
Afficher les tags : permet de faire apparaître les tags saisis pour la catégorie.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 74 — #98
✐ ✐
Format de date : si vous affichez une date, vous pouvez choisir son formatage. Une date
peut être notée « 24/01/2011 » ou « lundi 24 janvier 2011 ». À vous de choisir.
Nombre d’affichages : une « requête » d’article indique en fait son affichage. Si vous
souhaitez afficher le nombre de fois qu’un article a été lu, activez cette option.
Auteur : affichez cette information uniquement si vous avez un site multi-auteur, sinon ça
n’a pas tellement de sens.
Paramètres partagés
Ordre des catégories : vous pouvez choisir ici l’ordre l’affichage des catégories entre elles :
alphabétique, alphabétique inversé ou bien l’ordre de votre arbre des catégories.
Ordre des articles : choisissez maintenant l’ordre de présentation des articles. Nous vous
conseillons les plus récents en premier, cela attire l’attention de vos visiteurs sur votre actualité
du moment et encourage à la navigation. Vous avez le choix entre neuf possibilités basées sur
les dates des articles (voir ci-dessous), leurs titres, le nom des auteurs, la popularité des articles
et l’ordre tel qu’il existe dans le gestionnaire d’article.
Classement par date : si dans le paramètre ci-dessus, vous optez pour un classement par
date « les plus récents » ou « les plus anciens », vous pouvez choisir ici le type de date à retenir :
date de création, date de modification ou date de publication. Nous vous conseillons la date de
publication.
Pagination : si vous avez beaucoup d’articles, vous voudrez peut-être offrir à vos visiteurs
la possibilité de naviguer d’une page à l’autre. La pagination va rajouter en bas de page les
boutons Suivant et Précédent.
Position de pagination : la position de pagination ajoute en fait une information pour vos
visiteurs. Elle indique le nombre de pages de résultat et la position de la page dans l’ensemble
des résultats (page 1 sur 5, 2 sur 5, etc.).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 75 — #99
✐ ✐
Conseil des auteurs : une page d’accueil qui ne donne pas envie aux visiteurs réduit les
visites, les ventes, la fréquentation et la participation. Dès votre page d’accueil, vous devez
répondre à toutes ces questions : qui êtes-vous, qu’est-ce que vous faites, qu’est-ce que vous
proposez ?
Pour être visible sur la page d’accueil, votre article doit bien sûr être publié !
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 76 — #100
✐ ✐
Les options d’affichage qui permettent de réaliser des modifications sur la structure de la page
d’accueil se trouvent dans l’onglet Affichage. Nous allons maintenant changer la présentation
de la page d’accueil. Avant tout, ouvrez une nouvelle fenêtre ou un nouvel onglet de votre
navigateur pour avoir un œil sur votre page d’accueil.
Saisissez 0 pour « Articles complet », 4 pour « Introduction des articles » et 2 pour le « Nombre
de colonnes » (figure 4.12). Cliquez sur Enregistrer et rechargez votre page d’accueil (touche F5)
pour constater les changements.
Testez différentes mises en page, puis faites les valider par un groupe d’utilisateurs restreint
ou des clients privilégiés : ils vous orienteront vers votre page d’accueil idéale.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 77 — #101
✐ ✐
l’ergonomie générale de la page. Pour accéder à ces réglages, toujours depuis le lien Accueil
du menu principal, rendez-vous dans l’onglet Paramètres pour voir s’afficher tous les réglages
disponibles (figure 4.13).
Conseil des auteurs : pour obtenir la page d’accueil la plus lisible possible, affichez les titres de vos
articles et rendez les cliquables. Tous les autres paramètres peuvent être masqués.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 78 — #102
✐ ✐
possible. Gardez à l’esprit cette souplesse d’usage. Pour tout savoir sur les modules et leurs
usages, rendez-vous au chapitre 13 : « Gérer les modules ».
En résumé
Vos contenus sont ce que vous voulez offrir, présenter, valoriser pour vos visiteurs. Pour qu’ils
soient facilement accessibles, pour qu’un internaute comprenne rapidement la logique de votre
site et à quel endroit il va pouvoir trouver l’information qui l’intéresse, prenez le temps de bien
concevoir l’arborescence de votre site. Maintenant que votre contenant est prêt, rendez-vous
au chapitre suivant pour gérer vos contenus.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 79 — #103
✐ ✐
5
Créer et modifier
ses textes
Objectif
Qu’il s’agisse de recettes de cuisine, de votre catalogue produit ou d’articles d’actualité, votre
contenu textuel est très important. C’est bien sûr l’information première que retiendront vos
visiteurs. C’est également ce qui servira de base au référencement et au positionnement de
votre site Web. Vous allez apprendre dans ce chapitre à prendre en main l’outil de publication
de contenu proprement dit. Nous verrons au chapitre suivant comment enrichir votre contenu.
Le gestionnaire d’articles
L’interface du gestionnaire d’articles s’est constamment améliorée depuis les premières versions
de Joomla!. Elle offre maintenant une ergonomie vraiment intéressante qui facilite la prise en
main de l’outil. Pour y accéder, rendez-vous dans le menu « Contenu », puis cliquez sur Gestion
des articles. C’est ici que vous allez créer, modifier et supprimer vos articles.
Si vous avez installé les données d’exemple, vous trouverez dans votre gestionnaire toute
une série d’articles traitant de Joomla!, de koalas et de boutique de fruits.
Les données d’exemple contiennent trois sites en un : le premier présente des indications
générales sur Joomla! et la communauté, le deuxième est un mini-site pour une boutique de
fruits et le troisième est en réalité un blog de voyage sur les parcs australiens.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 80 — #104
✐ ✐
Une fois dans la « Gestion des articles », vous trouverez trois éléments de menu sur la gauche,
le premier sélectionné étant « Articles », c’est l’endroit où vous vous trouvez. Le deuxième sert à
passer au gestionnaire de catégories et le troisième au gestionnaire des articles affichés sur la
page d’accueil (articles en vedette).
Astuce pratique : en cliquant sur un titre de colonne, comme par exemple le « titre », Joomla! va
trier le tableau selon ce critère par ordre descendant (alphabétique). Un second clic triera le tableau
par ordre ascendant (alphabétique inversé).
Statut : cette colonne vous indique l’état de publication des articles. Un article est publié ou
ne l’est pas. Une coche verte signifie que l’article est publié, un rond rouge signifie que l’article
n’est pas publié.
Un second élément de statut est présent dans cette même colonne : celui de la mise en
vedette de l’article, symbolisé par une petite étoile. Tour à tour grise ou orange, il s’agit d’une
option permettant une mise en avant d’articles en page d’accueil du site.
Un troisième élément est présent sous forme d’un petit triangle vers le bas, indiquant la
présence d’un petit menu déroulant. En cliquant sur ce petit triangle, il vous sera proposé des
options directes permettant d’archiver ou de mettre à la corbeille l’article en cours.
Le titre : dans cette colonne apparaissent le titre de l’article ainsi que sa catégorie et son
alias (écrits en plus petit).
Accès : indique le niveau d’accès de l’article. Un article peut en effet être accessible par
tout le monde (accès public) ou bien être réservé seulement aux membres du site (utilisateurs
enregistrés), aux modérateurs ou administrateurs (utilisateurs spéciaux). Nous vous rappelons
que vous avez la possibilité de créer vos propres niveaux d’accès ainsi que vos propres groupes
d’utilisateurs. Une catégorie peut donc n’être accessible qu’à un niveau d’accès que vous auriez
vous-même défini (voir le chapitre 7).
Auteur : affiche le nom de l’auteur qui a créé l’article.
Langue : Joomla! offre nativement la possibilité de créer un site multilingue. Pour retrouver
facilement les articles rédigés dans telle ou telle langue, le gestionnaire d’articles vous indique
la langue de référence.
Date : indique la date de création de l’article. La présence de cette colonne vous permet
donc de trier les articles pour arriver aux plus récents ou aux plus anciens.
Clics : indique le nombre de clics (ou visites) de l’article.
ID : l’identifiant ou ID d’un article est un élément numérique attribué automatiquement par
Joomla!. Vous pouvez en avoir besoin si vous souhaitez afficher des modules sur une seule page
donnée par exemple.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 81 — #105
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 82 — #106
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 83 — #107
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 84 — #108
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 85 — #109
✐ ✐
Images et liens
Nous évoquions au chapitre précédent la possibilité d’insérer des images prenant place lors
des modes d’affichage d’introduction ou bien complet. Celles-ci peuvent ainsi être spécifiées
en dessous du texte principal de l’article. De la même manière, les trois liens URL pourront être
indiqués à cet emplacement.
Par défaut, les droits des groupes sur un nouvel article sont hérités des droits définis au niveau de
chaque groupe. Si vous avez défini que les membres de votre groupe « auteurs » ne pouvaient pas créer
d’articles, vous n’avez pas besoin de le repréciser à la création d’un nouvel article. Celui-ci « hérite »
des droits du groupe. En revanche, vous pouvez leur permettre de créer des articles uniquement pour
une catégorie donnée.
Cliquez sur le nom d’un groupe (partie de gauche) pour afficher ses droits (partie de droite).
Les différentes actions possibles du flux de travail sont listées : supprimer, modifier, modifier
le statut. Pour chaque action, sélectionnez ce que vous autorisez ou pas, ou bien laissez les
permissions attribuées aux groupes (Hérité). Cliquez sur Enregistrer pour voir s’appliquer vos
modifications.
Les explications sur l’ensemble de la gestion des droits sont présentées au chapitre 7 :
« Utilisateurs, groupes et permissions ».
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 86 — #110
✐ ✐
HTML
Derrière un mot en gras, un paragraphe justifié, une image, il y a du code. Ce code est interprété
par votre navigateur Internet (Internet Explorer, Mozilla Firefox, Chrome, Safari, Opera, etc.) qui
convertit les éléments du code en éléments visibles. Ainsi <strong>bonjour</strong> s’interprète
bonjour en gras.
Le HTML est une norme définie par le W3C (le World Wild Web Consortium), organisme
qui a pour objectif de standardiser Internet en imposant des normes aux développeurs,
intégrateurs, webdesigner et surtout aux navigateurs Internet. Pour ceux qui connaissent le
HTML, il est souvent plus rapide de modifier le code pour régler un problème de mise en page.
Si vous souhaitez en savoir plus sur cette norme qui évolue tout le temps, nous vous
conseillons d’aller visiter le site du W3C dont une grande partie est accessible en français.
Astuce de pro : servez-vous de votre plan média ! Si vous savez en début d’année, ou en début
d’exercice, quels vont être vos événements importants, pourquoi ne pas écrire une brève ou un article
dès maintenant et planifier sa publication ? Vous ne manquerez plus d’annoncer votre participation
à une foire, un congrès et vous pourrez même programmer plusieurs articles sur un mois, afin de créer
un effet « teasing ».
1. Raphaël Goetter est co-gérant de la société Alsacreations.fr, auteur de plusieurs ouvrages sur les CSS
(Mémento CSS3, CSS avancées – vers HTML5 et CSS3, CSS2 Pratique du design Web, Memento CSS, Memento
XHTML) et membre du collectif Openweb, référence francophone en matière de standards Web.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 87 — #111
✐ ✐
Copier un article
Vous avez passé du temps sur une mise en page et vous ne souhaitez pas tout recommencer
pour un article similaire : il vous suffit de copier l’article. Joomla! dupliquera l’intégralité de
son contenu (textes, images, liens, etc.), vous n’aurez ensuite qu’a mettre à jour la copie pour
créer un article complètement indépendant. Pour ce faire, cliquez sur le titre de l’article que vous
souhaitez copier. Une fois en modification, saisissez le nouveau titre, supprimez l’alias (Joomla!
en créera un autre) dans le second onglet puis cliquez sur Enregistrer une copie (figure 5.7).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 88 — #112
✐ ✐
Déverrouiller un article
Si vous voyez un cadenas devant un article, comme sur la figure 5.8, c’est que Joomla! l’a
verrouillé par mesure de sécurité. Par exemple, si vous étiez en train de modifier un article et
que vous fermiez d’un coup votre navigateur, Joomla! vous avertit qu’une action potentiellement
dangereuse a eu lieu.
Pour déverrouiller l’article, cliquez directement sur le cadenas ou bien cochez la case
précédant son titre, puis cliquez sur le bouton Déverrouiller depuis la barre d’action.
Archiver un article
Vous avez trop d’articles dans votre gestionnaire d’articles, archivez les plus vieux ou ceux que
vous ne modifiez que très rarement. Pour ce faire, une fois dans la gestion des articles, cochez la
case précédant le statut d’un article et cliquez sur le bouton d’action « Archiver ». L’article va
disparaître du gestionnaire d’articles, mais il n’est ni supprimé ni dépublié pour
autant. Pour accéder aux articles archivés, sélectionnez « Archivé » dans la liste déroulante
située dans les filtres au-dessus de l’écran (figure 5.9).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 89 — #113
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 90 — #114
✐ ✐
Une évolution notable depuis la version 3 est l’ajout d’une fonction de gestion de version,
également appelée Versioning de contenu.
Prenons quelques exemples : Vous venez de supprimer un paragraphe d’un de vos articles et avez
enregistré. Vous regrettez cette modification mais vous ne pouvez plus revenir en arrière, le texte
supprimé est perdu. Vous avez plusieurs auteurs et vous constatez que des contenus de vos articles
sont erronés ou partiellement supprimés. Que faire ?
Aujourd’hui Joomla! palie ces défauts en vous permettant de retrouver, et même de restaurer
ces contenus perdus.
Nous avons vu au chapitre précédent (partie 4.3) des options d’agencement du contenu
permettant d’activer une sauvegarde de l’historique des contenus ainsi qu’un nombre maximal
de versions à retenir. Il s’agit là de la gestion des versions.
Une fois cette option activée, tout nouvel article se verra attribuer une version à chaque
nouvel enregistrement. Joomla! gardera alors en base de données des sauvegardes de chacun
de ces contenus.
Depuis la gestion des articles, prenez un article en édition en vous assurant qu’il ait déjà
subi des modifications. Au besoin, modifiez un paramètre de celui-ci et cliquez sur le bouton
Enregistrer. Vous constaterez qu’un bouton Versions est présent dans la barre de boutons
d’actions (figure 5.11).
Ce bouton vous donne alors accès à une fenêtre vous permettant différentes actions sur les
versions précédemment enregistrées de cet article (figure 5.12).
Rétablir : en cochant une version de la liste et en cliquant sur ce bouton, vous chargez la
version sélectionnée dans l’éditeur et vous la restaurez comme la version en cours.
Prévisualisation : cette option vous permet de consulter une version sauvegardée sans
avoir besoin de la restaurer.
Comparer : en sélectionnant deux versions, Joomla! vous présentera une comparaison
champ à champ des modifications apportées entre ces versions. Vous aurez notamment la
possibilité de filtrer sur les seuls changements apportés par le biais d’un bouton situé en haut à
droite de la fenêtre proposée. Cette fonction est notamment très utile et très rapide pour détecter
les modifications réalisées par vos auteurs sur leurs contenus.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 91 — #115
✐ ✐
Astuce de pro : Trop de versions tuent... les versions ! Faites un usage judicieux de cette
fonctionnalité. En effet, chaque version enregistrée, même pour une simple virgule ajoutée, augmente
la taille de votre contenu global. Veillez à dimensionner le nombre de versions sauvegardées afin de
ne pas voir votre base de données enfler inutilement.
Fonctionnalités
Grâce à cet éditeur de texte, vous pourrez notamment mettre un passage en gras, insérer une
image ou créer un lien hypertexte. Vous l’aurez compris, un éditeur HTML est l’un des outils
permettant de démocratiser les mises à jour de site Web pour les non professionnels du métier.
Là où il fallait auparavant des compétences en HTML, CSS, éventuellement en PHP et JavaScript,
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 92 — #116
✐ ✐
FTP, paramètres réseau et serveur ; il suffit maintenant de savoir saisir son identifiant et mot de
passe, de choisir la page que l’on désire modifier, puis d’utiliser un éditeur de type WYSIWYG.
Attention, ne pas effectuer cette simple opération peut créer le chaos le plus total dans la mise en
page de votre site.
Insérer un tableau
Créer le tableau
Pour créer un tableau dans une page de votre site, positionnez le curseur dans l’éditeur à
l’endroit où vous voulez le créer. Cliquez ensuite sur le menu Tableau puis Insérer un tableau. Un
sous-menu va s’ouvrir (figure 5.14). Sélectionnez le nombre de colonnes (5 dans notre exemple)
et de lignes (4) que vous souhaitez, vous pourrez en ajouter ou en supprimer par la suite. Un
bouton d’accès rapide représentant un petit tableau est également présent dans les icônes
générales et vous amène au même résultat.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 93 — #117
✐ ✐
Favoriser la navigation
Faire un lien hypertexte
Dès que l’on parle Web, les liens sont omniprésents : ils permettent la navigation, ils vous offrent
un point de départ vers une information. Si vous souhaitez savoir ce que d’autres lecteurs pensent
de ce livre, saisissez son titre dans un moteur de recherche et suivez un des liens des résultats
proposés.
Un lien vous permet de lier une adresse à un mot, une phrase ou une image. Cette
adresse (URL) est un chemin vers une autre page de votre site, un document (fichier à ouvrir ou
télécharger), une galerie d’image, ou bien un autre site (on parle alors de lien sortant).
Pour créer un lien, saisissez du texte, sélectionnez un ou plusieurs mots (en surbrillance), puis
cliquez sur le bouton Insérer/Éditer un lien sous forme de maillons de chaîne, comme le montre
la figure 5.16. Une fenêtre pop-up va s’ouvrir. Saisissez simplement l’URL de destination comme
http://www.joomla.fr, puis cliquez sur le bouton OK.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 94 — #118
✐ ✐
Cliquez sur le bouton Article pour faire apparaître une fenêtre pop-up de sélection d’article.
Utilisez les filtres pour choisir, comme dans notre exemple de la figure 5.18 l’article « Boutique
de fruits » de la catégorie du même nom.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 95 — #119
✐ ✐
1. Laurent Frauli est un spécialiste de la communication graphique. Positionné chez l’annonceur, il conçoit les
identités visuelles et est le garant de leur usage dans une stratégie de communication multicanal.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 96 — #120
✐ ✐
En résumé
Votre contenu est ce qu’il y a de plus important, non seulement pour vos clients, prospects, par-
tenaires, salariés, amis, membres de l’association ou de votre communauté, mais aussi pour les
moteurs de recherche. Un beau site qui n’offrirait que des informations insipides serait condamné
à être abandonné. D’un autre côté, un site ayant une information très intéressante mais mal
agencée ou pas mise en valeur ne retiendrait pas l’internaute. Tout est affaire d’équilibre.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 97 — #121
✐ ✐
6
Multimédia
et réseaux sociaux
Objectif
Vous allez apprendre à mettre en ligne sur votre site tous les types de fichiers supportés par
Joomla! via le gestionnaire de médias. Ensuite, nous verrons ensemble comment afficher un
magnifique diaporama et faire interagir votre Joomla! avec les réseaux sociaux. Nous allons
vous donner les outils nécessaires pour redimensionner à la volée un répertoire de plusieurs
images, les charger sur votre site et en faire une galerie d’images.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 98 — #122
✐ ✐
Attention ! Pour éviter tout problème, faites attention aux noms que vous donnez à vos
fichiers : évitez les caractères spéciaux, les accents, les espaces et les majuscules.
Taille et dimension
Dans 95 % des cas, vos images n’ont pas besoin d’être plus large que 800 pixels, ce qui assure
une bonne visibilité sur la majorité des écrans. Les images doivent donc être redimensionnées.
Quand on compare la taille des images sur un site Web avec la taille des photos d’un
appareil numérique, on constate que les images sur un site Web sont toutes petites. Les outils
proposés par Joomla! permettent de redimensionner (mettre à la bonne taille d’affichage) les
images mais il vaut mieux réduire les images (diminuer la taille et donc le poids de la photo)
avant de les télécharger.
Astuce de pro pour éviter que votre webmestre ne fasse des cauchemars : ne missionnez pas
quelqu’un pour mettre des articles en ligne s’il ne sait pas « retailler » des images. Vous risquez de
vous retrouver sur votre site avec des photos de 5 Mo et d’une taille démesurée (4 000 pixels sur
5 000 par exemple). Outre un temps de chargement très long pour la page concernée, votre site va
voir sa charte graphique déformée, donnant ainsi une image non professionnelle.
Astuce : nous verrons au chapitre 9 comment installer Google Analytics. Ce logiciel gratuit de
statistiques vous permettra de savoir précisément quelles sont les résolutions utilisées par vos visiteurs.
Astuce de pro : pour ne pas devoir renommer vos répertoires une fois qu’ils seront transférés dans
votre Joomla!, veillez à les nommer uniquement avec des minuscules, sans espace ni caractères
spéciaux, comme par exemple « rubrique_aperitifs », « rubrique_entrees », « rubrique_plats » et
« rubrique_desserts ».
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 99 — #123
✐ ✐
Présentation de l’interface
Dans le menu « Contenu », cliquez sur Gestion des médias. L’interface peut se présenter sous
deux aspects, soit en affichant les « Miniatures » des images, soit en affichant leurs « Détails »
(dimensions en pixels et taille du fichier). Vous pouvez passer d’un mode à un autre en cliquant
sur les onglets des mêmes noms, situés en haut de la page.
La partie de gauche présente la liste des dossiers contenus dans le gestionnaire d’article,
vous pouvez afficher le contenu d’un dossier en cliquant sur son nom. La partie de droite affiche
ce qui est contenu dans chaque dossier, c’est-à-dire les fichiers. Si vous avez installé les données
d’exemple, ouvrez tous les dossiers et sous dossiers possibles pour accéder au dossier « animals »
et cliquez dessus (figure 6.1).
Le premier élément des fichiers, la flèche vers le haut, permet en cliquant dessus de remonter
dans le dossier parent. Cliquez dessus plusieurs fois pour remonter à la racine, le dossier Média.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 100 — #124
✐ ✐
Vérifier les types MIME : vérifie les types MIME de vos fichiers. Le type MIME (pour
Multipurpose Internet Mail Extensions) est un identifiant de format de données à l’origine utilisé
pour vérifier les formats d’e-mails et maintenant utilisé par le protocole HTTP.
Images autorisées : vous allez spécifier ici les formats d’images que vous autorisez à
l’envoi.
Extensions ignorées : préciser ici les extensions pour lesquelles vous ne voulez pas qu’il y
ait de vérification du type MIME.
Types MIME autorisés et Types MIME interdits : spécifier dans ces champs les types
MIME que vous autorisez et ceux que vous interdisez.
Soyez vigilant : si vous avez un doute sur une option, enregistrez et testez le comportement de votre
site. Au moindre signe inhabituel (impossible d’ajouter un fichier d’un certain format), revenez à
cette rubrique et vérifiez vos paramètres.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 101 — #125
✐ ✐
Le gestionnaire de médias vous indique que la création est terminée avec un message en
surbrillance vert et il se recharge : votre nouveau dossier apparaît. Cliquez dessus (dans la partie
gauche ou la partie centrale de l’écran) pour entrer à l’intérieur. Recommencez l’opération en
créant un autre sous-dossier « chiens » au même niveau et deux sous-dossiers « exotiques » et
« automne » dans le répertoire « fruitshop » pour arriver au résultat de la figure 6.4. Attention,
regardez bien quel niveau vous avez sélectionné avant de créer un dossier.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 102 — #126
✐ ✐
Supprimer un dossier
Pour pouvoir supprimer un dossier, positionnez-vous dans son dossier parent (exemple sur le
répertoire parks si vous voulez supprimer le répertoire landscape). Que vous soyez en affichage
« Miniatures » ou « Détails », vous trouverez une icône de suppression (croix grise) à côté du nom
du dossier. Cliquez dessus pour supprimer le dossier. Attention, le gestionnaire ne vous
demande pas confirmation et l’opération est irréversible. Vérifiez bien qu’il s’agit du
bon dossier, sinon vous devrez le créer à nouveau.
Si vous avez plusieurs dossiers à supprimer d’un coup, cochez les cases précédant leur nom
et cliquez dans le menu du haut sur le bouton Supprimer. Si un dossier contient des images, il
ne peut être supprimé et vous obtiendrez alors un message d’erreur (figure 6.5).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 103 — #127
✐ ✐
Attention ! Avant tout ajout de répertoire entier d’images via l’interface FTP, vérifiez bien le nom
de vos images, qui ne doivent comporter ni espace, ni caractères spéciaux.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 104 — #128
✐ ✐
Installation
Rendez-vous sur le site http://picasa.google.fr/ pour télécharger la dernière version.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 105 — #129
✐ ✐
Dans Picasa, recherchez puis sélectionnez le dossier contenant les images à réduire. Si ce
répertoire n’apparaît pas, dans le menu Fichier, cliquez sur Ajouter un dossier à Picasa, la fenêtre
suivante vous permettra de relancer la recherche sur votre ordinateur.
Une fois le répertoire d’images sélectionné, depuis le menu en bas de l’écran, cliquez
sur le bouton Exporter. Une fenêtre « Exporter vers le dossier » va alors s’ouvrir. Indiquez
un emplacement d’exportation sur votre disque dur ainsi que le nom du dossier exporté
(en minuscules, sans accents ni caractères spéciaux). Comme sur l’exemple de la figure 6.8,
choisissez de redimensionner les images en 300 pixels (pour avoir des miniatures légères et pas
trop encombrantes pour les articles du site) et indiquez une qualité d’image à 85 %.
Vous avez également la possibilité d’inclure un filigrane sur vos photos afin de les protéger.
Cliquez enfin sur le bouton Exporter. Picasa va exporter une à une vos images dans le dossier
indiqué.
Référez-vous ensuite à la partie 6.1 pour voir comment ajouter un répertoire entier d’images
dans le gestionnaire de médias de Joomla! 3.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 106 — #130
✐ ✐
Cliquez sur le bouton Image pour ouvrir la fenêtre pop-up du gestionnaire de médias. Si
vous avez créé et uploadé le répertoire « miniatures » créé précédemment avec Picasa, utilisez-le,
sinon utilisez une image des données d’exemple. Cliquez sur le dossier « miniatures », ou bien le
répertoire « chats » du sous-répertoire « animals ». Choisissez une image à afficher sur votre site
et cliquez dessus, son nom va s’afficher dans le champ URL (figure 6.10). Afin d’aider à un bon
référencement, dont vous verrez toutes les subtilités au chapitre 9, nous vous invitons à saisir une
description et un titre à votre image (dans la partie basse de la fenêtre pop-up). Cliquez ensuite
sur le bouton bleu Insérer, situé en haut à droite de la fenêtre.
Enregistrez votre article et allez voir sur votre site si cela vous convient. L’article « débutants »
est accessible dès la page d’accueil du site. Cliquez sur son titre.
Redimensionnement de l’image
Pour redimensionner votre image directement dans votre article, cliquez une fois sur l’image.
L’éditeur de texte va afficher des petits carrés blancs sur les bords de l’image. Vous pouvez vous
en servir comme de poignées pour étirer l’image dans une direction ou dans une autre. La boîte
grise dynamique qui s’affiche au cours du redimensionnement vous indique de combien de pixels
vous augmentez ou diminuez l’image par rapport à sa largeur et hauteur d’origine (figure 6.11).
Pratique : pour déplacer une image dans le corps d’un article, il suffit de rester cliqué dessus et de
faire un glisser-déplacer là où vous le souhaitez. Dans l’article « Débutants », faites glisser votre image
devant le paragraphe commençant par « Vous aurez peut-être aussi envie de... » et enregistrez.
Il est bien entendu possible d’insérer plus d’une image dans un article ; vous devez alors
répéter les opérations d’insertion et placement autant de fois qu’il y a d’images à insérer.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 107 — #131
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 108 — #132
✐ ✐
Afficher un slideshow
Même si Joomla! permet de créer une galerie d’images, comme nous l’avons vu sur le site des
Parcs Australiens fourni avec les données d’exemple, il existe toutefois un moyen beaucoup
plus simple de faire mieux et plus rapidement. Nous allons utiliser pour cela le module
« Slideshow CK » qui génère un slideshow, aussi appelé diaporama. Vous en trouverez une
présentation sur le site www.joomla.fr : http://extensions.joomla.fr/categories/joomla-3-x-et-2-5/
photos-videos/slideshow-ck.html. Vous pouvez en voir une démonstration sur le site http://www.
joomlack.fr/extensions-joomla/slideshow-ck.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 109 — #133
✐ ✐
Ensuite, dans le gestionnaire d’extensions, dans l’onglet Archive à envoyer, cliquez sur
parcourir et sélectionnez l’archive depuis l’emplacement où vous l’avez téléchargé. Appuyez
enfin sur le bouton bleu Envoyer & Installer.
Maintenant que le module est installé, nous allons le paramétrer.
Publier le module
Le module est bien installé, mais vous ne pourrez pas le voir sur votre site tant qu’il ne sera
pas publié. Dans le gestionnaire de modules, saisissez « slide » dans le moteur de recherche
des modules et lancer la recherche. Le module Slideshow CK va s’afficher. Comme le montre la
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 110 — #134
✐ ✐
croix en rouge devant son nom, le module n’est pas publié. Cliquez sur la croix pour publier le
module puis cliquez sur le titre pour modifier les paramètres.
Dans la gestion des modules, cliquez sur le module Slideshow CK puis rendez-vous sur
l’onglet « Assignation des menus ». Par défaut, Joomla! affecte les nouveaux modules à « Aucune
page ». Dans la liste déroulante, choisissez l’option « Seulement les liens sélectionnés ». Comme
vous le voyez, toute l’arborescence est cochée. Cliquez sur « Aucun » en dessous de la liste
déroulante pour tout décocher (figure 6.15).
Réduisez les menus (en cliquant sur le signe juste avant le nom) afin de vous repérer
plus facilement dans l’arborescence. Cochez la case de l’élément « Accueil » du menu « Menu
Principal » et cliquez sur le bouton vert Enregistrer.
Ouvrez un nouvel onglet pour consulter la page d’accueil de votre site, qui devrait ressembler
à la figure 6.16.
Avec un tel élément graphique sur la page d’accueil, autant dire que le bandeau d’origine fait
pâle figure. Nous vous proposons de le dépublier afin de valoriser encore plus votre slideshow.
Retournez dans le gestionnaire de modules et utilisez les filtres de gauche pour n’afficher que les
modules de la position 3. Dépublier ensuite le module « Module Image » en cliquant simplement
sur la coche verte de la colonne Statut (figure 6.17).
Votre site ressemble maintenant à la figure 6.18. Pour mettre à jour les slides avec vos propres
images et vidéos, ouvrez le module et cliquez sur l’onglet « Gestionnaire des slides ». Pour utiliser
encore mieux ce module, nous vous recommandons d’essayer différentes apparences (onglet
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 111 — #135
✐ ✐
« Options de styles ») ou bien différents effets de Transition (onglet « Options des effets »). Vous
pouvez également spécifier si vous voulez une lecture automatique ou manuelle, une pause au
survol du curseur, etc. Amusez-vous bien et surtout, mettez-en plein à la vue à vos visiteurs.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 112 — #136
✐ ✐
Dans l’onglet Plugin, vérifiez que le champ « Élément prohibés » ne contienne pas la balise
« iframe ». Si c’est le cas, supprimez là et enregistrer. En effet, les plates-formes de diffusion de
vidéos utilisent presque toutes cette balise.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 113 — #137
✐ ✐
Pour obtenir le code d’intégration de la vidéo, cliquez sur le bouton Partager (figure 6.20),
puis sur le bouton Intégrer qui apparaîtra ensuite.
Pour obtenir le code d’intégration, positionnez le curseur de votre souris sur la vidéo, puis
cliquez sur le bouton Export (figure 6.21). Cela va faire apparaître trois options sur la vidéo.
Cliquez sur </> (le symbole de la balise embed, que l’on pourrait traduire par « lecteur
exportable »). L’interface vous annonce que le code est copié. L’étape suivante va consister à
l’insérer dans l’article.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 114 — #138
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 115 — #139
✐ ✐
Attention ! Cette extension est composée d’un plugin. Si vous n’activez pas le plugin, le lecteur
ne fonctionnera pas. Dans la gestion des plugins, chercher le plugin Content - bo:VideoJS (en
cherchant vidéo), et activez-le (cliquez sur la croix en rouge de statut).
Dans le gestionnaire d’article, éditez l’article « Habitués » et collez votre code avant le dernier
paragraphe. Vous n’avez ici pas besoin de passer par l’option Code Source. Le code à insérer est
directement compris et interprété par Joomla! grâce au plugin nouvellement installé. Enregistrez
et allez voir sur votre site le rendu, qui devrait correspondre à la figure 6.24.
Vous voulez que vos visiteurs puissent facilement partager vos contenus sur les réseaux sociaux ?
Nous vous proposons d’installer des boutons sur chacune de vos pages afin de vous permettre
de faire un lien en un clic vers vos profils Facebook, Twitter, LinkedIn et quelques autres.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 116 — #140
✐ ✐
Vous pouvez avoir un aperçu des différents réglages possibles de l’extension sur la page
http://itprism.com/free-joomla-extensions/social-marketing-seo/socialmedia-multi-share. L’ex-
tension est disponible en téléchargement sur cette même adresse. Pour notre exemple, nous
téléchargerons la partie Module de cette extension. Ensuite, pour l’installer, rendez-vous dans
la « Gestion des extensions », onglet Archive à envoyer, puis cliquez sur le bouton Parcourir.
Recherchez le fichier préalablement téléchargé, cliquez dessus puis sur le bouton « Envoyer &
Installer » (figure 6.26).
L’interface d’administration va vous confirmer par un message que l’installation est réussie.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 117 — #141
✐ ✐
Paramétrer le module
Le module est bien installé, mais il restera inerte tant qu’il ne sera pas publié. Dans le menu
« Extensions », cliquez sur Gestion des modules. Comme vous pouvez le voir sur la figure 6.27,
le module ITPShare n’est pas publié (icône rouge du statut) et n’a aucune position d’affichage
ou pages affectées.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 118 — #142
✐ ✐
Faites de même pour tous les boutons qui vous intéressent, puis dans le premier Module,
sélectionnez le statut Publié, et n’oubliez pas de sauvegarder.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 119 — #143
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 120 — #144
✐ ✐
Cliquez sur Aucun en dessous de la liste déroulante pour que le module ne soit plus affecté
à aucune page. Pour une meilleure lisibilité, cliquez sur les symboles situés devant chaque
menu sauf celui de la boutique de fruit. Dans la liste déroulante située à droite, cliquez sur
« Sélection » (figure 6.33), ce qui aura pour effet de cocher tous les éléments de la Boutique de
fruits. Enregistrez et allez voir sur le site.
Attention ! Nous avions publié ce module sur l’emplacement Fil de navigation [position-2] du
template Protostar or la Boutique de fruits fonctionne avec le template Beez3 et son propre style
(Boutique de fruits). Veillez donc à affecter le module à un emplacement compatible avec ce template
comme « Milieu en haut – position 12 ».
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 121 — #145
✐ ✐
En résumé
On ne pouvait pas vous proposer un livre sur Joomla! qui ne parle que de Joomla!, tout
simplement parce qu’aujourd’hui sur le Web, les interconnexions sont si nombreuses et si
efficientes qu’il aurait été dangereux pour vous de croire que votre site pouvait exister dans une
bulle indépendante. Nous espérons que cet éclairage sur vos contenus multimédias et sur les
liens que vous pouvez tisser avec les réseaux sociaux vous donnera des idées pour concevoir
une communication digitale efficace et percutante.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 122 — #146
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 123 — #147
✐ ✐
TROISIÈME PARTIE
Administrer
votre Joomla!
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 124 — #148
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 125 — #149
✐ ✐
7
Utilisateurs, groupes
et permissions
Objectif
Les utilisateurs d’un site en sont les principaux acteurs. Ce sont eux qui vous diront ce qui ne
fonctionne pas, ce qu’ils aimeraient y voir et ce qu’ils en attendent. Il est très important de
rester à leur écoute pour faire évoluer votre site.
À l’issue de ce chapitre, vous serez capable de créer des groupes d’utilisateurs, de gérer les
comptes de tous vos visiteurs ainsi que leurs niveaux d’accès et de permissions.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 126 — #150
✐ ✐
Vous maîtrisez bien évidemment tout le processus de création de compte et vous pouvez
à tout instant suspendre un compte ou le supprimer. Vous pouvez également automatiser une
partie du processus de création de compte en permettant à des utilisateurs de créer leur propre
compte (avec ou sans validation de votre part).
Il reste à définir une stratégie afin de sécuriser l’ensemble. Joomla! utilise pour cela trois
paramètres dans sa gestion de la sécurité : les droits, les niveaux d’accès et les groupes. Vous
serez ainsi amené à donner des droits d’accès sur certains de vos contenus. Ces droits feront
partie de niveaux d’accès (des niveaux d’accréditations) que vous affecterez ensuite à vos
utilisateurs rassemblés sous forme de groupes.
Rendez-vous dès maintenant dans le menu Utilisateurs pour gérer tous vos intervenants.
Soyez vigilant sur les droits que vous accordez. Une personne n’étant pas à l’aise avec les
outils informatiques ne devrait jamais être administrateur.
Les filtres
Comme dans chaque espace de gestion de l’administration de Joomla!, des filtres vont vous
simplifier la vie. Bien sûr, quand on est le seul utilisateur, cela peut sembler superflu, mais quand
vous aurez deux cents utilisateurs abonnés à votre newsletter, cinquante clients, deux auteurs
et huit commerciaux, vous serez ravis d’apprendre à n’afficher que certains utilisateurs plutôt
que de devoir les chercher tous. Pour ce faire, rien de plus simple, cliquez sur le bouton Outils
de Recherche. Ce dernier fera apparaître les options de filtrages : choisissez un état particulier
dans une liste sur votre gauche, par exemple le groupe Enregistré ; et l’interface filtrera alors
directement la liste des utilisateurs sur ce critère.
Les tris
Une autre manière rapide de s’y retrouver est de trier les utilisateurs grâce aux en-têtes de
colonnes de la liste (nom, identifiant, actif, etc.).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 127 — #151
✐ ✐
La recherche
Vous pouvez également saisir un nom dans la zone de recherche des utilisateurs et cliquer sur
la petite loupe de recherche. Cette fonctionnalité est très pratique si vous avez beaucoup de
comptes. Elle peut en outre vous permettre de trouver des doublons ou des homonymes.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 128 — #152
✐ ✐
Bloquer un utilisateur
Bloquer un utilisateur revient à l’empêcher de se connecter sur le site, quel que soit son niveau
d’accès. Son compte ne sera pas supprimé, mais simplement inutilisable, tel que le serait votre
téléphone après trois codes secrets erronés.
Ceci peut vous servir à bannir temporairement ou définitivement un utilisateur de votre site.
Pour bloquer un utilisateur, cliquez sur son icône de blocage dans la colonne Actif, ou bien
sélectionnez l’utilisateur en cochant la case à gauche du nom et cliquez sur le bouton Bloquer.
Si l’utilisateur visé se trouvait connecté au site, il serait alors immédiatement déconnecté.
Supprimer un utilisateur
Cette fonction ne doit pas être confondue avec la déconnexion (voir paragraphe suivant) ou le
blocage, la suppression d’un utilisateur étant une opération définitive et irréversible.
Pour supprimer un utilisateur, sélectionnez celui-ci en cochant la case à gauche du nom puis
cliquez sur le bouton Supprimer.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 129 — #153
✐ ✐
Déconnecter un utilisateur
En tant que modérateur vous pouvez être amené à canaliser certains utilisateurs sortant parfois
des règles établies sur le site. À ce titre, il peut être fort utile de couper court à leurs agissements.
Déconnecter un utilisateur met fin à sa session : il n’est alors plus authentifié sur le site, mais cela
ne l’empêche pas de se reconnecter ultérieurement. Nous vous conseillons plutôt de bloquer son
compte.
Dans un autre contexte, lors de maintenances à effectuer sur le site par exemple, il peut être
nécessaire de déconnecter ses utilisateurs. Ainsi vous-même ou un webmestre aurez peut-être à
recourir à cette fonction afin de limiter les accès au site temporairement.
Pour déconnecter un utilisateur, rendez-vous sur le panneau d’administration du site, en
sélectionnant le petit logo Joomla! visible en haut à gauche de l’écran. La page affichée vous
montrera alors les utilisateurs connectés soit dans la partie administration, soit dans la partie
site. Une croix à gauche du nom de l’utilisateur permet d’un simple clic de le déconnecter
instantanément.
Si votre message est réellement important, veillez à apporter un soin particulier au titre du
message afin que celui-ci ne soit pas considéré comme un courrier indésirable.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 130 — #154
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 131 — #155
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 132 — #156
✐ ✐
À noter : deux groupes supplémentaires sont également fournis à titre d’exemple, Client et
Fournisseur. Héritant respectivement des groupes Auteur et Enregistré, ceux-ci vous permettent
de vous faire la main dans le cadre d’un site dédié au commerce en ligne. Libre à vous de
les conserver ou de créer vos propres groupes.
Attention ! Tous les droits des différents groupes présentés ici donnent une représentation
globale de leur niveau d’accès sur le site. Nous verrons un peu plus tard que nous pouvons
affiner leurs droits et niveaux d’accès sur chaque secteur d’administration en fonction de
besoins particuliers.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 133 — #157
✐ ✐
Supprimer un groupe
Tout d’abord une mise en garde s’impose : supprimer un groupe signifie non seulement
supprimer le groupe sélectionné, mais également supprimer tous les groupes qui en héritent ou
en dépendent. Par ailleurs, tout utilisateur affilié au(x) groupe(s) visés se verrait dépourvu des
accès ainsi supprimés. Vous courrez alors le risque de vous retrouver avec des utilisateurs sans
aucun accès.
Il est donc important de prendre le temps de mesurer l’impact éventuel d’une telle
suppression, d’autant que celle-ci est irréversible.
Depuis le menu de gauche du gestionnaire des utilisateurs, sélectionnez Groupes utilisateurs,
sélectionnez le groupe à supprimer, puis cliquez sur le bouton Supprimer.
Les niveaux d’accès constituent la seconde notion de groupage dans Joomla! Il s’agit en réalité
d’assembler différents groupes précédemment créés et de définir qui aura le droit de consulter
telle ou telle partie du site, aussi bien dans sa forme que dans son contenu. Vous pourrez ainsi
empêcher l’affichage de menus, modules, ou toute autre extension, ainsi que l’affichage de leurs
contenus respectifs.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 134 — #158
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 135 — #159
✐ ✐
Paramètres dans le profil : cette option permet aux utilisateurs l’accès aux paramètres de
gestion de compte, de choix de langue, d’éditeur de texte et de site d’aide lors d’une connexion
depuis la partie publique du site.
Langue du site : ceci permet à l’utilisateur de redéfinir si besoin la langue qu’il souhaite
utiliser lors de la navigation, idéal pour les sites multilingues notamment.
Changement d’identifiant : vous autorisez ainsi les utilisateurs à changer d’identifiant de
connexion, sans avoir à recréer un nouveau compte.
Nombre de réinitialisations, durée du compteur : ceci permet un nombre maximum
de réinitialisation de mots de passe sur une durée donnée.
Données liées aux mots de passe : longueur minimum, nombre de chiffres, symboles
et majuscules sont autant d’options importantes proposées. Elles vous permettent d’imposer un
certain nombre de règles à vos utilisateurs en matière de sécurité. Cela décourage également
certains systèmes de création automatisée de comptes, tentant d’infiltrer votre site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 136 — #160
✐ ✐
Astuce : si vous souhaitez gérer votre contenu en toute indépendance et faire appel à un développeur
ponctuellement pour des opérations de maintenance par exemple, créez-lui un compte administrateur
en refusant la création, l’édition, la suppression et la publication de tout votre contenu. Vous dissociez
ainsi prudemment la sphère technique de la sphère éditoriale.
Conseil : les problèmes les plus complexes de gestion des droits peuvent être résolus avec
une feuille de papier et un crayon, n’hésitez pas à dessiner des groupes de « droits » et de
faire l’inventaire de toutes les possibilités. Posez des questions aux experts métiers : « Est-ce
que Monsieur M. pourra faire cela ? », « Y a-t-il des cas ou Madame N. devra faire ceci ? »,
« Comment ferez-vous quand Monsieur M. et Madame N. seront absents ? ». Les questions
les plus simples vous permettront de ne pas passer à côté de nombreux cas pratiques.
Quand toutes les possibilités auront été envisagées et « rentreront » dans tous vos groupes de
« droits », vous aurez fini.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 137 — #161
✐ ✐
En résumé
L’écoute de vos utilisateurs et la gestion de leurs accès sont parmi les clefs de la réussite de
votre site. Il faut avant tout être préparé et méthodique dans la hiérarchie des actions autorisées.
Il ne s’agit pas de sombrer dans la paranoïa de la sécurité à tout prix, mais plutôt de cerner
d’emblée quels moyens d’actions seront donnés à vos utilisateurs suivant leurs domaines de
compétence.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 138 — #162
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 139 — #163
✐ ✐
8
Gérer vos menus
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 140 — #164
✐ ✐
La meilleure solution dans ce cas précis serait d’utiliser des sous-menus. Par exemple, chaque
lien parent du menu serait un secteur d’activité, chaque sous-menu enfant, un élément de cette
activité (figure 8.1).
Pour aller plus loin et faciliter encore un peu plus la lisibilité, il serait même envisageable de
créer plusieurs menus. Dans ce cas de figure, chaque menu représenterait un secteur commercial,
chaque lien parent de menu un élément représentatif du secteur d’activité, et certains sous-menus
enfants des liens vers des familles de produits ou services.
Un ou plusieurs menus ?
Nous venons de le voir, l’utilisation d’un ou plusieurs menus dépend principalement de la
simplicité de navigation que vous souhaitez offrir à vos visiteurs. Les exemples par défaut mis en
place lors de l’installation de Joomla! offrent déjà une représentation utilisant plusieurs menus.
Vous trouverez ainsi des menus verticaux, tels que le Menu principal, À propos de Joomla!,
Boutique de fruits, Parcs Australiens, Menu membre, ou bien des menus horizontaux tels que le
Menu Haut.
Mais en dehors de la seule navigation, l’utilisation de menus différents relève également de
la sécurité du site. En effet, vous pouvez tout à fait décider que certaines parties du site ne seront
accessibles qu’à un nombre restreint ou privilégié de vos utilisateurs.
On pourra, dans le cadre d’un site commercial, mettre en place un accès public à un premier
menu comportant des informations sur l’entreprise, ses domaines d’activité, ses services, son
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 141 — #165
✐ ✐
actualité, et donner un accès restreint à un second menu réservé à ses commerciaux, muni
d’un annuaire client, de la possibilité de télécharger des documents contractuels, de remplir des
formulaires de saisie de prospects. Ce second menu ne s’affichant que lorsque l’utilisateur se
sera authentifié.
Depuis le panneau d’administration du site, ou bien depuis le menu Menus, cliquez sur Gestion
des menus. Deux éléments sont alors à votre disposition dans le menu de gauche pour assurer
cette gestion.
Menus
Depuis cette partie, vous aurez accès à l’ensemble des menus présents sur le site (figure 8.2).
Une barre de boutons située en haut à gauche vous donne accès aux principales fonctions :
Nouveau, Modifier, Supprimer, Reconstruire, Aide et Paramètres.
À noter : la suppression d’un menu supprime l’intégralité des éléments associés. À manier
par conséquent avec une extrême précaution. Le bouton reconstruire, permet quant à lui, de
récupérer une structure de menus qui aurait été altérée. Normalement, cette éventualité ne
devrait jamais se présenter.
Dans la partie principale de la page affichée, vous retrouverez la liste des menus actuels
avec différentes informations sur leur état : leur titre, leur type, des statistiques sur le nombre
d’éléments existants aussi bien publiés, dépubliés que mis à la corbeille, le nom du ou des
modules liés à chaque menu sous forme de liste à cliquer, et en dernier lieu, l’identifiant de
chaque menu dans la base de données.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 142 — #166
✐ ✐
Liens de menus
Dans cette seconde partie, vous aurez accès à l’ensemble des éléments de menus présents sur
le site (figure 8.3) menu par menu. La barre de boutons d’action située sur le dessus diffère de
celle vue précédemment dans la partie Menus.
Outre les boutons classiques tels que Nouveau, Modifier, Corbeille (supprimer) ou encore
Aide, certaines autres fonctionnalités nécessitent quelques éclaircissements.
Publier/Dépublier : ces boutons vous permettent d’ajouter ou de retirer un lien de menu
du contenu visible du site. Il est par ailleurs possible de changer l’état d’un lien en cliquant
directement sur la coche verte ou le rond rouge selon son état initial.
Déverrouiller : ce bouton vous permet de déverrouiller d’éventuels liens de menus restés
bloqués par erreur. Voir à l’étape 16.2 la partie dédiée au déverrouillage du contenu.
Accueil : ce bouton vous permet de déterminer si le lien de menu est défini comme l’élément
principal d’accueil du site. Un et un seul de tous les liens de menus peut recevoir cette option
pour une langue donnée.
Reconstruire : ce bouton permet de reconstruire l’arborescence d’un menu lorsque la
hiérarchie de celui-ci est brisée, lors de suppressions malencontreuses de liens par exemple.
Traitement : ce bouton très pratique permet, après avoir sélectionné des éléments de
menus, de les copier ou les déplacer vers un autre menu du site.
Le tableau d’affichage général fournit différentes informations sur les liens de menus : leur
statut de publication, leur titre bien sûr, leur définition ou non en tant qu’élément d’accueil, leur
niveau d’accès, leur affectation de langue, ainsi que leur identifiant dans la base de données.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 143 — #167
✐ ✐
Articles
Article : affiche un article en particulier, sélectionné dans la liste globale.
Articles archivés : liste l’ensemble des articles archivés du site. Inclut une possibilité de
recherche par date. Pour de plus amples détails sur l’archivage des articles rendez-vous au
chapitre 16, paragraphe 5.
Blog d’une catégorie : affiche une catégorie au format blog, avec le détail des articles la
composant.
Blog des articles en vedette : selon activation, affiche les articles munis de l’option de
mise en vedette sous format blog.
Créer un article : propose la possibilité de soumettre un article. Cette action étant soumise
à autorisation en fonction du niveau d’accès, on proposera essentiellement cette possibilité aux
utilisateurs déjà authentifiés. Nous verrons ultérieurement que nous pouvons également définir
le niveau d’accès nécessaire à l’affichage de l’élément de menu.
Liste de toutes les catégories : à partir d’une catégorie sélectionnée, fournit la liste des
sous-catégories rattachées ainsi que leurs descriptions éventuelles. Chaque lien de catégorie
conduit à l’affichage de la liste des articles contenus.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 144 — #168
✐ ✐
Liste des articles d’une catégorie : affiche les articles de la catégorie sélectionnée sous
forme de tableau ainsi que la liste des sous-catégories rattachées.
Fiches de contacts
Contact : affiche les détails d’un contact en particulier.
Contacts en vedette : pour les contacts ayant l’option activée, liste les contacts sélectionnés
comme favoris. Le détail de chaque contact comportera alors non seulement des informations
d’identification et de localisation, mais également selon les options choisies, un formulaire de
contact dédié ainsi que le texte descriptif du contact.
Liste des catégories de fiches de contacts : liste l’ensemble des catégories et sous-
catégories de contacts, avec la possibilité de sélectionner la catégorie servant de point de départ.
Liste des fiches de contacts d’une catégorie : liste l’ensemble des contacts d’une
catégorie sélectionnée.
Fils d’actualité
Fil d’actualité : affiche l’ensemble du flux d’actualités sélectionné, au sein du site, sans recourir
à l’affichage externe du site de la source.
Liste des catégories de fils d’actualité : affiche l’ensemble des catégories de flux sous
forme de liste.
Liste des fils d’actualité d’une catégorie : liste sous forme de tableau l’ensemble des
flux pour une catégorie donnée.
Gestionnaire de configuration
Afficher les options de configuration du site : affiche les paramètres généraux du site
(nom, accès par défaut, longueur de listes), ainsi que les paramètres de métadonnées et de
réécriture d’URLs.
Afficher les options du template : Si ce dernier en est pourvu, les options de templates
sont alors accessibles par ce biais (couleurs, logos, paramètres propres).
Liens divers
Alias de lien de menu : permet un renvoi vers un autre élément de menu existant du site.
L’alias effectue un rappel, ou un renvoi vers une partie du site qui n’est pas accessible directement.
Ceci favorise l’accès direct de l’utilisateur en lui épargnant une navigation supplémentaire sur le
menu du site.
Séparateur : facilite la présentation et la lisibilité d’un menu en créant une séparation entre
les éléments présents, selon son emplacement.
Titre de sous-menu : en complément du séparateur précédent, le titre de sous-menu
permet un titrage par partie de votre menu.
URL externe... on quitte votre site : permet de rediriger l’utilisateur vers un autre site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 145 — #169
✐ ✐
Recherche
Formulaire de recherche / Résultats de recherche : affiche le module de recherche simple,
basé sur la recherche spécifique des mots demandés. Moins performante que la version indexée,
ce mode de recherche est toujours disponible.
Recherche avancée
Recherche : affiche le module de recherche indexée. Ce mode permet une recherche sur
l’ensemble du contenu du site qui aura au préalable été « analysé » en vue d’optimiser
les résultats de recherche proposés. Nous verrons ce mode d’indexation plus en détail au
chapitre 11.
Tags
Liste compacte des éléments taggés : permet l’affichage synthétique des contenus faisant
l’objet d’un marquage à l’aide de tags que vous pourrez sélectionner. Vous pourrez ainsi mesurer
l’impact de tags précis sur vos contenus.
Liste de tous les tags : affiche l’ensemble des tags utilisés sur vos contenus sous forme
d’un nuage agrégé.
Éléments taggés : Dans le même esprit que la liste compacte, cet affichage vous identifie
pour des tags sélectionnés le contenu marqué, avec le début du texte de ces derniers.
Utilisateurs
Connexion : permet l’affichage du formulaire de connexion utilisateur.
Enregistrement : propose la création d’un compte sur le site.
Modification d’un profil : permet un accès direct à la modification du profil de l’utilisateur,
toujours sous condition de connexion préalable.
Profil de l’utilisateur : affiche le détail du profil de l’utilisateur connecté au site, ainsi
qu’un accès à la modification des informations. L’utilisateur doit pour cela être connecté au site.
À défaut, le formulaire de connexion sera affiché.
Rappel de l’identifiant : en cas de perte, permet la demande de renvoi du nom de
connexion à l’adresse e-mail spécifiée, si celle-ci correspond à un utilisateur inscrit.
Réinitialisation du mot de passe : en cas de perte, permet la demande de réinitialisation
du mot de passe d’un utilisateur. Un e-mail lui est alors envoyé contenant un code d’identification
temporaire à saisir sur la page en cours du site. Une fois l’identité de l’utilisateur vérifiée, celui-ci
est invité à saisir un nouveau mot de passe.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 146 — #170
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 147 — #171
✐ ✐
index.php?option=com_content&view=category&layout=blog
Style du template : un template différent peut être assigné pour la mise en forme de la
page, en lieu et place de celui par défaut.
Menus : il est possible de modifier le menu auquel le lien est affecté. Pour cela, sélectionnez
un menu différent parmi la liste proposée.
Lien parent : c’est ici que vous définissez l’arborescence. Ainsi, chaque lien se voit affecter
une position dans la hiérarchie du menu. Si vous sélectionnez Lien de menu racine, le lien créé
sera un élément « parent » du menu.
Toute autre sélection dans la liste créera un sous-menu « enfant » dépendant de l’élément
« parent » sélectionné.
Statut : vous définissez ici si l’élément sera publié ou non ou mis à la corbeille.
Page par défaut : vous déterminez ici si la page à afficher est la page d’accueil du site.
À noter qu’un, et seulement un seul élément de menu parmi tous ceux existant pour la même
langue peut recevoir cet attribut.
Accès : il s’agit de donner un niveau d’accréditation minimum nécessaire pour accéder
au contenu, voir à l’étape 7.4 pour de plus amples détails sur les niveaux d’accès. Par défaut,
l’accès est public.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 148 — #172
✐ ✐
Langue : vous pouvez définir si la langue utilisée pour le lien est différente de la langue par
défaut du site. Ceci pourra être utilisé dans le cadre d’un site multilingue en vue de paramétrer
des éléments de menus dans chaque langue disponible.
Note : le champ note permet de saisir une courte description du lien créé. Cette note ne
sera pas visible des utilisateurs.
Paramètres avancés
Un ou plusieurs onglets additionnels sont à compléter, variant selon le type de lien de menu
choisi. Nous vous proposons ici quelques cas pratiques détaillés.
Onglet Paramètres (des articles) : tout comme dans le cas d’un lien vers un seul article,
comme vu précédemment, vous permet de redéfinir pour l’ensemble des articles de la catégorie
sélectionnée certaines options de publication générales.
Onglet Intégration : dans le cas de catégories ou sous-catégories comportant des flux
d’actualités, on pourra définir, pour ces derniers, l’affichage d’une icône dans la barre d’adresse,
ainsi que l’affichage du texte : texte intégral ou texte de l’introduction uniquement.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 149 — #173
✐ ✐
http://www.joomla.fr
Conseil : modifiez également la fenêtre cible pour cet élément. Ouvrez le lien dans une
« nouvelle fenêtre avec barre de navigation ». Ceci aura pour effet d’ouvrir un nouveau
navigateur Web pour le lien externe, au lieu de remplacer l’affichage de votre site, et donc
de le quitter.
Sections communes
D’autres onglets, communs cette fois, quel que soit le type d’élément de menu en cours de
création sont également au rendez-vous.
Paramètres du type de liens : cette section ajoute des définitions supplémentaires à
l’élément de menu :
• un attribut personnalisé du titre de l’élément de menu. Celui-ci s’affiche sous forme d’une
bulle d’information lors du passage de la souris ;
• un style personnalisé de la présentation de l’élément visé, par le biais des styles CSS ;
• l’utilisation d’une image pour le titre ;
• la possibilité de faire figurer le texte et l’image choisis en tant que titre.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 150 — #174
✐ ✐
Créer un sous-menu
Créer un sous-menu revient à créer un lien de menu tel que nous l’avons vu précédemment,
à ceci près que vous définissez sa position dans le menu en sélectionnant un « Lien parent »
différent de Lien de menu racine.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 151 — #175
✐ ✐
Supprimer un lien
Depuis la liste des liens de menus, sélectionner le ou les éléments souhaités, puis cliquez sur le
bouton Corbeille. Ceci aura pour effet de les placer dans la dite corbeille en tant qu’éléments
supprimés. La mise à la corbeille est en réalité un état supplémentaire de l’élément au même
titre que « publié » ou « non publié ». De ce fait, la suppression n’est pas effective ; seul le fait de
demander à vider la corbeille ordonnera leur suppression définitive.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 152 — #176
✐ ✐
Joomla! propose un menu placé en haut de page (figure 8.9). Généralement visible sur toutes
les pages, ce menu a pour but de permettre un accès rapide à des parties essentielles de votre
site : liste de raccourcis thématiques, retour à l’écran d’accueil, actualités, liens, localisation,
formulaire de contact...
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 153 — #177
✐ ✐
Le menu Membre est un élément invisible pour de simples visiteurs. Il est en revanche visible
de vos utilisateurs, une fois connectés. Son niveau d’accès par défaut nécessite d’être parmi les
utilisateurs « Enregistrés ».
C’est, entre autres, par le biais de ce menu que vous pouvez définir ce que vos utilisateurs
auront ou non la possibilité de réaliser sur votre site.
Proposer un article
En fonction des droits assignés à cette action (voir chapitre 7 sur la gestion des utilisateurs,
groupes et permissions), un lien est mis à la disposition des utilisateurs permettant de créer et de
proposer un article en vue de sa publication. Par défaut, un utilisateur « Enregistré » ne verra pas
ce lien.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 154 — #178
✐ ✐
Description : la description vous permet de donner des précisions sur le menu, son contenu,
sa fonction.
Cliquez ensuite sur le bouton Enregistrer & Fermer. En revenant à la liste des menus, votre
nouveau menu sera présent en fin de liste, mais vous noterez, que le module associé, son
conteneur, n’a pas été créé. Il vous faut pour cela soit cliquer sur le lien Assigner un module à ce
menu, soit vous rendre ultérieurement dans la Gestion des modules, au chapitre 13.
Modifier un menu
Toujours depuis la partie Menus, sélectionnez un menu en cochant la case à côté de son titre,
puis cliquez sur le bouton Modifier. Il vous est également possible de cliquer directement sur le
lien « type de menu » situé sous le titre.
Supprimer un menu
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 155 — #179
✐ ✐
En résumé
La gestion des menus est un point à ne pas négliger lors de la réalisation de votre site. Le
contenu proposé peut être le meilleur qui soit, mais si sa présentation et son accès se révèlent
difficiles pour vos visiteurs, votre site restera un trésor perdu nécessitant un aventurier intrépide
afin de se lancer à sa recherche.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 156 — #180
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 157 — #181
✐ ✐
9
Référencer
votre Joomla!
Objectif
Vous venez de réaliser votre site, il est magnifique : une superbe charte graphique, des contenus
dynamiques et de qualité, mais lorsque vous regardez vos statistiques, vous vous apercevez
que personne ne vient le visiter. Dommage non ?
L’objectif de ce chapitre est de vous donner les clés pour référencer votre contenu, le positionner
et « faire du buzz ». Le challenge aujourd’hui n’est plus seulement de créer des
contenus pertinents, mais bien de les positionner !
Après la lecture de ce chapitre, vous serez également capable de distinguer une véritable offre
de référencement d’une fausse.
Nous vous proposons de faire le tour des règles de l’art en la matière, de voir ensuite ce que
nous propose nativement Joomla!, puis d’explorer les pistes d’amélioration.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 158 — #182
✐ ✐
Attention ! Le fait d’être présent dans un annuaire ne vous garantit pas d’être trouvé.
Exemple concret : vous êtes un artisan et vous vous inscrivez dans les pages jaunes. Si
vous êtes le quatrième dans une liste pour une même activité, la probabilité que vous soyez
contacté a déjà baissé significativement. Elle chute encore plus si l’un de vos concurrents a
choisi d’apparaître avec une taille de caractères plus importante que les autres annonces et une
bordure rouge. On dira alors que votre concurrent s’est positionné. En d’autres termes, il s’est
démarqué des autres.
Positionner son site : souvent confondu avec le référencement, qui est une étape
obligatoire et très simple de la vie marketing d’un site Web, le positionnement reflète le niveau
de visibilité sur une recherche (requête) donnée. Plus vous êtes positionné, plus vous êtes visible,
ce qui accroît logiquement le nombre de visites. Le positionnement est un système complexe qui
s’appuie sur de nombreux paramètres. Nous n’aborderons dans ce livre que ceux sur lesquels
Joomla! peut vous permettre d’agir directement.
Buzzer sur son site : littéralement « faire du bruit ». Sur le Net, cela équivaut à une
campagne de publicité. Il s’agit de faire apparaître son site sur un maximum de plates-formes
et/ou d’une manière qui retienne l’attention. Les grandes marques font du « buzz » (ou du « bruit »
si l’on francise le terme) pour attirer l’attention sur leurs nouveaux produits par exemple. Faites
de même pour votre site, préparez un communiqué de presse et contactez les blogs spécialisés,
les forums traitant de votre secteur d’activité et les sites proposant des communiqués de presse
gratuits. Un buzz digne de ce nom est évidemment relayé sur les plates-formes des réseaux
sociaux. Ouvrez un compte Twitter pour relayer vos actualités, pourquoi pas une page Facebook
si vous avez le temps de l’animer ?
Les balises Meta ou les métadonnées : les balises Meta sont des balises appartenant à
la norme HTML. Elles n’ont pas d’incidence visible sur une page Web, car elles se trouvent dans
une partie du code de la page (le « <head> » ou en-tête) qui est interprété uniquement par les
navigateurs et les moteurs de recherche. Pourtant, on peut voir quotidiennement le contenu de
l’une de ces balises (le <title> ou titre), car celui-ci s’affiche dans le bandeau supérieur d’un
navigateur. Par exemple, sur la page d’accueil du site www.joomla.fr, le titre est : « Joomla.fr -
Joomla!fr Le portail des Utilisateurs Francophone de Joomla! ». Pendant longtemps, les balises
Meta étaient prises en compte par les moteurs de recherche pour établir le positionnement d’un
site, ce qui a largement contribué à leur popularisation. Ce n’est plus le cas aujourd’hui, mais
il faut tout de même prêter attention à leur contenu, surtout à la balise <description> qui est
affichée dans les résultats des moteurs de recherche.
SEO : SEO est l’acronyme de « Search Engine Optimization », que l’on peut traduire par
« optimisation du référencement pour les moteurs de recherche ». D’après Google, les SEO
regroupent : la vérification du contenu ou de la structure de votre site, des conseils techniques sur
le développement (l’hébergement, la redirection, les pages d’erreur ou l’utilisation de JavaScript),
le développement du contenu, la gestion des campagnes de développement commercial en
ligne, la recherche de mots-clés, la formation à l’optimisation pour les moteurs de recherche,
une expertise sur des zones géographiques ou des marchés précis.
SEF : SEF est l’acronyme de « Search Engine Friendly ». Dans Joomla!, cette option permet
de transformer les adresses URL dynamiques en adresses URL beaucoup plus intelligibles pour
un humain et pour un moteur de recherche.
Par exemple, au lieu d’avoir une adresse comme :
www.mon-site.fr/index.php?option=com_content&view=article&id=26&Itemid=294
vous aurez www.mon-site.fr/site-map.html. C’est quand même beaucoup plus lisible et
parlant.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 159 — #183
✐ ✐
Le principal acteur
Le 3 mai 2012, Médiamétrie rendait publique les résultats d’une étude effectuée en avril 2012.
Les chiffres sont sans appel, Google totalise 91,8 % des requêtes des internautes français.
Sachant que près de la moitié des accès aux sites Internet se fait via un moteur de recherche,
nous ne parlerons, comme nombre de nos collègues référenceurs, que des fonctionnalités liées à
Google, même si nous vous invitons vivement à vous intéresser aux résultats des autres moteurs
et notamment Yahoo!, Bing et Exalead.
Google : plutôt que de vous présenter son moteur de recherche, que chacun d’entre vous
connaît, laissons la parole à Google : « ... le moteur de recherche de Google analyse également
le contenu des pages. Cependant, l’analyse Google ne porte pas uniquement sur le texte (qui
peut être manipulé par les éditeurs de sites au moyen de balises Meta), mais sur la totalité du
contenu des pages afin de tenir compte des polices, des subdivisions et de l’emplacement de
chaque mot. Google analyse également le contenu des pages Web voisines pour s’assurer que
les résultats renvoyés sont bien en rapport avec les recherches des internautes. »
PageRank : cela fait maintenant vingt ans que les webmasters entendent parler du
PageRank ou PR dans le jargon et pourtant, personne ne s’accorde sur son importance. La
technologie PageRank permet de mesurer objectivement le « poids » (l’importance) d’une page
Web. Ce classement est effectué grâce à la résolution d’une équation de plus de 500 millions de
variables et de plus de 2 milliards de termes.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 160 — #184
✐ ✐
Ce n’est pas parce que tout le monde écrit sur le Web que tout le monde en est capable. Il y a une
différence très nette et très réelle entre rédiger le contenu de son blog personnel et transcrire par des
mots la stratégie de communication d’une entreprise.
Comme ressource, nous vous conseillons le site belge http://blog.60canards.com qui regorge
d’informations pratiques sur les techniques rédactionnelles et les stratégies éditoriales.
En France, vous pouvez également suivre des formations, comme celles proposées par Martin
Bohn sur les techniques d’écriture sur le Web (http://www.2mots.fr). Il est notamment formateur
au Centre de Formation des Journalistes à Paris et ses cours sont de très bonne qualité.
<meta name=''description'' content=''Joomla! 3 100% pratique, votre nouveau livre de chevet" />.
Le contenu de cette balise est repris dans les résultats des moteurs de recherche, c’est même
parfois le premier contenu que les internautes verront. Nous vous invitons donc à soigner votre
présentation, qui doit résumer en une phrase qui vous êtes et ce que vous faites. Encore plus
que dans la vie sociale, sur le Web, c’est la première impression qui compte.
Mots-clés du site : pendant longtemps galvaudés par les « experts » du Web, les mots-clés
d’une page ne servent plus aujourd’hui à déterminer le positionnement de pages. Ils sont par
contre utiles pour leur indexation, ce qui est très différent et tout autant utile.
Saisissez les mots qui sont le cœur de votre métier, sans hésiter à être technique si votre
activité s’y prête. Séparez les mots par des virgules. Google, pour ne citer que lui, indique que
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 161 — #185
✐ ✐
trop de mots-clés baissent la pertinence générale de tous vos mots-clés. Imaginez que vous êtes
un moteur de recherche et que vous arrivez sur une page dans laquelle vous rencontrez les
mots-clés « jardin, ordinateur, limonade » : dans quelle catégorie allez vous ranger cette page ?
Même si vous êtes en train de raconter que vous buviez une limonade dans votre jardin tout en
travaillant sur votre ordinateur, les mots-clés doivent être le reflet d’une activité.
Robots : parlez directement à Google ! La métadonnée « Robots » permet en effet d’indiquer
aux robots des moteurs de recherche si vous souhaitez qu’ils indexent vos contenus et vos liens.
Pourquoi une différence entre vos contenus et vos liens ? Là encore, les référenceurs
ne sont pas tous d’accord, pourtant la position de Google est très claire : le plus important
pour le référencement naturel de votre site est votre contenu. Pour autant, Google vérifie
la cohérence de vos liens hypertextes. Si sur votre site de jardinage, une de vos pages qui
traite de désherbage possède un lien qui pointe vers un site spécialisé en coccinelles, Google
jugera cela cohérent. Si le même lien pointe vers un site de danse de Flamenco, Google
pénalisera le positionnement de votre page car il ne trouvera pas de lien sémantique, de lien
logique entre les deux domaines.
Droits légaux : vous pouvez indiquer ici sous quelle licence vous souhaitez diffuser votre
contenu et quels droits vous vous réservez (utilisation commerciale, diffusion des images, reprise
d’éléments de votre contenu, etc.). Si vous désirez autoriser le public à effectuer certaines
utilisations de vos contenus, le site http://creativecommons.fr propose gratuitement des contrats
flexibles de droit d’auteur pour diffuser vos créations en ligne.
Auteur du site : si vous gérez un site multi-auteurs, nous vous conseillons d’activer cette op
tion. Sachez que les récentes modifications de l’algorithme de Google confèrent un « poids »,
une autorité, aux auteurs reconnus sur un sujet. Si vous êtes un expert sur un sujet donné ou que
vous faites intervenir des experts dans votre site, leur autorité peut influencer le référencement
de vos pages. Cela offrira de plus une certaine visibilité à vos auteurs en affichant la balise :
Paramètres SEO
Peut-être plus encore que votre contenu, ces réglages vont déterminer quel degré de visibilité
vous offrez aux moteurs de recherche. En effet, le fait de proposer des adresses « intelligentes »
et de surcroît disposant de l’extension « .html » influence le positionnement de vos pages.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 162 — #186
✐ ✐
Le bloc Paramètres SEO permet de remplacer les URL de votre site qui contiennent des
références aux identifiants des articles par des chaînes de caractères plus compréhensibles. Cette
fonction est décrite ci-après.
Réécriture d’URL en clair (SEF) : par défaut, Joomla! écrit les URL d’un site en faisant
référence aux identifiants des articles et de leurs catégories, ce qui ne les rend pas intelligibles,
ni pour vous, ni pour un moteur de recherche.
Si vous étiez un moteur, dans quelle rubrique rangeriez-vous la page suivante ?
http://www.mon-site.fr/index.php?option=2&cat=58&id=327
Par contre, une URL du type...
http://www.mon-site.fr/index.php/reglages-moteurs-de-recherche.php
...est plus intelligible.
Réécriture « au vol » des URL : cette option n’est disponible que pour les serveurs Apache
(si vous avez un hébergement mutualisé, il y a de forte chance que vous soyez dans ce cas) et
les serveurs IIS 7.
Cette option permet d’avoir des URL encore plus « propres » puisque la chaîne « index.php/ »
est supprimée. En fait le « mod_rewrite » fournit par le serveur Apache met en correspondance
une URL écrite et optimisée (ce que les gens et les moteurs de recherche voient) et l’adresse
physique d’une page (le « vrai » chemin vers votre contenu).
Si vous testez Joomla! en local avec Wamp, il va falloir activer le module de réécriture d’URL.
Pour ce faire, rien de plus simple : faites un clic gauche sur l’icône de WampServeur, sélectionnez
« Apache », puis « Modules apache ». Descendez à l’aide de la flèche vers le bas dans la liste des
modules pour trouver « rewrite_module ». S’il n’est pas coché, cliquez dessus comme le montre
la figure 9.1.
On passe au niveau supérieur avec une adresse de page qui ressemble à cela :
http://www.mon-site.fr/prise-en-main/reglages-moteurs-de-recherche Comme pour l’option
précédente, nous vous conseillons de l’activer.
Attention, si vous êtes dans le cas d’un serveur Apache, il va vous falloir renommer le fichier
htacess.txt en .htaccess (le fichier n’a plus de nom, uniquement un point et son extension). Ce
fichier est situé à la racine de votre site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 163 — #187
✐ ✐
Si vous êtes hébergé sur un serveur IIS 7, vous devrez renommer le fichier « web.config.txt », présent
à la racine de votre site en « web.config ». À la différence des serveurs Apache qui ont presque
systématiquement le module « mod_rewrite » d’activé, vérifiez bien que le module « IIS URL Rewrite
Module » est installé.
Que vous soyez à distance ou en local, vous devrez utiliser votre client FTP (FileZilla dans le
cadre des tutoriels de ce livre) pour le renommer car Windows vous oblige à donner un nom à
un fichier.
Pour modifier le fichier htaccess si vous êtes en local avec Wamp, lancez Filezilla et
positionnez-vous sur le répertoire de votre site (C:\wamp\www\monsite\).
Faites un clic droit sur le fichier htacess.txt, cliquez sur « renommer » puis supprimez la fin
« .txt » et mettez un point avant htaccess, comme sur la figure 9.2. Appuyez sur entrée, c’est
modifié. Le serveur Wamp va redémarrer et vous pourrez alors profiter de la réécriture de vos
URL.
Ajouter un suffixe aux URL : Google dit qu’il préfère les pages au format .html. Qu’à
cela ne tienne, Joomla! vous offre la possibilité de rajouter le suffixe .html à toutes vos pages
d’un simple clic : http://www.mo-site.fr/prise-en-main/reglages-moteurs-de-recherche.html. Si
une de vos pages possède un lien qui pointe vers un contenu pdf ou xml, alors l’extension de la
page portera le suffixe du type de document.
Alias Unicode : pour chacune de vos pages (tous vos contenus en fait) Joomla! va créer
un alias, basé sur le titre du contenu (le titre d’un article par exemple). Cet alias est utilisé par
les moteurs de recherche pour indexer vos contenus. Cela vous permet de modifier le titre d’un
article (donc d’une page) sans que l’alias (l’URL) ne change. Cette fonctionnalité vous sera utile
si vous publiez votre site Joomla! dans une langue qui utilise des caractères non latins, comme
l’arabe, le mandarin, etc.
Si vous l’activez, vos adresses contiendront des accents comme ci-dessous :
http://localhost/monsite/test-translittération.html (voire figure 9.3).
Et le lien sera véritablement encodé comme suit :
http://localhost/monsite/test-translitt%C3%A9ration.html
Nom du site dans les titres : toujours dans un souci d’optimisation, vous pouvez
également ajouter le nom de votre site aux titres des pages.
Une page intitulée « Réglages d’optimisation pour les moteurs de recherches » serait ainsi
renommée en « Joomla! 3, 100 % pratique - Réglages d’optimisation pour les moteurs de
recherches ». Cela a le mérite de resituer le contexte de votre page, ce qui peut être intéressant
pour une indexation sur un moteur de recherche. N’oubliez pas que n’importe laquelle de vos
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 164 — #188
✐ ✐
pages peut servir de point d’entrée à votre site. Vous avez le choix entre « non », « avant » le titre
de vos contenus et « après ». Regardez sur la figure 9.3 ce que cela donne en activant le nom
du site « avant ».
Mots-clés : vous pouvez saisir ici des mots-clés ou phrases, séparés par des virgules. Si
vous n’avez aucune idée de ce qu’il faut saisir, utilisez le nouveau générateur de mots-clés de
Google, disponible à l’adresse : https://adwords.google.com (vous devez vous créer un compte).
Robots : si vous n’avez pas lu la partie précédente « paramètres des métadonnées » pour
la configuration de votre site, faites-le. Sachez que vous pouvez modifier le comportement des
robots indexeurs page par page. Vous pouvez ainsi jouer sur l’indexation d’une catégorie par
rapport à une autre, voire d’une page à une autre.
Pour rappel, l’attribut « no follow » permet à un webmestre de donner l’instruction suivante
aux moteurs de recherche : « ne suivez pas les liens sur cette page » ou « ne suivez pas ce lien
spécifique ». Plus d’informations sur le site de Google :
http://support.google.com/webmasters/bin/answer.py?hl=fr&answer=96569
Auteur : vous pouvez renseigner le nom de l’auteur du contenu. Il apparaîtra dans la balise
méta « author ». Cela signifie que les moteurs de recherche sauront quel auteur a rédigé l’article
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 165 — #189
✐ ✐
ou la catégorie. Depuis peu, « l’autorité » d’un auteur sur un sujet peu avoir une influence sur le
positionnement d’une page.
Droits légaux : saisissez ici les droits correspondant à l’article ou à la catégorie (licence
particulière, conditions d’usage, etc.). Ces données seront publiées dans la balise méta « rights ».
Comme les autres paramètres ci-dessus, cela peut vous permettre d’avoir une politique globale
et des cas particuliers (une catégorie, une page) avec des droits différents (une galerie d’images
en licence Creative Commons par exemple).
Référence externe : vous pouvez préciser ici une référence utilisée dans un système de
données externes, comme votre CRM ou votre catalogue produit.
http://www.mon-site.fr//index.php?option=com_content&view=article&id=19&Itemid=27.
Pour renommer votre fichier en .htaccess, même en local, utilisez votre logiciel FTP, car Windows
interdit les fichiers sans nom, ce qui est le cas d’un fichier .htaccess.
La solution est alors de chercher dans les forums du portail francophone de Joomla! ou de
modifier vous-même la configuration du serveur Web (à supposer que vous ayez les droits pour
le faire).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 166 — #190
✐ ✐
Attention ! Vous ne pouvez mettre en place Google Analytics que si votre site est publié sur
le Web ! C’est impossible de le faire en local.
Attention ! Vous êtes maintenant dans le code source du fichier « index.php » de votre
template. Une mauvaise manipulation peut le rendre inopérant, veillez à bien suivre les
instructions.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 167 — #191
✐ ✐
Collez le code juste au-dessus de la balise </head> (figure 9.7) puis cliquez sur Enregistrer
et Fermer. C’est fini, votre site est configuré avec le code de suivi de Google Analytics. Celui-ci
va maintenant récolter les données de fréquentation de votre site. Pour sortir de l’édition des
templates, cliquez de nouveau sur Fermer. Dans Google Analytics, n’oubliez pas de cliquer sur
Enregistrer et Terminer, en bas de page.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 168 — #192
✐ ✐
Google Analytics présente des données à J +1, c’est-à-dire que vous ne pourrez rien voir avant le
lendemain de l’installation.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 169 — #193
✐ ✐
Pages vues : une « page vue » correspond à la consultation d’une page sur votre site qui
contient un code de suivi Analytics. Si un visiteur retourne sur cette page après l’avoir consultée
une première fois, Google Analytics comptabilise une consultation de page supplémentaire. Si
un utilisateur accède à une autre page et retourne ensuite sur la page d’origine, une seconde
consultation de page est enregistrée.
Consultations de pages uniques : Une consultation de page unique (dans le rapport
Pages les plus consultées, par exemple) regroupe les consultations de pages générées par un
même utilisateur au cours d’une même session. Elle représente le nombre de sessions au cours
desquelles la page en question a été affichée à une ou plusieurs reprises.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 170 — #194
✐ ✐
En résumé
Autant un bon référencement est simple à réaliser (ce n’est que de l’indexation), autant un bon
positionnement s’avère plus complexe. Méfiez-vous des offres alléchantes : aucun professionnel
sérieux en référencement ne peut vous parler de position dans un moteur de recherche avant
d’avoir fait un audit technique de votre site. En général, celui-ci est complété par une prise
de connaissance de la stratégie commerciale et du plan de communication de l’entreprise, à
défaut des objectifs que vous visez.
Personne ne peut garantir la première position dans les résultats de recherche Google, c’est
Google qui le dit !
http://support.google.com/webmasters/bin/answer.py?hl=fr&answer=35291.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 171 — #195
✐ ✐
10
Gérer les extensions
Objectif
La quantité d’extensions disponibles, près de 9 000 toutes versions confondues, a toujours été
l’une des principales forces de Joomla!. Toutes permettent la création de sites très différents les
uns des autres, tant d’un point de vue fonctionnel que graphique.
L’objectif de ce chapitre est de voir la facilité avec laquelle une nouvelle fonctionnalité, un
nouveau look, une nouvelle langue peut être mise en place.
Joomla! est un gestionnaire de contenu, certes, mais pourquoi ce logiciel suscite-t-il un tel attrait ?
Principalement grâce à sa modularité. Vous connaissez sans doute les Lego. Le principe de ce
jeu de construction est d’assembler des éléments en vue de réaliser un chef-d’œuvre. Il en est
de même ici. Joomla! est un assemblage d’extensions, c’est-à-dire des briques que vous pouvez
changer à loisir, en fonction de vos besoins.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 172 — #196
✐ ✐
Les composants sont les éléments moteurs de Joomla!. Ainsi, la gestion et l’affichage des
articles sont basés sur un composant appelé com_content, de même que la gestion des contacts,
com_contact, ou encore la gestion des liens Web, com_weblinks.
Mais au-delà des composants de base, l’ajout de composants tiers permet d’ajouter de
nouvelles fonctions à votre site, voire de modifier totalement son utilisation.
Les Modules : nous l’avions rapidement évoqué lors de la création des menus : les modules
sont des briques de présentation, des « conteneurs de contenu ». Tout élément devant être affiché
sur votre site devra au préalable avoir été placé dans un module et publié. Ainsi, vos menus,
bannières publicitaires, galeries d’images, intégrations de réseaux sociaux et fils d’actualités
devront trouver une place judicieuse.
Les Plugins : les plugins sont, par définition, des éléments « greffés ». Il s’agit de petits
programmes dont la fonction est d’activer un comportement particulier. Leur action étant
généralement très ciblée, il n’y a pas ou peu de paramètres à régler.
En guise d’exemple : imaginez-vous en train de rédiger le texte d’un article. Vous effectuez
machinalement des opérations de mise en forme, en mettant un mot en gras, ou en italique, en
allant à la ligne. En réalité, à chaque caractère tapé, l’éditeur de texte par défaut de Joomla!
TinyMCE se charge de traduire le texte en format HTML. C’est ce format qui sera ensuite
interprété par le navigateur de vos visiteurs. Cet éditeur de texte complet est en réalité un plugin
qui interagit avec le composant de gestion du contenu et en simplifie son utilisation.
Les Templates : dans la vie de tous les jours, lorsque vous changez de vêtements, votre
aspect extérieur change ; mais à l’intérieur, vous restez la même personne. C’est exactement ce
que font les templates pour Joomla!. Les templates vous permettent de changer facilement la
forme de votre site, sans changer votre contenu. Ils vont ainsi gérer pour vous l’intégralité des
aspects graphiques du site, en prenant en charge aussi bien les couleurs, la présentation, que
les emplacements de vos menus, articles, etc.
Les Langues : Joomla! permet de créer des sites multilingues. On pourra ainsi, en cours
d’utilisation, changer la langue d’un site, d’un simple clic. Cet argument sera de poids si vous
souhaitez vous ouvrir à un public international et faciliter des échanges, qu’ils soient commerciaux
ou non.
Avant de mettre à jour ou d’ajouter une extension, faites par précaution une sauvegarde des
données du site et de la base.
Après cette mise à jour, refaites une sauvegarde de la base de données, car la précédente
sauvegarde ne contient pas les paramètres modifiés par la mise à jour, ni les éventuelles tables
ajoutées par l’extension. Conservez néanmoins la première sauvegarde effectuée : en effet,
si un problème grave survenait plus tard lors de l’utilisation de la nouvelle extension, vous
pourriez alors revenir en arrière facilement. Rendez-vous dans le menu Extensions / Gestion des
extensions.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 173 — #197
✐ ✐
La seconde manière de procéder consiste à utiliser les sites dédiés aux extensions Joomla!.
Ces extensions sont mises à disposition sous forme de fichiers archives, généralement au
format Zip, qui contiennent tous les fichiers nécessaires.
Vous trouverez un nombre toujours grandissant d’extensions sur Internet, gratuites pour
certaines, payantes pour d’autres. Pour vous faire une idée, ou pour faire votre marché,
vous pouvez vous rendre aux adresses suivantes : http://extensions.joomla.fr ou bien
http://extensions.joomla.org pour un catalogue plus complet, mais dans sa version anglophone
(figure 10.2).
Laissez-vous ensuite guider et téléchargez les extensions dont vous avez besoin.
À noter : une signalétique de compatibilité est apposée à côté du titre de chaque extension
des catalogues. Prenez soin de vérifier que l’extension que vous vous apprêtez à charger
comporte bien la mention pour Joomla! 3.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 174 — #198
✐ ✐
Il ne vous reste alors qu’à cliquer sur le bouton Envoyer & installer ou Installer, selon la
méthode d’installation choisie.
Après le temps nécessaire au traitement de l’installation, un message vous indiquera alors
si celle-ci s’est bien déroulée (figure 10.3). Parfois, des indications supplémentaires mises
à disposition par l’auteur de l’extension sont affichées en vue de son utilisation ou de son
paramétrage.
Si d’aventure l’installation échouait, des indications vous sont données sur le problème
rencontré.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 175 — #199
✐ ✐
Cette décision doit par conséquent être mûrement réfléchie, sous peine de voir une partie des
données du site perdues.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 176 — #200
✐ ✐
L’ensemble des extensions est proposé par défaut. Des filtres sont alors à disposition afin
d’affiner l’affichage (figure 10.4). On pourra notamment filtrer par type d’extension, ce qui
facilitera la recherche. Il suffit ensuite de sélectionner l’extension en cochant la case à gauche
de son nom, puis de cliquer sur le bouton Activer/Désactiver ou bien Désinstaller, selon l’action
souhaitée.
De la même manière que pour les autres écrans principaux, un bouton Paramètres est disponible
afin d’effectuer certains réglages. Celui de la Gestion des extensions se limite au message de fin
d’installation, au cache de mise à jour et aux droits de gestion.
Attention ! Il n’en reste pas moins que vous êtes ici en présence d’un élément essentiel pour
la sécurité de votre site. En effet, il serait très hasardeux de laisser libre accès à cette partie à
des personnes novices ou mal avisées. Souvenez-vous que la suppression d’une extension,
d’un composant en particulier, entraîne la perte irrémédiable des informations qui la/le
constituent. Imaginons le cas d’un site communautaire : la suppression même du composant
dédié à cette partie équivaudrait à la destruction pure et simple de la communauté !
En résumé
Installer une extension est un geste simple et rapide, d’autant que l’offre proposée est
pléthorique. Vous trouverez certainement votre bonheur, quelle que soit la fonctionnalité à
rajouter, mais prenez soin de sauvegarder régulièrement votre site pour éviter toute surprise
désagréable en cas de bug ou d’incompatibilité.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 177 — #201
✐ ✐
11
Gérer les composants
Objectif
Un composant vous permet d’intégrer de nouvelles fonctions, de donner un sens différent
à l’utilisation de votre site (gestion de newsletter, gestion d’événements, gestion de petites
annonces, galeries d’images, services de téléchargement, boutique e-commerce, etc.).
Par défaut Joomla! vous propose déjà plusieurs composants. Voyons tout d’abord ceux-ci d’un
peu plus près, nous nous pencherons ensuite sur un cas pratique de mise en œuvre.
Le composant Bannières permet d’inclure de l’affichage publicitaire sur votre site (figure 11.1).
Sous forme d’images ou de texte, chaque affichage d’une bannière conduit à un lien vers un
de vos annonceurs, dès lors qu’un visiteur clique dessus. On pourra ainsi gérer, non seulement
la fréquence et la manière d’afficher des bannières, mais également suivre le nombre de clics
effectués.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 178 — #202
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 179 — #203
✐ ✐
la partie basse de l’écran, vous aurez la possibilité de définir une description détaillée du client
en guise d’information complémentaire.
Un second onglet vous permet d’ajouter des informations de métadonnées pour ce même
client.
Le composant Fiches de contacts permet de créer un annuaire de contacts. Classés par catégories,
ils pourront être utilisés aussi bien de manière publique que de manière plus restrictive.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 180 — #204
✐ ✐
Les paramètres en revanche sont un peu plus étoffés. En cliquant sur le bouton Paramètres
dans la barre de boutons d’action, vous pouvez ainsi accéder à une multitude de réglages
par onglets concernant l’affichage des coordonnées de vos contacts, les icônes à utiliser, les
options d’affichage des listes sous forme de tableaux ainsi que les paramètres des formulaires de
contacts, dont entre autre l’utilisation du captcha ou encore la gestion de version des contacts.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 181 — #205
✐ ✐
Le composant Fils d’actualité permet d’intégrer l’affichage de flux RSS en provenance d’autres
sites.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 182 — #206
✐ ✐
Le composant Liens Web, disponible depuis le menu Composants/Liens Web, vous permet de
définir des listes de liens vers d’autres sites Web. Vous pouvez ainsi proposer des annuaires de
liens utiles, classés par catégories.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 183 — #207
✐ ✐
Le composant de messagerie privée se comporte comme une boîte e-mail classique. Une fois
connecté à l’administration du site, vous pouvez accéder à vos messages, soit en passant par le
menu Composants / Messagerie privée, soit en cliquant sur l’indication de messages en bas à
gauche de la page, symbolisé par une minuscule petite enveloppe. Vous serez alors dirigé vers
la liste des messages reçus.
Deux boutons situés dans la barre d’action vous permettent de préciser les options et
permissions à utiliser.
Mes paramètres : ce bouton vous permet d’une part de définir si vous souhaitez verrouiller
– c’est-à-dire désactiver – l’utilisation de messages internes vous concernant ; d’autre part
de demander l’envoi d’un e-mail, sur votre adresse personnelle, hors du site, lorsque vous
recevez un message interne. Enfin, vous pouvez définir l’option de suppression automatique des
messages.
Paramètres : ce bouton vous donne accès au réglage des droits d’accès et de configuration
pour la messagerie.
Le composant de mise à jour Joomla! vous tient au courant des mises à jour disponibles. Le
maintien à jour de votre site est très important, ne serait-ce que d’un point de vue sécuritaire.
Rendez-vous au chapitre 16, Maintenance au quotidien, pour de plus amples informations à ce
sujet.
11.7 RECHERCHE
Le composant Recherche est le moteur de recherche interne par défaut de votre site. C’est lui qui
permet à vos utilisateurs d’effectuer une recherche rapide sur l’ensemble du contenu de votre
site.
Il sera par ailleurs possible, par le biais du bouton Paramètres, situé dans la barre d’action,
d’activer la collecte de statistiques sur les éléments recherchés.
Une fois la collecte des informations activée, toute recherche effectuée sur le site fera l’objet
d’un recensement sous forme de listes présentant les mots ou phrases recherchés ainsi que le
nombre de recherches effectuées. Une dernière colonne, présentant le nombre de résultats de
recherche est par défaut non renseignée. Pour afficher ces résultats, il suffit de cliquer sur le
bouton Afficher les résultats de recherche situé au-dessus des résultats.
Conseil : comment utiliser ces statistiques ? Lorsque vos visiteurs font une recherche sur le
site, c’est bien souvent parce qu’ils n’ont pas trouvé facilement une information, notamment
par l’intermédiaire des menus du site. Ces statistiques vous permettent alors de mener une
réflexion sur l’organisation de vos contenus et de vos menus, et ainsi d’améliorer l’ergonomie
et de faciliter la navigation. Une fois la réflexion menée, un clic sur le bouton Réinitialiser
effacera les résultats enregistrés afin de démarrer une nouvelle étude.
Ce mode de recherche est dit de plein texte. Cela signifie que le terme ou la phrase demandés
seront recherchés au sein de l’ensemble de la base de données. Ce mode de recherche est
moins performant que celui dit indexé que nous allons voir à présent.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 184 — #208
✐ ✐
Vous pourrez ainsi consulter le contenu indexé soit directement par termes retenus, soit par
branches de contenu, au moyen du menu de gauche, en cliquant sur Plans de contenus.
Le dernier élément du menu de gauche, Filtres de recherche, peut se révéler intéressant pour
guider vos utilisateurs. En effet, les filtres de recherche vous permettent de donner un périmètre
précis à la recherche proposée à vos visiteurs. En créant un nouveau filtre, vous définirez parmi
l’indexation à disposition, quelles sont les branches à inclure (ou non) dans les résultats. Vous
pouvez ainsi restreindre le champ d’application de la recherche. Il vous suffit ensuite d’ajouter
un élément de menu de type Recherche avancée et de préciser le filtre de recherche ainsi créé.
Un petit mot quant aux paramètres, accessibles par le bouton du même nom depuis la
barre d’action. Vous aurez la possibilité d’activer les statistiques tout comme pour la recherche
classique, ou pour l’utilisation des suggestions de recherche.
Les options liées précisément à l’indexation vous permettront quant à elles de donner un
« poids », une pondération, à l’indexation de vos contenus. Vous pourrez par exemple décider
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 185 — #209
✐ ✐
qui du titre, des métadonnées ou de l’URL a le plus d’influence sur les résultats de la recherche
présentés.
11.9 REDIRECTION
11.10 TAGS
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 186 — #210
✐ ✐
L’utilisation de tags au sein de vos contenus donnera ainsi à vos visiteurs des possibilités de
recherche non pas par classification, mais par affinités.
Rendez-vous dans le menu Extensions / Gestion des extensions. Nous utiliserons le mode
d’installation en ligne à partir du premier onglet Installer à partir du Web. Depuis cet emplace-
ment, recherchez Akeeba backup au moyen de la boîte de recherche mise à disposition. Une
fois trouvé, cliquez sur la fiche de l’extension pour accéder aux détails de celle-ci (figure 11.4).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 187 — #211
✐ ✐
Un bouton vert, Install, vous permettra de procéder à sa mise en place, après appui sur un
dernier bouton Installer à l’étape suivante, en guise de confirmation.
Pour plus de confort après installation, nous vous recommandons de vous rendre sur le site
de l’éditeur pour récupérer la dernière version de traduction française du composant, à cette
adresse :
http://cdn.akeebabackup.com/language/akeebabackup/index.html
Une fois récupérée, vous pourrez l’installer, tout comme le composant, depuis Extensions /
Gestion des extensions, mais à partir du second onglet Archive à envoyer.
Prise en main
L’installation cette fois terminée, nous pouvons nous rendre dans le composant par le biais
du lien de menu Composants / Akeeba Backup. Si l’installation de la langue a été effectuée,
l’interface sera en français, ou à défaut, en anglais (figure 11.5).
Vous devez tout d’abord lancer la configuration automatique qui effectuera tous les réglages
nécessaires en fonction de votre site. Pour se faire, il vous suffit de cliquer sur le bouton du
même nom, situé en premier sur le panneau de contrôle. Une série de contrôles automatiques
(figure 11.6) vont alors être effectués.
À la fin des contrôles, il vous sera proposé de lancer de suite une sauvegarde au moyen
du bouton bleu Sauvegarder (figure 11.7). Une nouvelle étape s’affichera à vous, permettant
de spécifier un profil et une description courte et un commentaire de la sauvegarde à effectuer.
Cliquer sur le nouveau bouton Sauvegarder pour démarrer.
La sauvegarde va alors commencer et peut prendre plusieurs minutes. Prenez soin de laisser
terminer les opérations en cours (figure 11.8). Ne refermez pas votre navigateur et ne quittez
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 188 — #212
✐ ✐
pas la page en cours, sous peine de ne pas terminer la sauvegarde. Vos données n’encourront
aucun risque, mais la sauvegarde ne sera pas effectuée.
La sauvegarde une fois terminée, il vous sera possible, soit de consulter le rapport de
sauvegarde, soit de vous rendre dans la gestion des sauvegardes que vous pouvez également
retrouver depuis le panneau de contrôle (figure 11.9).
La sauvegarde de vos données est essentielle. Prenez le temps de réaliser celles-ci à intervalles
réguliers surtout si vous n’êtes pas seul aux commandes du contenu de votre site. Ceci vous
assurera tranquillité et pérennité.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 189 — #213
✐ ✐
En résumé
Vous l’aurez constaté, Joomla! est un moteur de site web extrêmement bien conçu auquel il est
possible d’ajouter quantité de composants, pouvant vous aider dans votre gestion au quotidien,
faciliter la vie de vos utilisateurs et également modifier le sens premier du site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 190 — #214
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 191 — #215
✐ ✐
QUATRIÈME PARTIE
Booster
votre Joomla!
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 192 — #216
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 193 — #217
✐ ✐
12
Gérer les templates
Objectif
Littéralement, « template » prononcé templète, signifie « modèle » ou bien encore « gabarit ».
Dans le cas d’une charte graphique le mot template, bien qu’étant un anglicisme persistant, est
bien souvent conservé et désigne l’habillage, le « look » du site. Voyons maintenant comment
nous pouvons, grâce à eux, donner à notre site du caractère, une personnalité, bien à lui.
Le template va définir le placement des modules et du contenu à l’écran, les images à utiliser,
ainsi que le jeu de couleurs et de styles à appliquer aux fonds, aux polices de caractères et aux
divers éléments de structure et de présentation.
Deux types de templates existent, celui du site, relatif à sa présentation, comme nous venons
de l’évoquer, mais également le template d’administration, qui, lui, permet l’affichage des
modules de gestion du site.
Vous trouverez bien évidemment des templates fournis par défaut dans Joomla!, mais
vous pourrez également en trouver de nombreux autres, gratuits ou payants, sur Internet. Le
template donne son attrait et sa personnalité à votre site, on attachera ainsi une importance
toute particulière à le choisir ou à le personnaliser.
Rappel pratique : si vous changez de template, les contenus restent les mêmes : c’est
seulement l’« emballage » qui change. Imaginez une voiture avec un moteur (le noyau
Joomla!), des options (les extensions que vous avez installées) et une carrosserie (votre
template). À chaque fois que vous installez un nouveau template, vous l’avez à disposition
dans votre garage virtuel. À chaque fois que vous le définissez par défaut, vous changez de
carrosserie ou de couleur, en appuyant simplement sur un bouton.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 194 — #218
✐ ✐
Ergonomie visuelle
Bien que ce ne soit pas l’objet de ce livre, nous vous livrons ici quelques règles et pistes de
réflexions si vous décidez de réaliser votre template vous-même.
Pourquoi ?
Parce que certains éléments sont suffisamment communs et donc attendus à certaines positions.
On appelle cela une convention ou un standard. Par exemple, vous trouverez toujours un logo
en haut à gauche, un moteur de recherche dans la partie haute de la page, et en bas tout ce
qui concerne les mentions légales, le plan du site et le copyright.
Ne confondez surtout pas respect des conventions et charte graphique banale. Vous pouvez
tout à fait avoir un design innovant et créatif en incluant simplement les conventions aux endroits
attendus par vos visiteurs.
Eyetracking
L’eyetracking (que l’on peut traduire par oculométrie) est une technique très sophistiquée utilisée
par des bureaux d’études du Web qui consiste à suivre et à enregistrer les mouvements oculaires
d’internautes lorsqu’ils naviguent sur certains sites.
Un écran spécifique, l’eye tracker, équipé d’un capteur invisible (lumière infrarouge
inoffensive pour l’œil) enregistre les déplacements de l’œil de l’utilisateur testeur. En analysant
le temps passé par les yeux sur un élément donné, on peut déterminer quels sont les points de
focalisation de l’utilisateur sur un site. Soigner l’aspect visuel du site prend dans ce cas toute son
importance.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 195 — #219
✐ ✐
Comment ?
Lorsque vous concevez votre charte graphique, commencez par prendre une feuille, un crayon et
positionnez sur le papier vos éléments principaux. N’oubliez pas de faire deux croquis séparés,
un pour la page d’accueil qui à sa propre ergonomie, un autre pour la navigation au sein du
site. Posez votre bandeau supérieur (header), votre menu, votre logo, un espace où afficher le fil
d’Ariane (breadcrumbs), votre pied de page (footer) et l’emplacement de votre contenu.
Tracez ensuite des traits à chaque tiers haut et bas, gauche et droit de votre charte graphique
et regardez si les éléments que vous voulez valoriser se distinguent selon la règle énoncée
ci-dessus.
Vocabulaire
Comme pour l’emplacement d’éléments graphiques, il existe un vocabulaire attendu. On parle
de page d’accueil et donc d’un bouton ou lien « accueil », de moteur de recherche, de « panier »,
etc. Ce qui ne vous empêche pas bien entendu d’utiliser le vocabulaire propre à vos métiers, à
votre secteur.
Iconographie
Depuis les débuts de l’e-commerce, vous êtes habitué à voir un petit caddy de supermarché
représenter votre panier d’achat, utilisez-le vous aussi, c’est une convention. De même, de
nombreux programmes proposent toujours un pictogramme aux allures de disquettes pour la
fonction « enregistrer », bien que les ordinateurs ne possèdent plus depuis longtemps de lecteurs
de sauvegarde. Le principe de l’iconographie est de véhiculer un symbole facilement identifiable,
comme une maison pour la page d’accueil.
Un design adaptatif
Aujourd’hui, Joomla! est devenu mobile, on parle de « responsive design » autrement dit de
design adaptatif. Vous aurez très certainement eu la désagréable expérience de naviguer sur
des sites qui ne se redimensionnent pas lors que vous naviguez avec votre smartphone ou votre
tablette, vous obligeant à agrandir certaines parties de l’écran pour que le contenu devienne
enfin lisible.
Ceci est dû à un manque d’adaptation du site web au mode de navigation utilisé par le
visiteur. En cela, Joomla! ne vous occasionnera pas de problème, le contenu ainsi que la mise
en page s’adaptent automatiquement. On parle alors de design adaptatif (figure 12.2).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 196 — #220
✐ ✐
Rendez-vous dès à présent dans le menu Extensions / Gestion des templates. Le premier élément
du menu gauche se nomme Styles (figure 12.3).
C’est ici que vous pouvez modifier l’apparence du site, en choisissant quel template afficher.
Qui plus est, certains templates sont proposés plusieurs fois lorsque des styles différents sont
disponibles pour un même template.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 197 — #221
✐ ✐
Des options de filtrage sont à votre disposition, avec notamment la possibilité de filtrer les
templates dédiés au site ou à l’administration.
Assigner un template
Une autre manière consiste à définir une assignation ciblée. En effet, on souhaitera parfois
afficher un style de template différent selon l’endroit du site où se trouve le visiteur, changer une
couleur de fond, modifier un style d’écriture ou de présentation des modules. On « assignera »
alors aux pages souhaitées, un template différent de celui par défaut.
Pour cela, cliquez sur le titre du template à assigner, ce qui aura pour effet d’afficher le détail
par onglets des options disponibles pour ce template (figure 12.4).
Trois onglets seront alors à votre disposition. En mettant de côté l’onglet détails qui ne
regroupe que l’affectation par défaut, l’onglet Paramètres avancés vous permettra de faire des
réglages fins, sur les largeurs de colonnes par exemple, logos et styles du template. À noter que
ces possibilités varieront d’un template à l’autre en fonction de la flexibilité que l’auteur aura
souhaité mettre à disposition.
Le troisième onglet, Affecter à un menu, vous amènera à sélectionner quelles parties du site
utiliseront – elles, et elles seules – le template en question (figure 12.5). Il ne vous restera plus
qu’à Enregistrer & Fermer vos modifications.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 198 — #222
✐ ✐
De retour à l’écran précédent, vous constaterez que le template sélectionné est maintenant
pourvu d’une coche verte dans la colonne « Assigné ».
Détails et aperçu
Depuis le gestionnaire de templates, le second élément de menu situé sur la gauche, lui-
même appelé Templates, vous donne accès à certaines informations sur les templates installés
(figure 12.6).
Vous avez ainsi sous les yeux la liste des templates disponibles, avec la possibilité de les trier
par nom et par emplacement (Site ou Administration).
Vous disposez d’information sur leurs versions ainsi que leurs auteurs respectifs. Une vignette
de présentation sera également à disposition afin d’identifier plus facilement le visuel de chaque
template. Pour certains, il est possible, par un simple clic sur la vignette, d’obtenir une vue
agrandie de celle-ci.
Il sera par ailleurs possible, une fois l’option activée (voir Prévisualisation et sécurité un
peu plus loin), de prévisualiser les placements de modules dans le template sans avoir besoin
d’activer ce dernier sur le site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 199 — #223
✐ ✐
L’ensemble des fichiers composant le template vous sont accessibles grâce à une vue sous
forme d’arborescence sur le côté gauche de l’écran. Nous ne saurions vous conseiller de
n’éditer un fichier que si vous savez ce que vous faites, sans quoi vous risquez de rendre votre
template, et donc votre site, inopérant.
Il suffit de cliquer sur l’un des fichiers en liens pour pouvoir accéder aux écrans de
modification (figure 12.7).
Prévisualisation et sécurité
Comme dans les autres parties de l’administration, un bouton Paramètres est à disposition dans
la barre de boutons d’action du Gestionnaire de templates.
Ce bouton donne accès à deux onglets, dont celui des droits, déjà bien connu. Le premier
onglet permet quant à lui d’obtenir la fonction de prévisualisation des positionnements de
templates.
Cette fonction, une fois activée et enregistrée (bouton Enregistrer & Fermer), permet de
cliquer sur le lien de « Prévisualisation » soit sous chacun des noms de templates (figure 12.8)
depuis l’onglet Templates, soit depuis l’onglet Styles, grâce à l’icône d’un œil situé à gauche de
chaque titre.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 200 — #224
✐ ✐
Très pratique, elle permet d’obtenir un affichage du template sélectionné, avec des
informations sur les positions de modules disponibles (figure 12.9).
Astuce : cet affichage s’avère très utile lors de modifications de templates, mais également lors de
l’ajout de nouveaux modules au site, afin de se faire une idée précise de leur futur emplacement.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 201 — #225
✐ ✐
Conseil de pro : commencez toujours avec un modèle gratuit pour vous familiariser avec Joomla!
et les possibilités des templates. Vous allez rapidement découvrir les choix et les contraintes qui
s’offrent à vous (mise en page, thèmes de couleur, nombre de positions de modules). Vous pourrez
alors conserver votre modèle ou en chercher un autre qui répond mieux à vos besoins.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 202 — #226
✐ ✐
Installation du template
Depuis le site http://www.template-joomspirit.com, commencez par récupérer puis décompresser
l’archive joomspirit76_unzip_first.zip. Celle-ci contient les éléments nécessaires à l’installation à
la fois pour PC et pour Mac, ainsi que le manuel détaillé d’installation.
Depuis le menu Extensions / Gestion des extensions, effectuer l’installation en
allant rechercher le fichier joomspirit_76.zip sur votre disque dur (chemin local +
/joomspirit76_unzip_first/Joomla 3.X), puis cliquez sur le bouton Envoyer & installer
(figure 12.10).
Après installation, un commentaire vous invitera à consulter le manuel de configuration fourni
avec l’archive téléchargée, une configuration que nous allons effectuer ensemble à présent.
Paramètres du template
Tout d’abord, nous allons activer le template et le définir par défaut. Pour cela, rendez-vous dans
le menu Extensions / Gestion des templates.
Un nouveau template nommé joomspirit_76 - Par défaut est maintenant à votre disposition.
Cliquez sur le petit bouton muni d’une étoile à droite du titre pour l’activer par défaut sur votre
site.
En cliquant sur le titre du template vous accéderez aux options, tel que nous l’avons vu
précédemment. Vous pourrez alors aisément paramétrer la largeur d’affichage du site, des
colonnes, ou encore les couleurs par défaut, comme celle de fond notamment. Nous choisirons
ici le fond blanc dans l’onglet Détails (General background theme : White).
Pour les besoins de la configuration du template, nous allons à présent faire une incursion
rapide dans l’univers du chapitre suivant, à savoir, celui des modules.
Le menu haut
Rendez-vous dans le menu Extensions / Gestion des modules. Sur la partie gauche de l’écran,
choisissez de filtrer sur le type Menu, repérez ensuite le module nommé Menu Haut. Cliquez sur
son titre pour le modifier.
Depuis le premier onglet Module, une des options concerne la position du module à l’écran.
Dans la liste déroulante proposée, sélectionnez la position Menu dans la section dédiée au
template JoomSpirit_76. Une fois la position définie, choisissez juste au-dessus de Masquer le
titre du menu (figure 12.11).
Dans le même onglet, activez l’option Afficher tous les liens en cliquant sur le bouton Oui
qui passera alors au vert.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 203 — #227
✐ ✐
Dans le quatrième onglet Paramètres avancés, modifiez la valeur de Suffixe de classe CSS
pour « dropdown » signifiant : liste de choix (figure 12.12). Ce réglage mettra alors vos éléments
de menu en valeur en modifiant leur style d’affichage.
On prendra enfin soin dans le second onglet Assignation des menus de vérifier que le menu
est assigné à toutes les pages, le modifier en ce sens si besoin. Cliquez sur Enregistrer & Fermer
pour sauvegarder les modifications.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 204 — #228
✐ ✐
Lors du choix de type de module à créer, sélectionnez Contenu personnalisé. Dans l’écran
suivant, donnez un titre au module, par exemple « Mon logo », masquez le titre du module, et
sa position au sein du template JoomSpirit_76 en sélectionnant Logo dans la liste proposée
(figure 12.13).
Puis rendez-vous dans l’onglet Personnaliser le contenu et insérez une image en guise de
logo au moyen de l’éditeur de contenu. Pour les besoins de notre exemple, et si vous ne disposez
pas encore de votre propre logo, vous pouvez insérer un des logos Joomla! fournis par défaut
au moyen du chemin suivant : images/joomla_logo_black.jpg (figure 12.14).
Enregistrez votre nouveau module en cliquant sur le bouton Enregistrer & Fermer. Rendez-
vous maintenant sur la page d’accueil de votre site pour vérifier le résultat obtenu (figure 12.15).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 205 — #229
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 206 — #230
✐ ✐
outre la possibilité de choisir d’autres polices de caractères, ceci permettant de donner un style
plus personnel à votre site.
Ensuite sur le paramétrage des modules, nous avons vu que leurs positions peuvent être
déterminantes pour l’attractivité même du contenu (Eyetracking et règle des tiers). Le template
JoomSpirit_76 vous permet d’affiner certains réglages graphiques au moyen du suffixe de classe
CSS.
Par défaut, le fond et le contour des modules sont transparents. Mais vous pouvez modifier
chacun d’eux en ajoutant un suffixe de classe particulier :
• link : pour mettre en valeur une liste de liens ;
• border : pour ajouter une bordure autour du module ;
• grey : pour assombrir le fond du module ;
• light : pour au contraire éclaircir le fond du module.
Ceux-ci ne sont que quelques exemples de ce que peut offrir ce template en particulier.
Pour retrouver l’intégralité des possibilités, reportez-vous au manuel complet, livré avec l’archive
initiale. N’hésitez pas à vous rendre sur le site de l’auteur pour profiter d’une gamme de
templates encore plus étoffée.
En résumé
Plus qu’une carte de visite, l’aspect visuel de votre site se doit d’être votre empreinte, celle qui
va marquer, ou non, le visiteur. Tel un savant mélange, si celle-ci est trop marquée ou trop
fade, votre contenu aura du mal à ressortir.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 207 — #231
✐ ✐
13
Gérer les modules
Objectif
Avoir du contenu c’est bien, un site au design attrayant c’est encore mieux. Mais si la disposition
de ce contenu n’est pas réfléchie de manière à attiser la curiosité de vos visiteurs, leur intérêt
s’en trouvera diminué.
Vous allez passer du temps dans la gestion des modules, alors attardons-nous sur eux pour
vous aider à bien comprendre leur fonctionnement.
Le gestionnaire de module
Un module présente un contenu qui s’affiche dans une page selon un emplacement et des règles
que vous avez définis.
Les règles sont immuables. En revanche, les emplacements, eux, sont variables. Il existe des
emplacements standards, ceux que l’on retrouve généralement dans tous les templates Joomla!,
mais vous pouvez très bien créer vos propres emplacements ; et un webdesigner créant un
template peut en prévoir une centaine s’il le désire. Vous courez toutefois un risque dans le cas
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 208 — #232
✐ ✐
de figure où vous décidiez de changer de template et que le nouveau ne propose pas les mêmes
emplacements...
Si par exemple vous publiez votre module de login (module qui permet aux utilisateurs de
votre site de s’authentifier) à la position « ma_position_a_moi » et que vous installez un nouveau
template dans lequel cette position ne serait pas définie, personne ne sera en mesure de voir
votre module de login... gênant non ?
Un même module peut être créé plusieurs fois, c’est-à-dire que vous pouvez par exemple
avoir deux modules « mes_5_derniers_articles ». Chacun de ces modules a la propriété de n’être
visible que sur certaines pages et d’afficher les 5 derniers articles d’une catégorie donnée. Le
premier module, positionné en haut à gauche de la page d’accueil uniquement ; le second,
positionné en bas à droite sur toutes les pages, sauf sur la page d’accueil. Vous disposez ainsi
de deux modules bien distincts.
Plusieurs modules peuvent avoir la même position. Si vous avez par exemple une colonne
sur la partie gauche de votre site, vous pouvez choisir d’afficher votre menu et la liste des 5
derniers articles sur la position « gauche ». Pour savoir lequel s’affichera en premier, vous pouvez
définir un ordre (figure 13.1) en triant tout d’abord sur l’ordre au moyen des deux petites flèches
verticales à gauche de la colonne statut, puis en effectuant un glisser déplacer au moyen des
trois petits carrés verticaux du module souhaité.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 209 — #233
✐ ✐
Astuce : si un module apparaît « publié » dans l’administration mais que vous n’arrivez pas à le voir
sur le site, vérifiez ses paramètres d’affichage. Cliquez pour cela sur le titre du module dans la liste et
regardez dans l’onglet Assignation des menus : peut-être n’est-il visible que sur la page d’accueil ?
Modifiez les paramètres, enregistrez et rafraîchissez la page du site.
Les positions
Voici le cœur de cible des modules : la position de vos contenus dans la page.
Lorsque vous faites vos courses au supermarché, vous remarquerez que les produits mis en
avant font l’objet d’une signalétique et d’un positionnement particulier dans le rayon, le plus
souvent à hauteur de vos yeux pour être plus facilement repérables. Il s’agit ici de faire de même.
Un contenu important, un menu, un fil d’actualité, se doivent d’être visibles au premier coup
d’œil.
S’agissant le plus souvent de positions standards définies pour l’ensemble des templates en
circulation, bon nombre de noms de positions sont à consonances anglaises. Ne soyez donc pas
surpris de trouver des positions left (gauche), right (droite), top (haut) ou encore footer (pied de
page). En dehors de ces quelques exemples, les positions que vous affecterez seront définies par
le template que vous choisirez.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 210 — #234
✐ ✐
• la position,
• le statut de publication,
• la période de publication éventuelle,
• le niveau d’accès,
• un ordre pour l’affichage au sein de la position,
• la langue d’affichage,
• une note descriptive, optionnelle.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 211 — #235
✐ ✐
Options d’affichage : enfin, les options d’affichage, plus classiques, agissent sur certains
paramètres de présentation des articles (figure 13.2) :
• Liens sur titres, permettant de placer un lien vers l’article depuis son titre ;
• l’affichage ou non de la date de création, modification ou publication dans un format
spécifié ;
• l’affichage du nom de la catégorie, du nombre de requêtes (nombre de clics sur l’article),
de son auteur, du texte d’introduction pour lequel on fixera le nombre limite de caractères
affichés, ainsi que du titre de l’article pouvant également servir de lien direct vers ce
dernier.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 212 — #236
✐ ✐
Articles archivés
Ce module affiche la liste des articles archivés sous forme d’un calendrier mensuel. Lorsqu’un
utilisateur clique sur l’intitulé d’un mois, une liste d’articles pour cette période est alors proposée.
Nombre par mois : Nombre d’éléments affichés par défaut.
Articles en relation
Ce module permet d’afficher une liste d’articles en rapport avec un article actuellement affiché
sur la page. Une recherche est effectuée parmi les mots-clefs (métadonnées) saisis dans l’article
affiché et ceux des autres articles du site. Si des recoupements existent, les articles trouvés sont
ajoutés à la liste. Les seuls paramètres de base disponibles consistent à afficher ou non la date
des articles ainsi que leur nombre.
Bannières
Ce module, en relation directe avec le composant du même nom, permet l’affichage des
bannières préalablement sélectionnées (figure 13.4). Lors d’un clic sur l’une des bannières
affichées, le visiteur est alors redirigé vers le site annonceur.
Cible : lors de la redirection, définit le mode d’ouverture du lien : Ouvrir dans la fenêtre
parente (remplace la page actuelle), Ouvrir dans une nouvelle fenêtre, Ouvrir dans une fenêtre
popup (sans boutons ni menus).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 213 — #237
✐ ✐
Changement de langue
C’est l’un des attraits majeurs de Joomla! : la possibilité d’insérer nativement un module de
sélection de la langue d’affichage des pages, autrefois réservé à des modules tiers. Prendre soin
toutefois d’activer le plugin Système – Filtre de langue pour utiliser pleinement cette fonction.
Texte avant/Texte après : ces cadres permettent de spécifier le texte ou code HTML à
utiliser au-dessus et au-dessous du sélecteur de langue.
Utiliser liste déroulante : si désactivé, permet l’utilisation de drapeaux pour symboliser
la langue à sélectionner.
Connexion
Le module connexion est un peu particulier, car il offre deux affichages. Le premier est celui
permettant à tout utilisateur de se connecter au site, de demander le renvoi de son identifiant,
d’initier la réinitialisation du mot de passe ; et, selon que l’option est active ou non, la possibilité
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 214 — #238
✐ ✐
de demander la création d’un compte. Le second affichage permet, une fois connecté, d’accéder
à la fonction de déconnexion (figure 13.5).
Contenu personnalisé
Ce module permet de créer un affichage personnalisé présenté en langage HTML. La saisie se
fait par le biais d’un éditeur de texte, sur la partie gauche de l’écran. À noter, les deux options
présentes dans l’onglet Paramètres :
Plug-ins de contenu : permet d’utiliser les plugins de contenu standard de Joomla!, pour
la mise en page notamment.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 215 — #239
✐ ✐
Sélectionner une image de fond : comme son intitulé l’indique, l’image éventuellement
sélectionnée servira de fond au contenu personnalisé inséré.
Copyright de Joomla!
Le module Copyright, plus souvent appelé pied de page, permet d’afficher le copyright de
Joomla!.
Derniers articles
Ce module reprend le principe de celui des articles les plus consultés (voir précédemment) en
affichant une liste composée des articles récemment publiés ou mis à jour.
Catégorie : permet de limiter la liste à une ou plusieurs catégories d’articles sélectionnées.
Si aucune sélection n’est effectuée, toutes les catégories sont prises en compte.
Nombre : définit le nombre maximum d’articles pour la liste affichée.
Articles en vedette : affiche ou non les articles « en vedette » parmi les articles listés,
permet également de restreindre l’affichage à ces seuls articles.
Classement : trie les articles par ordre de création, de modification ou de publication.
Auteurs : filtre les articles selon trois modes : tous les articles, ceux dont vous êtes auteur ou
ayant été modifiés par vous-même, et enfin ceux pour lesquels vous n’êtes ni l’auteur original, ni
l’auteur des modifications.
Derniers inscrits
Ce module affiche la liste des derniers utilisateurs inscrits sur le site.
Nombre d’utilisateurs : Définit le nombre d’utilisateurs à afficher.
Affichage par groupe : effectue un regroupement des utilisateurs en fonction de leur
groupe d’appartenance.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 216 — #240
✐ ✐
Fil de navigation
Le fil de navigation, également appelé fil d’Ariane, tout comme dans la mythologie, permet de
retrouver son chemin, mais cette fois-ci sur votre site. On parlera également de breadcrumbs
(miettes de pain), ce module détaillant le chemin reliant l’accueil du site à la page actuellement
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 217 — #241
✐ ✐
affichée, sous forme de fil conducteur, comme des miettes de pains que l’on aurait semées
derrière soi (figure 13.8).
Intro « Vous êtes ici » : affiche le texte « Vous êtes ici » en guise d’introduction du chemin
parcouru sur le site.
Page d’accueil : affiche ou non un lien de retour vers l’accueil en début de fil.
Texte de page d’accueil : définit le texte pour le lien d’accueil, généralement Home ou
Accueil.
Dernier élément : présente le dernier lien du chemin de navigation, celui actuellement
affiché.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 218 — #242
✐ ✐
Flash d’information
À chaque visite de la page, ce module affiche au hasard un ou plusieurs articles choisis au sein
d’une catégorie spécifiée (figure 13.9).
Catégorie : permet de sélectionner une ou plusieurs catégories d’articles à afficher.
Images des articles : affiche les images contenues dans les articles.
Titre des articles : affiche le titre de l’article en cours.
Lien sur les articles : permet de créer un lien sur le titre qui renverra vers l’intégralité de
l’article.
Balise du titre : définit le niveau de titre, au format HTML.
Séparateur : affiche le séparateur après le dernier article de la liste.
Lien ‘Lire la suite...’ : permet l’affichage du bouton afin d’accéder à l’intégralité du texte
de l’article.
Nombre d’articles : nombre d’articles à afficher simultanément.
Ordre de tri : mode de tri de l’affichage : date de publication, date de création, prédéfini
ou aléatoire.
Direction : affiche les articles du premier au dernier, ou inversement.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 219 — #243
✐ ✐
Image aléatoire
Ce module affiche une image prise au hasard parmi celles d’un répertoire spécifié. Chaque
visite de page conduira à l’affichage d’une image différente. Un lien pourra rediriger les visiteurs
lors d’un clic sur l’image affichée.
Type d’image : définit le format d’image à utiliser (.png, .gif ou .jpg). Par défaut, le format
.jpg est utilisé.
Dossier des images : définit le chemin relatif vers le répertoire où les images sont stockées.
Nous vous conseillons de créer un répertoire spécifique dans lequel vous « rangerez » vos photos.
Par défaut, le lien à spécifier sera de type images/ votre répertoire
Lien : lien URL de redirection lors d’un clic sur l’image.
Largeur (px) / Hauteur (px) : largeur et hauteur de l’image à afficher. Si aucune précision
n’est donnée, l’affichage se fera en fonction des possibilités offertes par le template choisi.
Liens Web
Ce module affiche une liste de liens Web en fonction d’une catégorie sélectionnée. On pourra
également choisir le mode de redirection des liens.
Catégorie : sélectionne une catégorie de liens à afficher.
Nombre de liens : définit le nombre de liens qui composeront la liste proposée.
Type de tri : permet de trier la liste proposée par titre, classement, nombre de clics.
Sens du tri : sens de tri, croissant ou décroissant.
Fenêtre cible : définit le mode de redirection du lien, soit en remplacement de la page
actuelle, soit dans une nouvelle fenêtre, avec ou sans boutons et barre de navigation (popup).
Suivi des liens : option à destination des robots utilisés par les moteurs de recherche.
Indique si le lien doit être suivi par le moteur de recherche dans sa collecte d’indexation des
liens.
Description : affiche la description des liens Web proposés.
Clics : affiche le nombre de clics effectués sur le lien.
Compter les clics : détermine si le comptage de clics doit être effectué.
Menu
Ce module est sans conteste l’un des plus souvent utilisés. Il sert à afficher les différents menus
de votre site (figure 13.10). On créera ainsi un module pour chacun des menus à afficher.
Menu à afficher : sélectionne le menu à afficher parmi la liste des menus existants.
Base item : constitue l’élément de base de l’affichage du menu. Le module sera alors
affiché sur toutes les pages affichant l’élément sélectionné.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 220 — #244
✐ ✐
Niveau de départ / Dernier niveau : définit les niveaux minimum et maximum des
éléments de menu à afficher, le niveau 1 correspondant à la racine.
Afficher tous les liens : si activé, et suivant le type de menu, standard ou personnalisé
(module additionnel installé), tous les éléments demandés seront alors affichés sous la forme
d’un arbre de liens.
Recherche
Nous avons déjà abordé le composant, permettant de recueillir des statistiques sur les recherches
effectuées sur votre site. Son compagnon indispensable, le module de recherche, permet quant
à lui l’affichage du moteur de recherche, avec ou sans critères de sélection.
Deux modes d’affichage se distinguent : un premier mode, selon le template choisi, permettra
d’afficher un champ de saisie ainsi qu’un bouton de recherche ; un second mode, sous forme
d’un lien de menu, permettra d’afficher le module complet de recherche par critères.
Label du champ : définit le titre de la zone de recherche. Si laissé vide, la valeur par défaut
du fichier de langue sera utilisée.
Largeur du champ : il s’agit là de la taille d’affichage de la zone de recherche, en nombre
de caractères.
Texte dans le champ : vous pouvez définir la valeur affichée dans le champ de recherche,
pour définir un exemple. Si laissé vide, la valeur par défaut du fichier de langue sera utilisée.
Bouton de recherche : détermine si le bouton de recherche doit être affiché ou non.
Position du bouton : la position du bouton de recherche, si celui-ci est affiché, peut être
défini par rapport à la zone de saisie (à droite, à gauche, en haut, en bas).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 221 — #245
✐ ✐
Image du bouton : une image peut être utilisée pour le bouton de recherche. L’image
devra être nommée searchButton.gif et placée dans le répertoire /images/ du template utilisé.
Texte du bouton : définit le texte du bouton de recherche. Si laissé vide, la valeur par
défaut du fichier de langage sera utilisée.
Découverte automatique OpenSearch : suivant le navigateur de vos visiteurs, le module
de recherche de votre site peut être découvert et utilisé directement depuis la recherche du
navigateur, selon un protocole nommé OpenSearch. Si vous souhaitez proposer cette option à
vos visiteurs, activez-la.
Titre OpenSearch : dans le cadre de l’utilisation d’OpenSearch, vous pouvez spécifier un
titre à votre site en tant que moteur de recherche.
ID de menu : lorsqu’aucun menu n’est défini pour paramétrer l’affichage des résultats de
recherche, il est possible de spécifier un ID parmi les liens de menus existants.
Recherche avancée
Dans le même registre que le module de recherche texte, le module de recherche avancée, dite
indexée, doit être créé et publié pour que celle-ci soit utilisable.
Filtres de recherche : permet de restreindre le champ de recherche au filtre spécifié.
Rendez-vous au chapitre 11 sur les Composants pour de plus amples précisions sur la création
des filtres.
Suggestions de recherche : permet de suggérer des éléments de recherches, soit
dynamiques lors de la saisie dans le champ de recherche, soit par l’adjonction de résultats
suggérés.
Recherche avancée : propose les options avancées de recherche indexée.
Statistiques
Ce module affiche des données statistiques de visites sur votre site.
Information sur le serveur : affiche des informations sur le serveur utilisé.
Information sur le site : affiche des informations diverses sur le site.
Compteur de clics : affiche le nombre de pages visitées.
Valeur initiale du compteur : augmente le compteur de clics du nombre spécifié, souvent
utilisé en cas de migration depuis un autre moteur de site, pour éviter de repartir de zéro.
Attention ! Pratiques pour les administrateurs afin de connaître certaines données d’installa-
tion du site, ces informations (type de serveur, de base de données...), dès lors qu’elles sont
visibles par tous, peuvent se révéler bien utiles, surtout pour d’éventuels pirates... À réserver
par conséquent à des yeux avertis en modifiant le niveau d’accès.
Tags populaires
Ce module permet un affichage des tags de votre site classés notamment par titres ou par
nombre d’éléments par tags.
Nombre maximal de tags : affiche le nombre maximal de tags spécifiés. Si utilisé dans
un espace restreint, permet de limiter l’espace d’affichage du module.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 222 — #246
✐ ✐
Période : affiche les tags appliqués lors d’une période donnée, dernière heure, jour, mois,
année, ou bien depuis la création du site.
Ordre : affiche les tags en les ordonnant soit par titre, par nombre d’éléments pour chaque
tag, ou aléatoirement.
Direction : critère de tri d’affichage ascendant ou descendant.
Affiche le texte « Aucun résultat » : permet de prévenir un affichage de liste vide en
spécifiant l’absence de résultat.
À noter la possibilité en mode nuage de définir la taille minimale et maximale des caractères,
depuis un onglet spécifique nommé Affichage en nuage.
Tags similaires
Ce module permet cette fois une liste de liens vers des contenus munis de tags ayant des
recoupements entre eux.
Nombre maximal de liens : définit le nombre maximal de liens à afficher.
Niveau de similitude : permet d’affiner la recherche de similitudes à au moins un, la
moitié ou tous les tags présents dans chaque contenu.
Articles les plus récents : ce module affiche les articles récemment ajoutés ou modifiés, à
noter que les articles expirés sont également pris en compte.
Articles populaires : ce module affiche les articles les plus consultés, expirés ou non.
Barre d’outils : ce module prend en charge l’affichage de la barre de menu comportant
les boutons d’actions (Nouveau, Modifier, Publier, etc.). À ne surtout pas désactiver !
Connexion : ce module permet la connexion à l’administration du site. À ne surtout pas
désactiver !
Icônes de raccourcis : ce module affiche les icônes d’accès rapides aux éléments
principaux d’administration situés sur le panneau d’administration.
Menu principal : ce module affiche le menu général d’administration situé en haut à
gauche de la page. À ne surtout pas désactiver !
Module version Joomla! : ce module affiche des informations sur la version courante de
Joomla!.
Sous-menu : ce module permet l’utilisation de sous-menus nécessaires à l’affichage de
certaines pages. À ne surtout pas désactiver !
Statut multilingue : ce module affichera un lien permettant de vérifier si tous les éléments
nécessaires à la gestion d’un site multilingue sont présents. Le cas échéant, vous serez averti des
éventuels éléments manquants ou incomplets.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 223 — #247
✐ ✐
Statut utilisateurs : ce module gère l’affichage d’un lien vers la page d’accueil du site, du
nombre d’utilisateurs connectés au site, des utilisateurs connectés à l’administration et le nombre
de messages non lus.
Titre : ce module affiche le titre et la description en haut à gauche de la barre d’outils. À ne
pas désactiver !
Utilisateurs connectés : ce dernier type de module affiche le nombre d’utilisateurs
enregistrés actuellement connectés au site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 224 — #248
✐ ✐
Tout d’abord quelques prérequis de mise en route. Nous aurons besoin pour mener à bien
l’opération :
• de l’archive d’installation du module, Flexslider_unzip_first.zip. Celle-ci est disponible
depuis le site Internet de l’auteur (http://www.template-joomspirit.com) dans la partie
Joomla / Free Joomla! Extensions ;
• d’une série d’images que nous afficherons par le biais du module.
À noter : les images devront toutes être de la même dimension (hauteur / largeur). Veillez
par conséquent à préparer vos images en amont de la mise en place.
Installation
Tout d’abord, il nous faudra extraire le contenu de l’archive récupérée. En effet, celle-ci contient
à la fois le module à installer pour les différentes versions de Joomla! mais également le manuel
complet de configuration.
Depuis le menu Extensions / Gestion des extensions, effectuez l’installation à partir de
l’onglet Archive à envoyer en allant rechercher le fichier mod_js_flexslider.zip sur votre disque
dur (chemin local + / Flexslider_unzip_first/Joomla 3.X), puis cliquez sur le bouton Envoyer &
installer (figure 13.11).
Nous recommandons tout de même de créer un répertoire spécifique pour les images à
charger, par exemple /images/carrousel.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 225 — #249
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 226 — #250
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 227 — #251
✐ ✐
La dernière étape, dans l’onglet Assignement de menus, consiste à assigner le module pour
que celui-ci soit affiché pour toutes les pages du site ou bien, à votre guise, sur la seule page
d’accueil.
Cliquez enfin sur Enregistrer & Fermer pour sauvegarder toutes vos modifications. Vous
pouvez maintenant apprécier le résultat (figure 13.15).
En résumé
Les modules sont la clé de la visibilité de vos contenus au sein de vos pages. Négliger leur
placement revient à brider la pertinence de vos affichages. Pour autant, une gestion fine de ces
affichages permettra de mettre en avant certains éléments moteurs de votre site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 228 — #252
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 229 — #253
✐ ✐
14
Gérer les plugins
Objectif
Nous l’avons déjà évoqué, les plugins servent à ajouter ou à activer un comportement particulier
sur certains composants. Leur utilisation étant très ciblée, l’idée n’est pas ici d’effectuer une
revue détaillée de leurs paramétrages mais de voir leur utilité générale.
Nous verrons également au travers d’exemples précis comment les plugins peuvent améliorer
de façon conséquente l’utilisation au quotidien.
Tout d’abord, rendez-vous dans le menu Extensions / Gestion des plugins. Vous retrouverez ainsi
l’ensemble des plugins installés, que vous pouvez trier sur votre gauche par type.
Authentication
Authentification – Joomla! : il s’agit du mode d’identification par défaut utilisé, basé sur les
utilisateurs inscrits.
Authentification – Gmail : basé sur la plateforme de messagerie de Google, ce système
d’identification implique que l’utilisateur possède un compte Gmail valide. Le plugin validera
ainsi la connexion en interrogeant Gmail pour vérifier l’identité de l’utilisateur.
Authentification – LDAP : idéale en contexte d’entreprise, mais nécessitant des connais-
sances adaptées, la possibilité de se connecter à l’aide d’une identification LDAP est très
appréciable. Le plugin fait ici office de lien de connexion entre le site Joomla! et LDAP qui,
en tant que système de gestion d’annuaire d’utilisateurs externes, valide les informations de
connexion de ces derniers.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 230 — #254
✐ ✐
Captcha
Captcha – ReCaptcha : service fourni par Google, ReCaptcha permet une protection contre
les messages indésirables notamment pour les formulaires de contacts de Joomla!. Il est ainsi
demandé la saisie d’un texte affiché de façon déformée afin de valider les informations d’un
formulaire.
Content
Contenu – Chargement de module : ce plugin est utilisé pour afficher les modules d’une
position dans un article. Par exemple en insérant {loadposition position-5}, l’article affichera
en son sein l’ensemble des modules affectés à la position 5 du template.
Contenu – Contact : celui-ci fournit un lien entre une fiche de contact et un utilisateur
Joomla! ayant créé du contenu.
Contenu – Indexation de la recherche : lors de l’utilisation de la recherche avancée, ce
plugin permet d’activer l’indexation approfondie en référençant l’intégralité du contenu.
Contenu – Joomla! : ce plugin, à usage interne, permet le traitement des éléments de
catégories.
Contenu – Navigation entre les pages : ce plugin affiche les indications de navigation
lorsque plusieurs pages (pages précédentes, pages suivantes) constituent un article ou une liste
d’articles.
Contenu – Protection des e-mails : le masquage des adresses électroniques (email
cloaking en anglais) effectue un remplacement des adresses e-mails se trouvant dans un
article par des liens qui les masquent. Ceci prévient toute collecte éventuelle par des robots
automatiques de récupération d’adresses e-mails.
Contenu – Saut de page : ce plugin gère les sauts de pages des articles dans l’éditeur
de texte. Il permet également l’affichage d’une table des matières pour l’article lors de sa
visualisation.
Contenu – Vote sur article : ce plugin ajoute la prise en charge des votes, ainsi que
l’affichage des résultats dans les articles.
Editors
Éditeur – CodeMirror : ce plugin permet l’utilisation de l’éditeur de texte CodeMirror dédié à
l’édition native de codes sources (PHP, CSS, HTML par exemple). On pourra ainsi saisir du code
qui sera automatiquement reconnu, mis en forme et présenté avec des codes couleur.
Éditeur – Non WYSIWYG : l’utilisation de ce plugin en tant qu’éditeur de texte par défaut
revient, en réalité, à n’utiliser aucune option de mise en forme des articles.
Éditeur – TinyMCE : éditeur de texte par défaut lors de l’installation et regroupant bon
nombre de fonctions utiles lors de la saisie d’un article, on lui préférera néanmoins bien souvent
d’autres éditeurs plus complets (voir cas pratique en section 14.2).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 231 — #255
✐ ✐
Editors-xtd
Bouton – Article : ceci constitue le premier des quatre boutons situés en dessous de l’éditeur de
texte lors de la création d’un article. Il permet lors de la sélection d’une portion de texte d’insérer
directement un lien vers un autre article du site.
Bouton – Image : permet l’accès aux options par défaut d’insertion d’une image au sein
d’un article.
Bouton – Lire la suite... : ajoute une séparation dans le texte d’un article afin de n’en
afficher qu’une portion sur une page en mode blog.
Bouton – Saut de page : ce dernier plugin bouton insère une coupure dans un article
sous forme de saut page afin de limiter les longueurs de pages trop importantes.
Extension
Extension – Joomla! : ce plugin gère les mises à jour des extensions installées.
Finder
Finder est à la base une extension qui fut intégrée à Joomla!. Plusieurs plugins ont été ainsi
ajoutés en vue de l’indexation complète des articles, catégories, contacts, fils d’actualité, liens
web et tags.
Installer
Installation – Installation depuis le Web : ce plugin compte parmi les nouveautés de
Joomla! 3, et permet depuis la Gestion des extensions une installation effectuée directement
depuis le Web.
Quick icon
Nous avons déjà vu que deux notifications sont disponibles sur la page du panneau d’admi-
nistration de Joomla! et permettent d’être alerté lorsqu’une mise à jour de Joomla! ou d’une
extension installée est disponible. Les deux plugins de type Quick Icon assurent cette fonction.
Search
Lorsqu’une recherche simple est effectuée sur le site, les plugins de recherche étendent ou limitent
le périmètre de recherche aux seuls plugins de recherche actifs. Si vous installez des composants
tiers, un plugin spécifique de recherche pour ce composant doit être installé et activé.
System
Système – Cache : ce plugin constitue le cache des informations pour une page. L’utilisation
du cache du navigateur permet de contrôler la durée de rétention des informations.
Système – Code langue : permet de changer le code de langue d’une page en vue
d’optimiser son référencement par les moteurs de recherche.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 232 — #256
✐ ✐
Twofactorauth
Nouveauté présente depuis Joomla! 3, ces plugins ajoutent un second facteur d’identification
de l’utilisateur par le biais d’un moyen tiers, tel qu’un second mot de passe ou une clé physique
d’identification, type USB, à connecter à l’ordinateur de l’utilisateur.
User
Utilisateur – Joomla! : ce plugin enregistre une trace dans la base de données lors de la
connexion d’un utilisateur.
Utilisateur – Fiches de contact automatiques : lors de l’ajout d’un nouvel utilisateur, ce
plugin active la création automatique d’une fiche de contact liée à l’utilisateur nouvellement créé.
Utilisateur – Profil : ce plugin définit quelles informations optionnelles seront demandées
à un utilisateur désireux de s’inscrire sur le site.
Nous venons de voir que les plugins nous facilitent la vie et automatisent pour certains des
actions que nous devrions répéter bien souvent.
Au travers des deux exemples qui vont suivre, nous allons vous montrer des cas où des
plugins additionnels permettent d’aller bien au-delà de nos espérances.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 233 — #257
✐ ✐
Installation et configuration
Rendez-vous dans le menu Extensions / Gestion des extensions. Après avoir spécifié le chemin
vers l’archive d’installation en utilisant le bouton Parcourir, cliquez sur le bouton Envoyer &
installer. Vous serez guidé durant les quelques étapes d’installation.
Tout d’abord, il vous sera proposé de télécharger un guide d’installation afin de faciliter
l’installation et la prise en main de l’éditeur. En cliquant sur le bouton Suivant, il vous sera
ensuite demandé de vérifier puis éventuellement corriger des permissions d’accès aux fichiers et
répertoires si ceux-ci ne permettent pas une sécurité optimale des éléments (figure 14.1).
Les deux étapes suivantes vous permettront de spécifier les options de polices de caractères,
de couleur de fond à utiliser lors de l’édition ainsi que l’accès aux répertoires de contenus :
images, fichiers, etc. (figure 14.2). Il est à noter que JCK Editor vous permet de sélectionner
les types d’utilisateurs pouvant avoir accès à ces contenus, ainsi qu’une option intéressante
permettant de créer un répertoire propre à chaque utilisateur.
La dernière étape vous invite à définir les styles d’affichage pour la zone d’édition
(figure 14.3). Sans indication particulière de votre part, l’éditeur reprendra les informations
du template par défaut.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 234 — #258
✐ ✐
À l’usage
Vous pouvez ensuite vous rendre dans la création d’un nouvel article et profiter de l’interface de
ce nouvel éditeur, très proche de ce que Word pourrait par exemple vous proposer en termes
d’ergonomie (figure 14.5). Nous pouvons ici lors de l’insertion d’une image, non seulement
insérer celle-ci, redéfinir sa taille d’affichage à la volée, mais également et directement lui
attacher un lien hypertexte.
À noter que l’on retrouve également dans l’interface, la possibilité de faire un clic droit sur
le contenu et d’accéder à un menu contextuel en fonction de l’élément sélectionné. Dans le
cadre d’une image ou d’un lien hypertexte, il sera alors possible d’en redéfinir plus aisément les
propriétés.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 235 — #259
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 236 — #260
✐ ✐
Installation
Depuis le menu Extensions / Gestion des extensions, recherchez Sigplus dans le premier onglet
Installer à partir du web. Une fois trouvée, cliquez sur la fiche pour accéder aux détails. Vous
serez alors invités à l’Installer (figure 14.6). Une dernière étape vous demandera de confirmer
l’installation en cliquant sur le bouton Installer.
Ensuite, rendez-vous dans la Gestion des plugins, puis recherchez celui nommé « Content –
Image gallery – sigplus », activez-le en cliquant une fois sur le petit rond rouge avec une croix
blanche à gauche du titre trouvé, celui-ci sera alors publié et utilisable.
À noter : en cliquant sur le titre du plugin, vous serez en mesure de modifier, entre autres, la
taille affichée en hauteur et en largeur, ainsi que des propriétés liées à la source des données
affichées. Par défaut, le chemin de sélection pour les images est /images, ce qui correspond
à la racine du Gestionnaire de média.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 237 — #261
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 238 — #262
✐ ✐
En résumé
Les plugins servent non seulement à automatiser ou à simplifier certaines tâches, notamment
d’administration ou de gestion de vos articles, mais peuvent aussi donner de la valeur ajoutée
à vos contenus !
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 239 — #263
✐ ✐
15
Gérer les langues
Objectif
Joomla! existe bien évidemment de base en version francophone. Néanmoins, l’utilité d’installer
de nouvelles langues peut se révéler utile lorsque votre public dépasse le cadre de nos frontières.
Voyons comment orchestrer cette gestion et mettre tout cela en musique.
Depuis le menu Extensions / Gestion des langues, quatre éléments sont à votre disposition
dans le menu de gauche.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 240 — #264
✐ ✐
Pour changer la langue par défaut, il suffit de cliquer sur l’étoile d’une autre langue
directement dans la liste, ou bien de sélectionner la langue et de cliquer sur le bouton Défaut
dans la barre de boutons d’action.
Langues de contenus
Le troisième élément de menu permet d’activer et créer les langues à utiliser pour le contenu
(figure 15.2).
Pour publier ou dépublier une langue, il suffit de cliquer sur l’icône à gauche de son titre
afin de changer son statut ou bien de sélectionner la langue dans la liste et d’utiliser les boutons
Publier et Dépublier dans la barre de boutons d’action.
Des boutons sont également à votre disposition afin d’éditer ou créer de nouvelles définitions
de fichiers de langues. Un bouton Paramètres vous donnera accès au réglage des droits pour ce
type d’extensions.
Substitutions de traduction
Ceci est un point intéressant, si vous souhaitez donner un sens différent à un terme du site ou
d’administration, libre à vous de redéfinir sa traduction.
Pour cela, depuis le quatrième élément de menu nommé Substitutions, cliquez sur le bouton
Nouveau situé dans la barre d’action. Vous pourrez ainsi spécifier une nouvelle définition d’un
terme. Pour cela, un petit moteur de recherche est à votre disposition sur la partie droite de l’écran.
Vous pouvez ainsi rechercher un terme, soit par sa chaîne (nom interne), soit par sa valeur (le
texte dûment affiché). Définissez ensuite sa nouvelle valeur et enregistrez votre substitution.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 241 — #265
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 242 — #266
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 243 — #267
✐ ✐
Imaginez, vous êtes sur un article et vous changez de langue, le site vous renvoie vers la page
d’accueil, faute d’association. Ceci peut se révéler extrêmement frustrant pour vos visiteurs
qui doivent refaire le chemin vers le contenu désiré.
En associant à chaque article, catégorie, menu, un élément dans la langue désirée, le site
vous permet de changer de langue tout en restant sur le même contenu sélectionné.
Dupliquer le contenu
Qu’on ne s’y trompe pas, gérer un site multilingue est un travail de longue haleine si vous avez
beaucoup de contenu. Car comme énoncé précédemment, Joomla! ne fera pas les traductions de
contenu à votre place. Il vous faudra faire les traductions d’articles et de menus par vous-même
(ou avec de l’aide extérieure bien sûr).
Ceci constitue le plus gros du travail, plus vous avez d’articles, plus le nombre de traductions
à gérer sera conséquent. On pourra néanmoins restreindre le périmètre de publication en
limitant le nombre d’éléments de menu mis à disposition. Vous pourrez par exemple publier
l’ensemble de la présentation de votre société, les différents pans de votre activité, la prise de
contact, mais omettre tout ou partie de votre catalogue produits, jusqu’à ce que celui-ci ait été
proprement traduit.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 244 — #268
✐ ✐
Cliquez ensuite sur le bouton Traitement depuis la barre d’actions. Dans la fenêtre qui
apparaît, sélectionnez la langue Français (FR), puis cliquez sur le bouton Traitement. Tous les
articles sélectionnés ont été modifiés pour n’apparaître qu’en langue française.
Re-sélectionnez les articles en vedette, cliquez à nouveau sur le bouton Traitement. Cette
fois, choisissez la langue English (UK), puis la catégorie Joomla! – EN créée précédemment
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 245 — #269
✐ ✐
et sélectionnez l’option Copier. Cliquez enfin sur le bouton Traitement. Vous venez de créer et
classer des copies de chacun des articles qui seront affichés pour la langue anglaise.
Renouvelez cette opération pour la langue allemande.
Utilisez ensuite la vue Articles en vedette disponible dans le menu de gauche pour constater
la copie des articles. Vous aurez ainsi tout le loisir de les éditer, de traduire leurs contenus
(figure 15.8) et de faire les Associations d’articles dans les autres langues par l’onglet du même
nom.
Nous ne traiterons ici que quelques-uns des articles. Il est bien évident que ce travail
sera plus long si vous choisissez de traiter tout ou partie de vos articles autres que ceux
sélectionnés ici.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 246 — #270
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 247 — #271
✐ ✐
Modules de menu
Tout d’abord, modifiez le module dédié au Menu principal pour lui affecter la langue française.
À noter : si vous utilisez le template JoomSpirit_76 installé au chapitre 12, vérifiez que la
position du menu est bien Left, modifiez le Suffixe de classe pour submenu et vérifiez qu’il est
bien assigné à toutes les pages.
Cliquez ensuite sur Enregistrer depuis la barre d’actions, puis deux fois sur le bouton
Enregistrer une copie. Vous pourrez ensuite cliquer sur Fermer.
Nous venons en fait de créer deux copies parfaites du module de Menu principal. Il ne vous
reste plus qu’à éditer ces deux copies, modifier la langue d’affichage, changer pour le menu
correspondant depuis l’onglet Module (figure 15.12) et enregistrer votre modification.
Autres modules
Nous ne nous sommes occupés ici que du module de Menu principal. Tous autres modules, de
menu, de flux RSS, de bannières... devront également être dupliqués de la même manière.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 248 — #272
✐ ✐
Ensuite, donnez une position à votre sélection de langue (figure 15.13). Ceci peut varier en
fonction du template en vigueur.
À noter : pour notre exemple, sélectionnez la position Left pour le template JoomSpirit_76,
ou bien Position-7 pour le template ProtoStar.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 249 — #273
✐ ✐
Une fois ce paramètre vérifié, et si aucune erreur n’est signalée, visitez votre site
(figure 15.15), vous pouvez à présent cibler un plus large public !
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 250 — #274
✐ ✐
En résumé
Utiliser des langues additionnelles permet d’élargir vos horizons en termes de contenu, mais
également le panel de vos visiteurs, utilisateurs, voire contributeurs. La gestion de cet ensemble
peut s’avérer être une tâche compliquée si on ne veille pas à y consacrer suffisamment de
temps et de rigueur.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 251 — #275
✐ ✐
16
Maintenance :
la gestion au quotidien
Objectif
Votre site est maintenant en ligne et visible aux yeux du monde, vos utilisateurs sont connectés
et heureux. Mais faut-il pour autant vous endormir sur vos lauriers ? Que nenni ! Votre œil
acéré doit maintenant veiller sur tout ce petit monde et assurer le fonctionnement quotidien de
la machine. Pour cela, voici quelques points à ne pas négliger.
Nous vous avons d’ores et déjà présenté cet outil au chapitre 7. Il vous sera précieux. Voici
votre moyen de communication privilégié avec vos utilisateurs. N’en abusez pas, sous peine
de voir vos communications tomber dans l’indifférence. Usez de ce moyen pour prévenir vos
utilisateurs d’événements majeurs sur le site et de ce qui va nous occuper dans ce chapitre : les
maintenances. Vos messages doivent être clairs et concis : veillez à rappeler brièvement l’objet
de l’indisponibilité du site, le jour, l’horaire et la durée.
Disponible depuis le menu Système, Déverrouiller est très pratique et consiste à déverrouiller
tous les éléments qui auraient été bloqués par vous-même ou par vos utilisateurs. Vous verrez
que vous en aurez souvent besoin si plusieurs personnes travaillent dans la partie administration
de votre site.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 252 — #276
✐ ✐
Déverrouiller, mais déverrouiller quoi ? Tout élément du site (articles, menus, catégories,
modules...) nécessite d’être verrouillé lors de modifications. Imaginez deux personnes modifiant
un même article au même moment, la dernière personne qui sauvegarderait l’article effacerait
ce que la première aurait fait... Ainsi, dès qu’un élément est édité par une personne, il est
verrouillé. Les autres utilisateurs verront alors un petit cadenas empêchant son édition. Lorsque
la modification est terminée, l’élément est remis à disposition des autres utilisateurs.
Il peut arriver, lorsque l’utilisateur ferme brutalement son navigateur, ou bien lorsque sa
connexion Internet se coupe, que la remise à disposition ne se fasse pas. L’élément reste alors
verrouillé.
Pour utiliser le déverrouillage, un certain nombre d’éléments vous sont proposés tels que
la table banners pour vos bannières, ou content pour vos articles. Sélectionnez les données à
déverrouiller en cochant la case à gauche de leur nom et cliquez sur le bouton Déverrouiller
situé dans la barre de boutons supérieure (figure 16.1).
Certes, depuis chacun des gestionnaires du site (articles, menus, catégories, modules...),
vous pouvez déverrouiller l’un ou l’autre élément au cas par cas, en le sélectionnant et en
cliquant sur le bouton Déverrouiller situé dans la partie supérieure de la page, ou bien cliquer
directement sur le petit cadenas. À noter qu’en plaçant la souris sur le petit cadenas sans cliquer
vous affichera qui a verrouillé l’élément et à quelle date.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 253 — #277
✐ ✐
Lorsque des articles sont supprimés, ils ne sont pas réellement détruits, ils sont placés dans la
corbeille. Il faut par conséquent penser à vider cette corbeille régulièrement. Depuis la Gestion
des articles, filtrer les articles sur l’état Dans la corbeille. Vous aurez ainsi la liste de tous les
articles en instance de suppression. Sélectionnez les articles, puis cliquez sur le bouton Vider la
corbeille dans la barre de bouton d’action. Les articles seront alors définitivement supprimés.
Conseil : les articles mis à la corbeille utilisent peut-être des images, ou des documents mis
à disposition en téléchargement. Après vous être assurés qu’ils ne sont plus utilisés, pensez
également à supprimer ces éléments depuis la Gestion des médias.
16.5 ARCHIVAGE
Certains de vos articles ne sont plus d’actualités, ont été dépubliés et encombrent votre liste
d’articles par leur nombre important. Pour autant, vous ne souhaitez pas les supprimer. Archivez-
les !
Depuis la Gestion des articles, faites une sélection en cochant la petite case à gauche du titre
des articles et cliquez sur le bouton Archiver. Vous verrez alors ces articles disparaître de votre
écran, la liste restant affichée ne comportant que des éléments de contenus publiés ou dépubliés.
Pour retrouver les articles archivés, utilisez le filtre de statut, en sélectionnant Archivé dans
la liste. Pour sortir un article de l’archivage, il vous suffit de le sélectionner et de le placer à
nouveau en statut publié ou dépublié en cliquant sur le bouton correspondant.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 254 — #278
✐ ✐
Nous avons vu au chapitre 5 que la gestion des versions, notamment des articles, permet de
garder le contrôle sur la publication et la modification de vos contenus. Ce contrôle, effectué
en enregistrant un certain nombre de versions « historisées » de vos articles, vous prémunit de
toute modification ou altération malencontreuse ou délibérée. Néanmoins, cette sauvegarde
multiple de chacun des contenus a un coût. Ce dernier se traduit par une multiplication des
enregistrements au sein de votre base de données.
Si vous deviez revivre votre vie d’écolier, avec vos cahiers au propre, et vos cahiers de brouillon.
Chaque nouvelle version d’un article relègue la précédente au rang de brouillon conservée
pour historique. Plus l’historique augmente, plus le nombre de brouillons enregistrés est
important, plus le travail de la base de données est conséquent. Un mal pour un bien la
plupart du temps, sauf si votre site est immensément riche de contenus et d’auteurs.
Joomla! vous tient informé lorsqu’il détecte certaines anomalies. Pour cela, rendez-vous dans le
menu Extensions / Gestion des extensions, puis la partie Avertissements dans le menu de gauche.
Vous trouverez ici sous forme de liste les points à corriger avec leurs descriptifs ainsi que des
conseils en vue de leurs résolutions.
Nous avons vu qu’il est nécessaire, et même vital de tenir son système à jour. Hormis d’éventuelles
corrections d’erreurs de fonctionnement ou améliorations notoires, certaines failles de sécurité
doivent être comblées pour éviter tout incident fâcheux ou le plus souvent toute intrusion
malhonnête. En cela, Joomla! dispose d’une interface vous fournissant une assistance pour
la mise à jour à la fois de Joomla! lui-même mais aussi de vos extensions.
Tout d’abord, depuis l’écran d’accueil de l’interface d’administration, Joomla! vous informe
directement depuis le menu situé à gauche de l’écran. Les deux dernières indications vous
alertent si Joomla! et si des extensions installées ne sont pas à jour. Un simple clic sur l’un de
ces deux liens vous amènera aux étapes de mise à jour nécessaires.
Il vous suffit de suivre le premier lien pour vous voir proposé d’effectuer la mise à jour en
question.
À noter : un bouton Paramètres est présent pour vous permettre d’indiquer le type de mises
à jour recherchées. Joomla! 3.0, 3.1, 3.2, etc. bénéficient d’un support à court terme (STS),
alors que Joomla! 4.0 bénéficiera d’un support à long terme (LTS). Les mises à jour tiennent
compte de cette nomenclature afin de « filtrer » les éléments à proposer. Le choix du type
de serveur de mise à jour devra se faire en fonction de votre version actuellement installée
(figure 16.2).
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 255 — #279
✐ ✐
Le second lien correspond au menu Extensions / Gestion des extensions, section Mise à jour
(figure 16.3). Effectuez une recherche en cliquant sur le bouton Rechercher des mises à jour situé
dans la barre de boutons d’action.
Si des mises à jour sont disponibles pour les extensions actuellement installées, elles vous
seront présentées sous forme de liste. Vous pourrez ensuite décider de celles à mettre en œuvre
en les cochant, puis en cliquant sur le bouton Mise à jour.
Ces deux liens sont une aide, ceci ne vous dispense pas de vérifier si les extensions installées
ne font pas l’objet de mises à jour, par exemple de sécurité. Certaines nécessiteront peut-
être d’être mises à jour manuellement. Reportez-vous aux précisions fournies par l’éditeur de
l’extension afin de réaliser cette opération.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 256 — #280
✐ ✐
De préférence, choisissez des extensions dont vous pouvez vérifier non seulement la provenance,
mais également la robustesse. Privilégiez des extensions référencées sur les sites officiels tels
que http://extensions.joomla.fr ou http://extensions.joomla.org, et prenez le temps de lire
les avis des personnes ayant déjà testé l’extension. Vérifiez régulièrement les mises à jour des
extensions installées, afin de palier tout bug ou faille de sécurité éventuelle. Testez également et
régulièrement certaines fonctions du site, comme les formulaires de contact lorsque le site en
comporte.
Faire une revue périodique des droits de vos utilisateurs est une action nécessaire et salutaire. Il
n’est pas rare de constater a posteriori que certaines actions trop permissives ou dangereuses
sont laissées à portée de vos utilisateurs. Prenez le temps de revoir votre schéma de sécurité
afin de vous assurer que vos utilisateurs ne seront pas amenés à faire des actions dont ils ne
comprendraient pas les conséquences.
Vérifiez également la fréquentation de votre site, les comptes utilisateurs dormants ou n’ayant
jamais été activés, les comptes utilisateurs nouvellement créés pour vérifier s’ils sont légitimes.
En résumé
La maintenance d’un site internet est un processus nécessaire dont l’objectif est d’assurer
son fonctionnement dans le temps. Votre site est comme toute machine en marche : bien
qu’automatique et autonome, il n’en requiert pas moins toute votre attention.
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 257 — #281
✐ ✐
Index
Symboles Atom 51
auteur 125, 131, 136
7-Zip 4
A B
back-office 7, 36
Accès Enregistré 133
balise Meta 159
Accès Invité 133
balise Meta 158
Accès Public 133
bannière 177–179, 195, 207, 212, 213
Accès Spécial 133
bannière commerciale 207
accessibilité 35
base de données XVI, XIX, 5, 8, 10, 11, 14,
activation de compte 134
21–25, 27, 29–31, 35, 38, 48,
administrateur 45, 125, 132 53–57, 84, 89, 172, 221, 232
administrateurs réseaux 3 bibliothèque 98
administration du site 171, 183, 222 Bing 159
adresse IP 23 blog 72, 158, 159
AFUJ, Association francophone des utilisateurs de Bloquer un utilisateur 128
Joomla! XVII, 28 Bootstrap 19, 27, 35, 43, 98, 123
agrégateur RSS Voir lecteur RSS breadcrumbs Voir fil d’Ariane
ajouter un lot d’images 103 buzz 158
ajouter un utilisateur 127
ajouter une image 102
alias 84, 144, 179, 180, 182 C
AllEvents 186 cache 23, 29, 30, 52, 210, 231, 252
Alsacréations 35 Captcha 50, 134, 230
annuaire 158 catégorie 71, 72
arborescence 61, 140, 180–182 catégorie parente 66, 70
arbre des catégories 74 cellules 92
Archivage 253 certificat SSL 54
archive 88, 174 chaîne éditoriale 34
article en vedette 80, 143 changer la langue 172, 240, 247
articles 51, 61–64, 67–71, 73–77, 172, 193, charte graphique XV, 5, 8, 33, 35–37, 39, 98,
208, 210–212, 215, 218, 219, 222, 157, 159, 181, 193–195
230 clients 125, 131, 178, 179
ascenseurs 215 CMS XV, XXI, 33–36, 38, 46
Assignation de menus 197, 227 CodeMirror 230
assigner un module 154 Coller depuis Word 92
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 258 — #282
✐ ✐
communauté française de Joomla! 16 éditeur de texte 3, 4, 24, 49, 106, 172, 214, 230
compatibilité ascendante 19 éditeur HTML 91
composants 48, 51, 52, 171, 172, 177, 182, éléments de menus 210, 221
231 email cloaking Voir masquage des adresses
compte 126, 210, 214, 215, 220, 229 électroniques
compte utilisateurs 50 Enregistré 131
Configuration 134 environnement de production 7
configuration.php 20, 24 Envoi d’e-mails en nombre 129
connexion ADSL 53 ergonomie 35, 37, 39, 41, 46, 70, 71, 75, 77,
connexion Internet 51 79, 94, 139, 151, 159, 183, 194,
contacts 144, 149, 172, 179, 180 195
Contacts en vedette 144 espace d’administration 12, 17, 18, 30, 32, 36,
Content Management System Voir CMS 38, 42, 45, 48, 53, 54, 126, 166,
167
cookies 51, 168
espace de configuration 47
copie cachée 130
espace disque XIX, 23
copier 68
Exalead 159
corbeille 67, 88, 151, 253
extensions XXIII, 62, 171–173, 175, 176, 193,
création de comptes 134
231, 239, 240
créer un dossier 100
extensions autorisées 99
Créer un niveau d’accès 133
eyetracking 159, 194, 206
CSS 35, 37, 49, 86, 91, 149, 198, 199, 203,
206, 210, 230
CSS3 19 F
Facebook 59, 62, 115, 158
D Fade 227
Fenêtre-cible 147
Dailymotion 59, 112
feuille de style 37, 166
date de création 84, 148
fichier de configuration 48, 53, 57
date de modification 148 fil d’actualité 144, 181, 216
date de publication 84, 87, 148 fil d’Ariane 41, 195, 216
débogage 52 File Uploads 57
décompression 4 FileZilla 4, 10, 25, 32, 163
Déconnecter un utilisateur 129 filtrage par date relative 210
Découvrir 175 filtre de langue 232, 242
déplacer 68 filtres 63, 126, 176, 208
derniers inscrits 215 Finder 231
description du site 160 Firefox 5, 86, 168
design adaptatif 195 Flexslider 223, 224
développeurs 18 flux d’actualité 207, 219
déverrouillage 67, 88, 142, 251 flux RSS 48, 51, 75, 181
Display Errors 56 footer 195, 209
DNS 23 Format de date 74
Domain Name System Voir DNS format XML 181
données d’exemple 39, 63, 79, 83, 99, 108 formulaire de connexion 146, 207, 222
droits 75, 142 formulaire de contact 146
droits de publication 129 framework 18, 19, 43
droits légaux 161 front-office 36
droits sur les articles 85 FTP XIX, 3, 4, 12, 32, 54, 92, 103, 163, 165,
174
E fuseau horaire 54
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 259 — #283
✐ ✐
Index 259
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 260 — #284
✐ ✐
✐ ✐
✐ ✐
✐ ✐
“Meyer_72093” (Col. : 100 % Pratique) — 2015/2/24 — 18:22 — page 261 — #285
✐ ✐
Index 261
✐ ✐
✐ ✐