Version janvier 2014

1. Développement de sites collaboratifs avec DrupalJour 1Marc-Gabriel Vallièresmvallieres@cmaisonneuve.qc.caRessources du cours:http://profs.cmaisonneuve.qc.ca/mvallieres/Drupal Version janvier 2014

2. Plan • Jour 1 : Développement avec Drupal 1. Introduction aux systèmes de gestion de contenu 2. Génération d'un site Drupal 3. Choix d'un thème 4. Développement d'un site web de base 5. Recherche de contenu 6. TP : développement d'un site de diffusion d'information pédagogique 7. Utilisation des forums de discussion

3. Plan • Jour 2 AM : Fonctions de webmestre 1. Gestion des utilisateurs et des droits 2. Gestion des menus et des blocs 3. Définition et gestion des types de contenus 4. Gestion des forums de discussion • Jour 2 PM : Sites web collaboratifs • Types de contenus spécialisés • Gestion des téléchargements et fichiers de médias • Exemple 1 : développement d'un wiki • Exemple 2 : pages de présentation des étudiants • TP : Ajout de fonctions collaboratives au site du jour 1...

4. Thème 1 Les systèmes de gestion de contenu Jour 1 – thème 1

5. HTML (+ CSS, JavaScript, applets Java, Activex, etc.) ou Logiciel de génération de pages (MS Frontpage, MS Expression Web, Dreamweaver, etc.) Site web statique Le web traditionnel Jour 1 – thème 1

6. Les systèmes clients-serveur Côté serveur Côté client Programme de génération de pages (php, .NET, etc.) Pages web générées en temps réel Base de données Jour 1 – thème 1

