Quatrième étape du projet du cours Services et Technologies Multimédia.

1. Projet « PPCM »
Plateforme de Partage
de Contenus Multimédia
Développement d’une plateforme
de diffusion et de partage de
contenus multimédia

2. Situation
• 1ère activité:
▫ Comprendre le fonctionnement d’une plateforme
de partage de photo: la photothèque de l’UniGe.
▫ Etudier d’autres plateformes:
wikimédiacommons, flickr, px500 et visualrecipes.

3. Situation
• 2èmeactivité:
▫ Comprendre le fonctionnement global de Drupal
et de DrupalGardens
▫ Choisir le thème de votre plateforme de partage de
contenus multimédias
 Définir les métadonnées pour les contenus et les
contributeurs.
▫ Implémenter la ligne graphique (thème) de votre
plateforme.

4. Situation
• 3èmeactivité:
▫ Adapter le type de contenu « media gallery » de
DrupalGardens
 En y ajoutant les métadonnées sous forme de fields.
▫ Adapter le profil des utilisateurs
 En y ajoutant les métadonnées sous forme de fields.
▫ Tester le résultat
 En créant un utilisateur contributeur
 En ajoutant des exemples de collections de photos.

5. Et maintenant ?
• Maintenant: la 4ème étape
▫ Il faut adapter votre plateforme pour permettre à
vos visiteurs de naviguer sur la plateforme pour
découvrir les contenus.
▫ Pour cela, il faut leur donner différents « points
d’entrée » qui leur permettront de chercher, de
parcourir et de sélectionner des contenus.
▫ Ces points d’entrée se construisent à partir de
métadonnées.

6. Comment ?
• Pour cela nous allons utiliser
▫ Les blocs
▫ Les menus
▫ Les vues (views)
• Les blocs permettent d’afficher des contenus, des
résultats, des menus… et de les placer à l’intérieur
du thème
• Les menus permettent de naviguer à l’intérieur du
site et donner accès aux fonctionnalités.
• Les vues permettent de construire des sélections de
contenus selon des critères (filtres, tris…)

7. Page d’accueil
• Le premier point d’entrée: la page d’accueil
▫ Par exemple
 Configurer la page d’accueil pour qu’elle affiche la
liste des contenus triés par date.
 A visionner:
 http://youtu.be/XqRgNJ8zbSw
 Cette vidéo montre comment configurer la page
d’accueil.

8. Les blocs
• Les blocs:
▫ Certains modules créent un ou plusieurs blocs qui
affiche des résultats/informations du module qu’il
est ensuite possible d’activer.
▫ Vous pouvez créer vos propres blocs.
▫ La création d’un menu ou d’une vue entraîne la
création d’un bloc permettant de rendre le menu
ou la vue accessible par un bloc.

9. Les blocs
• La liste des blocs est organisée par régions
▫ Chaque région correspond à une zone
« géographique » de votre thème.
• Plus une liste de blocs « disabled »
▫ Qui comprend les blocs existants mais qui ne sont
pas activés.
▫ Pour activer un bloc, il faut le placer dans une
région du thème.

10. Les blocs
région
bloc configuration

11. Les blocs
blocs inactifs
sélectionner la région
enregistrer toute modification

12. Les blocs
affiche la liste des derniers commentaires
affiche la liste des nouveaux utilisateurs
affiche la liste des utilisateurs en ligne

13. Les blocs
• Les régions localisées dans le thème

14. Les menus
• Les menus
▫ Ils permettent de naviguer dans le site
 Et surtout ils « activent » l’exécution des traitements
de Drupal sur les contenus
 Chaque menu contient des liens
 En cliquant sur un lien
▫ On provoque l’exécution par Drupal d’un traitement
▫ Dont le résultat est ensuite retourné à l’utilisateur dans la
page centrale.

15. Les menus
• Les menus
▫ Il existe des menus par défaut
 Par exemple Navigation
