FORMATION A L’UTILISATION DE JOOMLA !

1. FORMATION A L’UTILISATION DE JOOMLA !

2. Qu’est ce que Joomla! • Joomla! est la transcription phonétique d'un mot swahili qui signifie "tous ensemble", ou  "en un tout". • Joomla! est un système de gestion de contenu (Content Management system) créé par une communauté internationale de développeurs. • Joomla! est un CMS Open Source distribué sous License GNU/GPL (gratuit) avec lequel vous pourrez mettre en ligne du contenu et mettre à disposition de vos visiteurs des services (forum, boutique en ligne, galerie photos,...), le tout sans connaissances particulières.

3. Logique de fonctionnement • Le front et Back site : • Le front est ce que l’internaute voit. • Le back est la modification des pages par le rédacteur. Je modifie le Back, le front est automatiquement mis à jour. • L’interface d’administration : • Toutes les modifications se font en temps réel dans l’interface d’administration accessible à partir d’une connexion Internet et d’Internet Explorer.

4. Schéma de fonctionnement de Joomla! (1/2) W.W.W. INTERNAUTE Ce que je publie est directement visible par l’internaute REDACTEUR

5. Schéma de fonctionnement de Joomla! (2/2) Le site est hébergé chez OVH W.W.W. La structure du site (Menu, archives…) est créée en temps réel sur la plateforme d’administration. Tous les articles sont rédigés directement sur la plateforme OVH. REDACTEUR

6. La trousse à outils • De quoi avons-nous besoin ? • Mise à jour des articles : • Une connexion Internet • Internet Explorer ou Firexox • Gestion de la bibliothèque d’images : • VSO Image Resizer (redimensionnement des images) • Filezilla (Copie des images par lot vers le Gestionnaire de Médias) pour les utilisateurs avertis.

7. L’accès aux modifications Adresse de modification pour 1 article déjà publié : http://www.cdhrc.fr/index.php?option=com_user&view=login Adresse de modification globale (ajout d’article, menu, agenda) : http://www.cdhrc.fr/administrator/index.php

8. Les mots de passe à conserver Serveur ftp : ftp.pro.ovh.net Login ouutilisateur : cdhrc Mot de passe : jA4CZfJW Identifiant manager OVH Adresse : http://www.ovh.fr/manager client : sm50269-ovh Votre mot de passe: 2aeoss7p

9. L’utilisation de l’interface d’administration • L’adresse de connexion est : • http://www.cdhrc.fr/administrator/index.php • Chaque rédacteur est identifié au site grâce à un nom d’utilisateur, et un mot de passe. • Les bons « identifiant » et « mot de passe » saisis dirigent le manager vers l’accueil de l’administration.

10. L’utilisation de l’interface d’administration Listedes rédacteurs connectés Permet de créer un nouvel article X1 X2 X3 X : rubriques utiles aux rédacteurs X1 : Reprenant tous les articles du site (visible ou non) PERMET DE CRÉER UN NOUVEL ARTICLE X2 : Liste des articles présents sur la page d’accueil uniquement (création, ordre, visible ou non) X3 : Gestion de la bibliothèque d’images

11. Généralités Joomla! Publier ou dépublier un article, menu… Modifier l’ordre d’affichage des articles, menus… Sélectionner un ou plusieurs articles, menus… pour effectuer une action particulière Ne jamais utiliser Précédent ou suivant de votre navigateur, toujours utiliser les boutons situés en haut à droite.

12. Créer un article 1/2 • Dans le panneau de contrôle, cliquer sur Créer un article Attention : un article doit être affecté à une section et une catégorie, préalablement créée. Il s’agit d’une arborescence de classement. Généralement, créer une section par menu et une catégorie (dont le nom est identique à la section).

13. Créer un article 2/2 Mettre un titre significatif à l’article Choisir la section et la catégorie correspondante à l’article Cocher publié et afficher en page d’accueil si c’est le cas Rédiger le texte

14. Import de texte provenant de WORD Copier le texte provenant de Word Dans l’article de Joomla! : 1 clic pour positionner le curseur à l’emplacement du collage Et un clic sur l’icône coller de Word Coller le texte dans la zone Puis OK Cocher les deux cases

15. Mise en conformité des photos 1/2Logiciel VSO Image Resizer • Gestion des photos : • Les impératifs : • Taille des images : horizontal (en paysage) : largeur : 250 pixels • Taille des images : vertical (en portrait) : largeur : 175 pixels • Format d’enregistrement : jpg • Les noms d’image ne doivent ni avoir d’espace, ni d’accent, ni ponctuation particulière hormis le – ou _ • Exemple : • château de la Ferté doit s’écrire : chateau_de_la_ferte.jpg ou chateau-de-la-ferte.jpg ou chateaudelaferte.jpg 250 pixels Exception : Les photos de l’accueil font : image horizontal : 140 px et 100 px en vertical 175 pixels