7. Que fait-on si ? • Le contenu est changeant dans le temps (sites des organismes de presse, etc.) ? • Le site doit être participatif (les utilisateurs sont des fournisseurs de contenu, doivent pouvoir ajouter des commentaires, modifier des contenus d'autres utilisateurs, etc.) ? • Il faut gérer les accès (différents utilisateurs doivent avoir accès à des infos différentes ou effectuer des actions différentes) ? Jour 1 – thème 1

8. Le contenu est temporel ? Jour 1 – thème 1

9. Le site doit être interactif ? Jour 1 – thème 1

10. Le contenu change selonl'utilisateur ? Jour 1 – thème 1

11. On devait autrefois : • Développer des applications serveurs (MS Visual Studio / .NET, PHP, Java, etc.) ou • Utiliser des applications spécialisées : • babillards (phpBB, etc.) • blogs (WordPress, etc.) • wikis (TikiWiki, MediaWiki, Pimki, TomBoy, etc.) • documents collaboratifs (GoogleDocs) Jour 1 – thème 1

12. Les systèmes de gestion de contenu • Permettent le développement rapide d'applications web par les spécialistes du contenu, plutôt que par des informaticiens • Le contenu peut être dynamique (en temps réel) • Le contenu peut être participatif (plusieurs «fournisseurs» ou sources de contenu) • Les utilisateurs peuvent être authentifiés au besoin • Le contenu / les actions peuvent différer par classe d’utilisateurs • Le contenu peut être de multi-formats (pages web, documents .doc/.pdf/.xls/etc., graphiques, photos, vidéo, audio...) • Des modules peuvent, dans certains cas, être ajoutés pour des fonctions spécialisées (gratuiciels, modules commerciaux, développement personnalisé) • Certains logiciels de gestion de contenu peuvent être interfacés par des systèmes informatiques d'entreprise Jour 1 – thème 1

13. Deux types • Les plate-formes («frameworks») de gestion de contenu (MS Sharepoint et Drupal) - Incluent les fonctions de base - Permettent l'ajout de fonctions personnalisées - Prévoient des interfaces avec divers SGBD - Permettent de développer des interfaces avec des systèmes informatiques d'entreprises (modèle MVC, par exemple) • Les logiciels de gestion de contenu - Ne comportent que des fonctions de base, sans ajout de fonctions personnalisées Jour 1 – thème 1

14. Quelques produits • MS Sharepoint : produit commercial, orienté «entreprise» et «documents», autant pour l’intranet, l’extranet que les sites webs publics – le contenu est généré par Office. L'infrastructure doit être gérée par des spécialistes. Requiert des ressources matérielles importantes. • Drupal : logiciel libre et enfichable. L'installation et la gestion peuvent être effectuées par des non-spécialistes, si aucun développement n'est requis. Ne demande que peu de ressources matérielles. • Quelques logiciels orientés web : - La suite WordPress (blogs) + bbPress (babillards) + BuddyPress (réseautage social)… - TYPO3, Joomla! (et son prédécesseur Mambo), etc. Jour 1 – thème 1

15. Drupal vs Moodle vs LÉA • LÉA s'adresse aux utilisateurs des cours-groupes d'un même prof à une seule session; les utilisateurs doivent avoir un accès Omnivox. • Moodle est orienté cours à une seule session; les utilisateurs doivent aussi avoir un accès au système. La persistance des informations requiert des manipulations. • Drupal n'a aucune restriction par défaut; le développeur peut définir les accès qu'il désire. Jour 1 – thème 1

16. Usages pédagogiques de Drupal • Site permanent pour un cours • Site pour une séquence de cours • Site d'activités non reliées à un cours / groupe d'intérêts (SIG) (c.f. un groupe des utilisateurs de Linux) • Site d'aide par les pairs / Centre d'aide virtuel (c.f. un forum de discussion sur le langage de programmation C#) Jour 1 – thème 1

17. Site où les étudiants construisent une base de connaissances de façon collaborative (c.f. une banque d'oeuvres d'art commentées) • Plus de latitude pour gérer les accès (c.f. les étudiants du cours 201 d'un programme donné pourraient conserver un accès aux notes du cours 101) Jour 1 – thème 1

18. Avantages face aux sitesweb traditionnels • Possibilité d'interactions (c.f. forums de discussion) • Possibilité de sites collaboratifs (c.f. wikis) • Plus aisé pour l'enseignant de conserver les acquis des sessions précédentes (on ne recommence pas à chaque session...) • Facile de gérer les accès à des sections de cours sans ajouter ou retirer l'information Jour 1 – thème 1

19. Eh oui! Y'a des inconvénients... • L'accès à certaines fonctions par les étudiants pourrait ouvrir une boîte de Pandore... (c.f. l'accès au multimédia, vidéo, etc. donne accès au HTML complet...) • Les nouvelles fonctions de «modérateur» de l'enseignant peuvent devenir fastidieuses... (il y a des «trolls» même au cégep!) • Peu de documentation claire disponible; il faut être un peu «hacker» pour bien se débrouiller! Jour 1 – thème 1

20. Questions à se poser avantde commencer... • Quelles fonctions veut-on utiliser ? Si une seule fonction est nécessaire (ou deux...), il est plus simple d'utiliser des logiciels spécialisés (blog, wiki, babillard). On peut s'abonner à un service gratuit (blogspot...) où la gestion à effectuer sera minimale. Exemple: http://juliepellerin.blogspot.com • Veut-on prévoir une croissance du site ? Si on prévoit ajouter éventuellement de nouvelles fonctions requérant un peu de programmation, un système de gestion de contenu plus sophistiqué sera nécessaire. Jour 1 – thème 1

21. Thème 2 Génération d'un site Drupal Jour 1 – thème 2

22. Matériel et logiciels requis • Serveur Linux, Windows ou Mac • Service web Apache (recommandé) ou MS-IIS • Interpréteur de langage PHP • Base de données MySQL (recommandée) • Nom de domaine (si un accès web est requis) • Au collège : pré-installé par le Service informatique (Jérôme Charaoui) • Fournisseurs de services : parfois pré-installé Jour 1 – thème 2

23. Accès au site test • Votre URL et le mot de passe du webmestre vous ont été distribués http://pfmnn.aegir.cmaisonneuve.qc.ca • Ce site demeurera actif pour environ un mois • Communiquez avec Jérôme Charaoui si vous désirez le convertir en un site permanent pour votre département ou pour un projet spécial (aide@cmaisonneuve.qc.ca) Jour 1 – thème 2

24. La page d'accueil du site Jour 1 – thème 2

25. Le menu du webmestre N'apparaîtra pas pour les autres utilisateurs Jour 1 – thème 2

26. Thème 3 Choix d'un thème Jour 1 – thème 3

27. Thèmes disponibles • Choisissez un ou plusieurs thèmes dans la bibliothèque de Drupal : http://drupal.org/project/themes • Demandez au Service de l'informatique de l'ajouter à votre site. • Activez le thème désiré avec l'onglet «Apparence» du menu du webmestre Il est possible de développer votre propre apparence en choisissant le thème «Zen». Jour 1 – thème 3

28. Paramètres du site • Activez le thème désiré avec l'onglet «Apparence» du menu du webmestre • Entrez le nom du site et le slogan avec le lien «SYSTÈME > Informations» de l'onglet «Configuration» du menu du webmestre • Chargez le logo du site avec le lien «Paramètres» du thème actif dans l'onglet «Apparence» du menu du webmestre Jour 1 – thème 3

29. Paramètres du thème actif Attention ! Les paramètres dépendent du thème choisi ! • Schéma de couleur • Affichage de certains éléments • Chargement du logo • Chargement de l'icône («favicon») • (des logos et un favicon sont sur la page des ressources du cours)

30. Thème 4 Développement d'un site Jour 1 – thème 4

31. Les types de contenu • Une nouvelle est un court texte dont le résumé apparaîtra sur la page d'accueil du site • Une page de base est une page web qui apparaîtra ou non dans un menu. Si elle n'est pas accessible par un menu, elle pourra être affichée soit par un hyperlien dans une autre page, soit par la fonction «Recherche» Jour 1 – thème 4

32. Création d'une page de base • Une page de base est une page web qui apparaîtra ou non dans un menu. Si elle n'est pas accessible par un menu, elle pourra être affichée soit par un hyperlien dans une autre page, soit par la fonction «Recherche» • Dans le bloc «Navigation», choisissez «Ajouter du contenu» et le type «Basic page» • Donnez un titre à la page (requis) Jour 1 – thème 4

33. Jour 1 – thème 4

34. Jour 1 – thème 4

35. Les outils de mise en page sont les mêmes que dans un traitement de textes... Jour 1 – thème 4

36. Les outils de liens permettent de créer des hyperliens externes et internes... Jour 1 – thème 4

37. Si la page doit figurer au menu Jour 1 – thème 4

38. Création d'une nouvelle • Les nouvelles sont habituellement affichées sur la page d'accueil du site (on pourra configurer la page d'accueil différemment!) • Dans le bloc «Navigation», choisissez «Ajouter du contenu» et le type «Article» • Donnez un titre à la nouvelle (requis) Jour 1 – thème 4

39. Le résumé de l'article(pour la page d'accueil) Jour 1 – thème 4

40. Les commentaires des utilisateurs Jour 1 – thème 4

41. La publication de la nouvelle Jour 1 – thème 4

42. Numéro de la page • Chaque page et/ou nouvelle a un numéro unique qui figure dans l'URL de la page Jour 1 – thème 4

43. Liste des pages et des nouvelles • Le webmestre a accès à une liste des pages par son menu «Contenu» Jour 1 – thème 4

44. Thème 5 Recherche de contenu Jour 1 – thème 5

45. L'indexation s'effectue en arrière-plan selon un horaire prédéterminé • Valeur par défaut : aux trois heures! Jour 1 – thème 5

46. L'indexation peut être forcée par le webmestre au moyen de l'élément «RECHERCHE ET MÉTADONNÉES > Paramètres de recherche» du menu «Configuration» Jour 1 – thème 5

47. L'intervalle d'indexation peut être modifiée par le webmestre au moyen de l'élément «SYSTÈME > Cron» du menu «Configuration» Jour 1 – thème 5

48. Thème 6 Travail pratique : développement d'un site de diffusion d'information pédagogique (le document est sur la page de ressources du cours) Jour 1 – thème 6

49. Thème 7 Utilisation des forums de discussion Jour 1 – thème 7

50. Dans la liste de forums suivante : «Généralités, règlements, annonces» et «Programmes informatique» sont des conteneurs de forums, alors que «Règlements», etc. sont des forums. Jour 1 – thème 7