▫ Il est possible d’ajouter des menus
▫ D’ajouter des liens à un menu
▫ De changer un lien de menu

16. Les menus
ajout d’un menu
menu modification du menu
ajout d’un lien

17. Les menus
• Création d’un lien (addlink) et son adresse ou « lien »
La page « A propos »

18. Les menus
• Création d’un lien (addlink)
et son adresse ou « lien »

19. Thème général
• Dans tous les exemples, on considère que la
plateforme a pour thème les hôtels du monde
▫ La plateforme doit donc permettre aux utilisateurs
contributeurs de créer des contenus représentant
des hôtels en fournissant pour chaque hôtel une
collection de photos et des valeurs pour les
métadonnées.

20. Les menus
• Construire un menu
▫ Créer un menu
▫ Ajouter des liens
▫ Activer le bloc correspondant au menu
 Pour le rendre visible et accessible aux visiteurs.

21. Premier exemple
• Premier exemple
▫ Création d’une page « à propos » décrivant les
objectifs et buts de la plateforme.
▫ Création d’une page « Conditions générales
d’utilisation » décrivant les règles de
fonctionnement à respecter (par exemple en terme
de copyright…)
▫ Création d’un menu donnant accès aux deux pages
 Activation du bloc correspondant

22. Premier exemple
• Procédure
▫ Créer deux contenus de type « basic page »
▫ Récupérer le lien (URL) des ces deux pages
▫ Créer un menu
 Ajouter les liens sur les deux pages dans le menu
▫ Activer le bloc du menu
▫ Le menu est accessible aux utilisateurs qui en
cliquant sur les liens du menu peuvent accéder au
contenu des deux pages et les lire.

23. Premier exemple
• A visionner
▫ http://youtu.be/wnuitc9G7cY

24. Moteur de recherche interne
• Le premier « point d’entrée » consiste à activer le
moteur de recherche interne et de permettre aux
visiteurs de l’interroger
▫ Activation du module.
▫ L’indexation des contenus se fait automatiquement
 Tous les fields sont indexés.
▫ Activation du bloc de recherche
 Permet de donner accès au visiteur à la recherche par
mot-clé.
 Le moteur renvoie la liste des contenus (ou des
utilusateurs) dont un des fields contient le mot-clé.

25. Moteur de recherche interne
• A visionner
▫ http://youtu.be/lDRs2UEMkDs

26. Sélection des contenus
• 3 exemples de sélections des contenus
▫ A partir d’une métadonnée associée à une
taxonomy ouverte
 En créant une vue qui affiche dans un bloc la liste
des termes de la taxonomy
 Quand le visiteur clique sur un des termes, tous les
contenus qui ont ce terme comme valeur de la
métadonnée sont sélectionnés et affichés sous forme
de liste.

27. Sélection des contenus
• 3 exemples de sélections des contenus
▫ A partir d’une métadonnée associée à une
taxonomy fermée
 En créant un menu qui affiche dans un bloc la liste
prédéfinie des termes de la taxonomy
 Quand le visiteur clique sur un des liens, tous les
contenus qui ont ce terme comme valeur de la
métadonnée sont sélectionnés et affichés sous forme
de liste.

28. Premier exemple
• Création d’une métadonnées Ville
▫ Elle permet d’attribuer à un hôtel la ville dans
laquelle il se trouve
▫ Le but est ensuite de permettre à un visiteur de
retrouver tous les hôtels d’une ville en
sélectionnant le nom de la ville.

29. Premier exemple
• Procédure
▫ Création d’une taxonomy « Villes »
▫ Création d’un field Ville de type « termreference »
ajouté au type de contenu Hôtel
 Le widget associé est un de type « Autocompleteterm » ce
qui permettra de laisser le contributeur soit utiliser un
nom de ville déjà existant, soit de créer un nouveau nom
de ville qui s’ajoutera à la taxonomy.
▫ Configuration du field
 Valeur unique
 Valeur obligatoire
 Il est associé à la taxonomy « Villes »