16. Mise en conformité des photos 2/2 Logiciel VSO Image Resizer • Comment mettre une photo dans les bonnes dimensions : • Une fois le logiciel VSO Image Resizer installé , faire un clic droit sur la photo ou les photos à redimensionner et choisir : VSO Image Resizer • -> Cette fenêtre apparait : • Choisir de modifier la largeur (si paysage) • Ou la hauteur (si portrait) • avec les paramètres préalablement vus • Mettre le % qualité à 100% • Puis choisir un dossier de stockage de • l’image. • Cliquer sur OK pour Valider • La nouvelle image à été crée au bon format. • Renommer la photo si nécessaire

17. Insérer une image 1/5 Pour insérer une photo : Cliquer sur l’icône Puis sur parcourir le serveur

18. Insérer une image 2/5 Si la photo existe sur le serveur OVH, la sélectionner à partir de son dossier. Pour charger une image du disque dur, la mettre à la bonne taille, se mettre dans le bon dossier sur le serveur et cliquer sur parcourir, une fois l’image selectionnée cliquer sur upload Pour créer un dossier, se mettre dans le dossier souhaité puis cliquer sur Create New folder, nommer et valider

19. Insérer une image 3/5 Créons un dossier Images et insérons une image à l’intérieur Un clicsur Create New folder Saisir le nom du dossier : Puis OK. Le dossier estcrée, L’ouvrir

20. Insérer une image 4/5 Ouvrir le dossier, cliquer sur parcourir Aller chercher l’image sur votre ordinateur (attention à la taille) Cliquer sur Ouvrir puis Upload Un clic sur la photo pourla sélectionner

21. Insérer une image 5/5 Choisir la position de l’habillage de la photo par rapport au texte. En option : une bordure noire autour de la photo Un espacement entre la photo et le texte Légender la photo

22. Créer un zoom sur une image L’image doit être importer dans sa taille « zoomée » Copier / coller l’adresse de l’image dans la zone lien Dans « informations sur l’image » définir Une largeur plus petite (selon la charte). Mettre la bordure à 0

23. Créer un lien vers un PDF (ou tout autre fichier) 1/1 Sélectionner le mot à lier Puis un clic sur l’icône lien Et sur Parcourir le serveur La création de dossiers, l’upload et la sélection du fichier est identique aux photos Une fois le lien réalisé, cliquer sur l’onglet destination Et choisir : ouvrir dans uneautre fenêtre

24. Modifier les Menus 1/3 Pour y accéder cliquer sur la barre de menus, dans rubrique Menu Il faut modifier le Menu_gauche et le Menu_haut.

25. Modifier les Menus 2/3 Les menus et sous-menus apparaissent avec leur hiérarchie. Un clic sur l’icone masque ou affiche le menu, l’ascenseur permet de modifier l’ordre

26. Modifier les Menus 3/3 Pour modifier le nom d’un menu ou sous-menu existant, cliquer dessus Puis changer le nom Cliquer sur sauver La position dans le menu peut être choisi en cliquant sur le nouveau menu Haut = nouveau menu Attention : Si vous sélectionnez un sous-menu, le menu sera positionné en sous-sous menu

27. Créer un nouveau menu 1/1 Préambule : L’article à intégrer dans le menu doit être préalablement crée. Choisir le menu dans lequel l’intégrer et cliquer sur nouveau (voir modifier un menu 1/3) Cliquer sur Article Cliquer sur sauver, le menu est actif Nommer le menu Le lier à un article Et choisir sa position Position Haut = nouveau menu Menu existant = sous-menu

28. Modifier directement les pages en ligne 1/2 Se connecter avec ses identifiants et mots de passe à l’adresse : http://www.cdhrc.fr/index.php?option=com_user&view=login Ouvrir la page à modifier et cliquer sur l’icône de modification :

29. Modifier directement les pages en ligne 2/2 Effectuer les modifications à l’aide du traitement de textes en ligne, puis cliquer sur enregistrer, la page est à jour.

30. Rappels éléments importants 1/2 Déverrouiller un article Attention un article verrouillé peut être un article en cours de modification, dans ce cas s’assurer que l’auteur n’est pas en ligne en cliquant sur accueil et en regardant dans le panneau de droite sur l’onglet connectés Puis aller dans le menu Outil et cliquer sur Validation générale

31. Rappels éléments importants 2/2 Mettre des mots clefs facilitant le référencement dans Google Ouvrir l’article (par le back-site) Et cliquer sur l’onglet Méta Info Description : La description affichée par google Les mots clefs sont ceux référencés par Google les séparer par une virgule Cliquer sur Sauver comme pour enregistrer un article Ajoute le nom de la section, catégorie et titre de l’article en lieu et place des mots clefs

32. Sauvegarder le site 1/2 Aller dans le composant Joomlapack Et cliquer sur Sauvegarder

33. Sauvegarder le site 2/2 Sauvegarder le site et les bases de données Une fois les deux éléments sauvegardés il faut les télécharger sur son disque dur. Retourner dans le control Panel sur Joomla Pack Et cliquer sur Gérer les Sauvegardes Cliquer sur Télécharger pour chaque élément Et les enregistrer sur votre disque dur

34. Nous contacter Société ALTAÏS Immeuble le Lafayette 7, Rue Vieille Levée 45100 ORLEANS Tél : 02 38 72 50 50 Fax : 02 38 72 50 60 8 rue Honoré de Balzac 37000 TOURS Tél : 02 47 60 65 55