Le développement d’un cours en ligne avec la plateforme ...ressources.cfadf.com/coursfad/joomla/GuideJoomla25.docx · Web viewINSTALLATION DE JOOMLA 2.1) Installation sur un ordinateur

CREATION D’UN SITE WEB AVEC JOOMLA

Dr René-Yves HERVÉ

Ce guide est un résumé des principales fonctionnalités du Système de Gestion de contenus «JOOMLA» (CMS pour Content Management System) dans le but de créer et de gérer un Site

Dynamique.

TABLE DES MATIÈRES

I. GÉNÉRALITÉS1.1) Présentation 1.2) Documentation1.3) Concepts généraux

II. INSTALLATION DE JOOMLA2.1) Installation sur un ordinateur local 2.2) Installation sur un hébergeur2.3) Le sept étapes de l’installation

III. CONSOLE D’ADMINISTRATION3.1) Actions courantes sur la console 3.2) Les menus principaux de la console

32.1) Site32.2) Utilisateurs32.3) Menus32.4) Contenu32.5) Composants32.6) Extensions

IV. GESTION DES ARTICLES4.1) Paramètres généraux 4.2) Création des catégories4.3) Création des articles 4.4) Articles en vedette

V. GESTION DES MENUS5.1) Création d’un menu 5.2) Ajout d’éléments dans un menu

VI. GESTION DES EXTENSIONS6.1) Les composants 6.2) Ajout d’extensions6.3) Suppression d’extensions

VII. GESTION DES MODULES ET DES TEMPLATES7.1) Les modules 7.2) Le template JSN

VIII. SAUVEGARDE ET RESTAURATION DU SITE8.1) Sauvegarde par la méthode directe 8.2) Restauration par la méthode directe

Guide de JOOMLA /27 © www.cfadfrancophone.org

I. GÉNÉRALITÉS

1.1) PRÉSENTATION DE JOOMLADans les années 90, les sites Internet étaient des sites statiques : une page d’accueil avec des pages html non générées par un langage de programmation. Depuis maintenant plusieurs années, la norme est aux sites dynamiques, dans lesquels les pages qui les composent sont générées par des programmes, selon les requêtes des internautes. Parmi les composants techniques, les plus utilisés sont les COMPOSANTS OPEN SOURCE :

Système d’exploitation : Linux; Serveur Eb : Apache; Langage de programmation PHP; Base de données : MySQL.

Cette structure se retrouve chez la plupart des hébergeurs. Dans le présent document, nous ferons références à l’hébergeur «1and1». Dans cette vague, se sont développés les CMS (Système de Gestion de Contenu, en anglais : Content Management System) : Joomla est une système de gestion de contenu qui permet de créer des sites Internet Dynamiques. «Joomla» est la transcription phonétique d'un mot swahili qui signifie «tous ensemble». WordPress est un CMS, qui permet, comme Joomla de créer des sites Internet. Moodle et Claroline sont des CMS utilisés pour la formation à distance. Spip est un CMS pour la gestion d’un journal d’information en ligne.L’idée fondamentale des CMS est de séparer tous les objets insérés dans les pages web (textes, images par exemple) de leur mise en forme (choix des polices de caractères, des couleurs et de l’habillage graphique. Les contenus sont stockés dans une base de données (MySQL), alors que les directives relatives à la présentation se trouvent des feuilles de styles. Sur Joomla, les modifications des feuilles de styles s’effectuent dans le template.


1.2 DOCUMENTATIONJoomla met à la disposition des utilisateurs des documents pdf qui peuvent s’avérer très utiles: documents pour l’installation du logiciel, documents généraux, documents sur les serveurs locaux et documents sur les extensions.

12.1) DOCUMENTS D’INSTALLATION Guide d'installation de Joomla

12.2) DOCUMENTS GÉNÉRAUX Guide de l’administration joomla Les contenus dans Joomla Bases de l’adminsitration Joomla

1.3 CONCEPTS GÉNÉRAUX

Les deux grands espaces de JoomlaL’espace de travail avec la console d’administration: back-endLe Site (ce que voient les visiteurs) : front-end