30. Premier exemple
• Procédure (suite)
▫ Création d’une vue (view)
 Qui sélectionne les termes de la taxonomy « Villes »
et les affiche
 Création d’un bloc associé à la vue qui permet de
visualiser le résultat de la sélection
▫ Activation du bloc de la vue

31. Premier exemple
• Résultat
▫ Chaque fois qu’un contributeur ajoute un hôtel, le
nom de ville qu’il lui attribue est ajouté à la
taxonomy si il n’y existe pas déjà.
▫ Le nouveau nom apparaît dans le bloc de la vue.
▫ Quand un visiteur clique sur un terme qui
correspond à un nom de ville, la plateforme
sélectionne tous les hôtels dont la ville correspond
et affiche la liste.

32. Premier exemple
• A visionner
▫ En 3 étapes
 http://youtu.be/-IYiLoJhTA0
 http://youtu.be/PkTGpG6K21c
 http://youtu.be/iC1ogaNKKyk

33. Deuxième exemple
• Création d’une métadonnée « Continent »
▫ Elle permet d’associer à chaque hôtel le continent
dans lequel il se trouve situé.
 On a à faire à une liste de valeurs fixe et prédéfinie
(contrairement à l’exemple précédent)
▫ Le but est ensuite de permettre à un visiteur de
retrouver tous les hôtels d’un continent en
sélectionnant le nom d’un continent.

34. Deuxième exemple
• Procédure
▫ Création d’une taxonomy « Continent »
 Ajout des 5 termes de la liste de continents
▫ Création d’un field « Continent » ajouté au type de
contenu Hôtel
 Le widget associé est un de type « radio button » ce qui
permettra de laisser le contributeur sélectionner la valeur
parmi la liste complète des termes de la taxonomy.
▫ Configuration du field
 Valeur facultative
 Valeur unique

35. Deuxième exemple
• Procédure (suite)
▫ Création d’un menu
▫ Ajout d’un lien sur chaque terme de la taxonomy
« Continents »
▫ On obtient un menu à 5 entrées, chacune
correspondant à un des termes de la taxonomy.

36. Deuxième exemple
• Résultats
▫ Chaque fois qu’un visiteur clique sur un des liens
du menu
 Les hôtels associés au continent correspondant sont
sélectionnés et la liste est affichée.

37. Deuxième exemple
• A visionner
▫ http://youtu.be/dxt8lmxY52k

38. Troisième exemple
• Création d’une métadonnée « Activités »
▫ Elle permet d’associer à chaque hôtel les activités
qu’il est possible d’y pratiquer:
golf, sauna, piscine...
▫ Le but est ensuite de permettre à un visiteur de
retrouver tous les hôtels qui proposent une
activité précise en lui permettant de faire une
recherche en fournissant lui-même le nom de
l’activité.

39. Troisième exemple
• Procédure
▫ Création d’un field « Activités » ajouté au type de
contenu Hôtel
 De type « text »
▫ Configuration du field
 Valeur optionnelle
 3 valeurs possibles

40. Troisième exemple
• Procédure (suite)
▫ Création d’une vue (view)
 Qui sélectionne les contenus de type hôtel à partir de
la valeur du field « Activités »
 Qui permet de laisser l’utilisateur saisir lui-même la
valeur de l’activité qu’il veut rechercher.
▫ Création d’un menu
 Avec ajout d’un lien sur la vue
▫ Activation du bloc du menu

41. Troisième exemple
• Résultat
▫ Quand le visiteur sélectionner le lien dans le
menu, un formulaire est affiché qui lui permet de
saisir une valeur d’activité dans un champ de
texte.
▫ Une fois la valeur validée par le visiteur, la
plateforme sélectionne les hôtels qui proposent
cette activité et en affiche la liste
 Si aucun ne propose l’activité, la liste de résultats est
vide.

42. Troisième exemple
• A visionner
▫ http://youtu.be/xojnRsRet0U
▫ http://youtu.be/hR0wPCPovak