Les articlesCe sont les unités de contenus : textes, images, liens, etc…Ils peuvent être catégorisés (catégories et sous-catégories) ou non catégorisés.

Le modèle ou templateIl fixe les espaces où se trouvent les articles, les modules et les menus.Il renferme les feuilles de styles pour la présentation du contenu.

Les extensions Les DOSSIERS et les


Composants : Mini-applications intégrées (com_content, com_registration); le cœur du logiciel est le noyau.Modules : blocs que l’on retrouve autour du corps de la page.Plugs-in : Morceaux de codes activés sur un événement.

L’Éditeur WYSIWYG : pour éditer les articles.

Le Core-Team : Équipe de bénévoles en charge du développement de la Source.

Les joomleurs : Tous ceux qui à travers le monde utilisent Joomla pour créer des Sites Dynamiques.

FICHIERS de Joomla


II. INSTALLATION DE JOOMLA Pour installer Joomla, i l faut un serveur web, une base de données et un logiciel de transfert de données ftp (dreamweaver ou File Zila par exemple).

2.1) INSTALLATION SUR UN ORDINATEUR LOCAL1. Télécharger la dernière version de WampServer :2. Après l’installation, l’icône de WampServer apparaît sur l’écran

en bas à gauche.3. Créer le répertoire pour placer tout le site

(«wamp/www/siteMonDomaine/»).4. Télécharger la dernière version stable de joomla et la

décompresser dans le répertoire «wamp/www/siteMonDomaine/».

5. Après un clic gauche sur WampServe, un menu s’ouvre.6. Cliquer sur phpMyAdmin pour créer la Base de données.7. Cliquer sur LocalHost pour démarrer les sept étapes de

l’installation (voir le paragraphe 3.3).8. Éventuellement copier les fichiers php.ini et .htaccess

nécessaires. Installation terminée.

2.2) INSTALLATION SUR UN HÉBERGEUR1. À la racine de l’espace sur l’hébergeur créer un répertoire pour placer tout le site («siteMonDomaine»).2. Télécharger la dernière version stable de joomla : «joomla_xxxx.zip», la transférer avec Dreamweaver ou

File Zila sur le serveur et la décompresser dans le répertoire «siteMonDomaine».3. Dans l’espace «MySQL» du serveur créer la base de données en notant les renseignements suivants : nom

de la base de données, nom de l’hôte, login et mot de passe.4. Aller à l’adresse «http://www.MonDomaine/siteMonDomaine/Installation/» pour réaliser les sept étapes

de l’installation (voir le paragraphe 3.3).5. Éventuellement copier les fichiers php.ini et .htaccess nécessaires. Installation terminée.

2.3) LES SEPT ÉTAPES DE l’INSTALLATION

ÉTAPE 1

CHOIX DE LA LANGUE


ÉTAPE 2

PRÉ-INSTALLATION

ÉTAPE 3

ACCEPTATION

DE LA

LICENCE

ÉTAPE 4

BASE DE DONNÉES


ÉTAPE 5

CONFIGURATION FTP

ÉTAPE 6

CONFIGURATION

ÉTAPE 7

TERMINER

Après avoir supprimé le répertoire «Installation», on peut aller soit sur le Site, soit sur la console d’administration.


III. CONSOLE D’ADMINISTRATION Après avoir établi la connexion avec l’administration (http://www.MonDomaine/DossierMonDomaine /administrator/) : on arrive sur la console d’administration sur le back-end:

La console d’administration comprend: Dans la partie supérieure : un menu général (Site, Utilisateurs, Menus, Contenu, composants, Extensions,

Aide), l’icône «Site», l’icône «Admin», l’icône avec le nombre de courriers arrivés et permettant d’accéder à la messagerie, le lien «Site» vers le front-end et l’icône de déconnexion .

Sur la gauche : les icones donnant accès aux fonctions essentielles de Joomla . Sur la partie droite : les 5 derniers utilisateurs, les 5 articles les plus consultés et les 5 derniers articles ajoutés.

3.1) LES ICONES DE LA CONSOLE D’ADMINISTRATION

Ce sont les icones qui donnent accès aux opérations les plus fréquemment utilisées sur la console d’administration:1. Ajout d’articles;2. Gestion des Articles;3. Gestion des catégories;4. Gestion des médias;5. Gestion des menus;6. Gestion des utilisateurs;7. Gestion des modules;8. Gestion des extensions;9. Gestion des langues;10. Paramètres de configuration de la console;11. Gestion des templates;12. Modification du profil de l’utilisateur connecté.


32) LES MENUS DE LA CONSOLE

32.1) SITE

Quand on clique sur Site dans la console d’administration, on a accès aux liens vers le panneau d’administration, le profil, la configuration, la maintenance et les informations du système.


32.2) UTILISATEURS

Quand on clique sur Utilisateurs dans la console d’administration, on a la gestion des groupes, les groupes d’utilisateurs, les niveaux d’accès, les notes aux utilisateurs, les catégories de notes et l’expédition de courriels en nombre.

32.3) MENUS : Gestion des menus (affiche la liste complète de tous les menus existants), Corbeille de menu (pour supprimer un menu), Main Menu (le menu principal et tous les menus secondaires créés par le concepteur du Site (TopMenu). La gestion des menus est vue en détail dans le paragraphe VII.

32.4) CONTENU : Gestion des articles, Gestion des catégories, Articles en vedette pour la page d’accueil et Gestion des médias. La gestion du contenu est vue en détail dans le paragraphe VI.


32.5) COMPOSANTS : Bannière, Contacts, Fils d’actualités, JCE (éditeur supplémentaire que l’on peut installer), Liens web, Messagerie privée, Recherche, Recherche avancée et Redirection.

La gestion des composants est vue en détail dans le paragraphe VIII.

32.6) EXTENSIONS : Installer ou désinstaller une extension, gestion des modules, gestionnaire des plugins, gestionnaire des templates, gestion des langue .

La gestion des extensions est vue en détail dans le paragraphe IX.


32.7) AIDE : Aide de Joomla, Forum de support officiel, Forum joomla.fr, Forum officiel français, Documentation Wiki, Liens utiles Joomla.

IV. GESTION DES ARTICLESDans les versions 1.5, le contenu était hiérarchisé en sections et en catégories avec un seul niveau de catégories, ce qui était souvent insuffisant.

Avec les versions suivantes, les sous-catégories sont apparues.

Dans les versions 2.5, on ne parle plus de sections et on peut utiliser le nombre de catégories que l’on veut.


Les catégories et sous-catégories sont des conteneurs et les articles renferment le contenu (ici les safaris, les activités, les randonnées ou les villes).

C’est avec le contenu que commence véritablement la conception du Site. Il faut réaliser dans l’ordre les opérations suivantes :

1. Définir, si ce n’est pas fait encore, les PARAMÈTRES GÉNÉRAUX (dans le menu Site de la console d’administration).

2. Définir les paramètres généraux des articles.3. Créer les catégories et éventuellement les sous-catégories.4. Créer les articles


4.1) PARAMÈTRES DES ARTICLES

Il faut cliquer sur l’icône pour obtenir la fenêtre qui permet de rentrer tous les paramètres des articles.


4.2) CRÉATION DES CATÉGORIES

En cliquant sur «Contenu/Gestion des catégories» dans la console d’administration, on arrive à la page de gestion des catégories :

On peut ajouter une nouvelle catégorie

( ), modifier les catégories

existantes ( ), les publier ( )

ou les dépublier ( ) , les archiver (

), les déverrouiller ( ) ou les

mettre à la corbeille( ).

Il est possible aussi de copier ou déplacer les catégories existantes (en bas de la page de gestion des catégories).


4.3) CRÉATION DES ARTCLESEn cliquant sur «Contenu/Ajout d’articles» dans la console d’administration, on arrive à la boîte de création d’articles :

Pour créer un nouvel article, il faut:

1. Écrire le titre de l’article.2. Sélectionner une catégorie.3. Indiquer si l’article est publié, non publié ou archivé.4. Définir les droits (personnes qui auront le droit de lire cet article).5. Indiquer si l’article doit figurer sur la page d’accueil.6. Dans la boîte de l’éditeur, entrer toutes les données de l’article.7. Indiquer le nom du créateur de l’article.8. Indiquer les dates : création, début et fin de publication.9. Éventuellement vérifier les paramètres de l’article et entrer les métadonnées.


Sur les articles existants on peut effectuer plusieurs opérations : les modifier l’article, les publier ou le dépublier, les placer sur la page d’accueil (en vedette), les archive , les déverrouiller ou les placer dans la corbeille :

On peut aussi les déplacer ou les copier (en bas de lapage de gestion des articles) :

4.3) ARTICLES EN VEDETTEEn cliquant sur «Contenu/Articlesenvedette» dans la console d’administration, on arrive à la page qui permet d’organiser la présentation de la PAGE D’ACCUEIL.

On peut ajouter les articles catégorisés ou non que l’on veut voir figurer sur la page d’accueil.


V. GESTION DES MENUS

Dans la console d’administration, quand on clique sur «Menus/Gestion des menus», on obtient la liste des menus existants.

5.1) CRÉATION D’UN NOUVEAU MENU

Pour créer un nouveau menu, il faut cliquer sur et donner son titre (Organisation du syndicat dans notre exemple), le type de menu (dans notre exemple : organisationsyndic) et la description (dans notre exemple : Menu secondaire)


5.2) AJOUT DES ELEMENTS DANS UN MENU

Il faut d’abord sélectionner le menu, soit en cliquant sur «Menus/Gestion des menus» dans le menu de la console d’administration, puis en double cliquant sur le menu que l’on veut modifier, soit en cliquant directement sur le nom du menu, comme par exemple «Menus/PARTENAIRES».

Dans un premier temps, on sélectionne le type d’élément de menu en cliquant sur le bouton «Sélection».

Par la suite, donner le titre du lien, vérifier le statut (publié ou non publié), définir l’accès (Accès public, enregistré ou spécial), définir l’élément parent si l’on veut hiérarchiser le menu, éventuellement préciser les paramètres du type de lien, définir des métadonnées pour ce lien ou affecter des modules à ce lien.


VI. GESTION DES EXTENSIONS

6.1) LES COMPOSANTS

Six composants sont déjà installés dans JOOMLA 2.5: Bannières, Contacts, Fils d’actualité, Liens Web, Messagerie privée, Recherche, Recherche avancée et Redirection. Les gestions sont analogues dans tous les composants. Voicià titre d’exemple la gestion des fils d’actualité.

Comme dans la gestion des articles et des menus, les copies et les déplacements d’items sont réalisées en bas de la page. Il est possible d’ajouter d’autres composants, comme le composant «JCE» qui est un éditeur d’articles. On remarque que le composant «Sondage» a disparu) il est possible de télécharger un composant gratuit pour le remplacer : «JVoteSystemModule».


Le menu «Extension» donne accès à quatre liens :• Gestion des extensions pour installer et désinstaller les composants et les modules.• Gestion des modules qui sera reprise dans le thème suivant.• Gestion des plug-ins.• Gestion des templates qui sera reprise dans le thème suivant.• Gestion des langues

6.2) INSTALLATION DES EXTENSIONS On clique sur «Extension/Gestion des extension» dans la console d’administration, il est possible alors d’installer ou désinstaller des composants, des modules, des plugins, des langues ou des templates.

6.3) DESINSTALLATION DES EXTENSIONS


VII. GESTION DES MODULES ET DES TEMPLATES7.1) LES MODULESLes modules sont placés autour du contenu dans différentes parties qui dépendent du modèle (template) utilisé. Quand on clique sur «Extension/Gestion des modules» dans la console d’administration, on arrive sur la page qui permet de gérer tous les modules installés.

Comme pour les articles et les menus, les traitements de déplacement et de copies de modules sont réalisés en bas de la

page. On peut ajouter de nouveaux modules en cliquant sur l’icône «Nouveau» ( ).


Si l’on veut, par exemple, que les menus qui ont été créés, soient vus sur le site, il faut créer des modules dans les positions où on veut les voir et les assigner aux pages web où ils doivent se trouver. Il est possible de créer des modules de toutes sortes en choisissant «Contenu personnalisé».Dans un premier temps, il faut rentrer les paramètres du module : le titre, la position, le statut (publié ou non publié), les dates de début et de fin de publication, les options de base et éventuellement les options avancées comme le suffixe de classe CSS.

Dans un premier temps, il faut assigner le module aux pages web où on veut le voir apparaître.


7.2) LE TEMPLATE JSN_EPIC

Parmi les nombreuses ressources de modèles sur Internet, l’une d’elle est particulièrement intéressante : le template «jsn_epic_pro_unlimited_j2.5_4.3.0_install». Le template (version PRO) donne un accès rapide aux opérations courantes :

• Réglage sur le logo (sélection de l’image, lien et slogan). • Largeur du template.• Largeur des quatre colonnes: droite, intérieur droite, gauche et intérieur gauche.

Le template (version PRO) est accompagné de deux guides fort bien détaillés : • Le guide de départ rapide (36 pages). • Un manuel pour aider à personnaliser le Site (53 pages).

Le template JSN comprend de nombreuses régions pour les modules:

• Partie supérieure: logo , top, mainmenu, toolbar, promo gauche, promo, promo droite.

• Partie centrale: deux colonnes à gauche (gauche et intérieur gauche), le body (breadcrump, user-top, user 1 et 2, mainbody-top, mainbody pour les articles, mainbody-bottom, user 3 et 4, user-bottom et banner), deux colonnes à droite (intérieur droite et droite).

• Partie inférieure: user 5, 6 et 7, footer et bottom


Le site du CFADF utilise le template JSN_pro.

Dans la partie supérieure, il y a le logo dans la région «LOGO», le drapeau canadien dans la partie «TOP», le menu principal dans la région «MAINMENU», un outil dans la région «TOOLBAR» et un diaporama dans la région «PROMO».

Dans la partie centrale, il ya trois modules (un compteur, un module personalisé et le module QUI EST EN LIGNE) dans la région «COLONNE DE GAUCHE» et deux modules (un module de menu et un module RSS) dans la région «COLONNE DE DROITE»


VIII. SAUVEGARDE ET RESTAURATION DU SITE

Il est recommandé d’effectuer régulièrement une sauvegarde du site et de la base de données:• Soit en utilisant un outil comme Akeeba.• Soit en le faisant directement sur le serveur.

La méthode directe consiste à compresser sur le serveur le dossier qui renferme tous les fichiers de Joomla. Par mesure de sécurité, le fichier compressé est conservé aussi sur un support externe.

Parallèlement, on prend une copie de la base de données que l’on conserve également sur un support externe.

8.1) MÉTHODE DIRECTE DE SAUVEGARDE

Sur le serveur, on compresse le répertoire contenant tous les fichiers de Joomla en un fichier compressé «sahel 15mai2013».

Le fichier compressé «sahel 15mai2013» est conservé sur le serveur dans un dossier «archives» et également sur un support externe.

Sur le CPanel du serveur, on crée une nouvelle Base de données «archive15mai2013», en cliquant sur «NewDatabase».


On clique sur le bouton «phpMyAdmin» de la base de données dont on veut exporter toutes les tables.

On sélectionne toutes les tables et on les exporte dans la Base de données «archive15mai2013»,

8.2) METHODE DIRECTE DE LA RESTAURATION

Elle se déroule en trois étapes:

1. Décompresser le fichier compressé «sahel15mai2013» dans un nouveau répertoire «sahel15mai2013» .

2. Dans le fichier «config.php», mettre à jour les données:• Base de données «archive15mai2013» pour les variables: public $host , public $user, public

$password , public $db.• Localisation du répertoire «sahel15mai2013» pour les variables: public $log_path,

/homepages/, et public $tmp_path .

3. Faire pointer le nom de domaine sur le répertoire «sahel15mai2013»


Documents

Le développement d’un cours en ligne avec la plateforme ...ressources.cfadf.com/coursfad/joomla/GuideJoomla25.docx · Web viewINSTALLATION DE JOOMLA 2.1) Installation sur un ordinateur