SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

286 Plugins, 197 contribs sur SPIP-Zone, 287 visiteurs en ce moment

Accueil > Interactivité, échanges > Jeux > Intégrer Hot Potatoes dans un site SPIP

Intégrer Hot Potatoes dans un site SPIP

Intégrer ce logiciel gratuit de jeux dans un site SPIP

5 octobre 2008 – par marjorie – 17 commentaires

4 votes

Merci de noter que cette contribution est une astuce pour intégrer simplement des exercices créés grâce au logiciel ’hot potatoes’ dans un article spip, pas un plugin à part entière (mais toute évolution serait la bienvenue) !

Hot Potatoes
Hot Potatoes est un logiciel, très utilisé dans le monde de l’éducation, compatible PC, Mac et Linux.

Il est entièrement gratuit, pourvu qu’on s’enregistre sur le site officiel (et qu’on ne crée pas des activités gratuites), et offre une interface assez simple pour créer des exercices divers que l’on peut facilement mettre en ligne, puisque le code généré est du HTML. De nombreux sites scolaires, ou à vocation éducative l’utilisent déjà. Quelques unes des fonctionnalités proposées se retrouvent par ailleurs dans le plugin Jeux.

Avec Hot Potatoes, vous pouvez facilement créer :
-  des QCM
-  des exercices de mise en relation
-  des textes à trous
-  des questions ouvertes
-  des mots croisés
-  des textes à remettre dans l’ordre
tout en y insérant du texte, des images, des clips vidéos, en paramétrant des compteurs-temps, les messages, la façon de gérer les résultats, en reliant les activités entre elles...
En bref, tout ce que peut faire le plugin jeu, et même un peu plus (mais en moins beau)...

Hot Potatoes dans spip
Une fois que l’on a créé son activité sur Hot Potatoes, on a la possibilité de l’exporter en fichier html. Le logiciel génère en effet une (ou plusieurs) page(s) qu’il est directement possible d’utiliser.

Si on veut faire figurer assez simplement des exercices générés avec Hot Potatoes dans un article créé avec Spip, il suffit de deux ou trois manipulations :
-  Il suffit simplement de rajouter une boucle dans le gabarit ’article.html’, à l’endroit des boucles portfolio :

pour faire apparaître l’exercice dans une thickbox (si le plugin est activé) :

<BOUCLE_documents_hotpotatoes(DOCUMENTS) {id_article} {mode=document} {extension IN htm, html} {par num titre, date} {doublons}>
<a href="#URL_DOCUMENT?keepThis=true&TB_iframe=true&height=550&width=600"  class="thickbox"  type="#MIME_TYPE">#LOGO_DOCUMENT<br/></a>
</BOUCLE_documents_hotpotatoes>

Nota bene :
height=500 correspond à la hauteur de la fenêtre thickbox, width à sa largeur, c’est donc configurable.

autre possibilité, faire apparaître l’exercice directement dans la page de l’article, par le biais d’une iframe.
Voici le bout de code proposé dans le forum de cet article par émile :

<BOUCLE_documents_hotpotatoes(DOCUMENTS) {id_article} {mode=document} {extension IN htm, html} {par num titre, date} {doublons}>
<iframe name="cwindow" style="border:15px dotted #ADC7D6" width=600 height=480 src="#URL_DOCUMENT"></iframe><br/>
</BOUCLE_documents_hotpotatoes>

-  Après avoir rédigé et enregistré votre article, vous avez la possibilité d’ajouter des pièces jointes. Ajoutez donc à l’article où vous souhaitez voir figurer votre exercice le fichier HTML généré par Hot Potatoes.

-  concernant l’upload d’images, de sons, ou de vidéos ou autres que vous sohaiteriez ajouter à votre exercice, plusieurs solutions sont esquissées dans le forum ci-dessous.

-  Dernière petite touche, personnalisez le logo de la dist « html.png » (dossier /dist/vignettes/) afin que les visiteurs comprennent qu’en cliquant sur le logo ’html’, ils pourront commencer un exercice.

et voilà... vos visiteurs pourront s’amuser avec vos exercices.

Voici un exemple de cette intégration dans un site scolaire :
http://www.collegedevinci.fr/Somme-de-nombres-relatifs

Dernière modification de cette page le 4 novembre 2008

Retour en haut de la page

Tout afficher

Vos commentaires

  • Le 13 octobre 2013 à 15:57, par Pierre En réponse à : Intégrer Hot Potatoes dans un site SPIP

    bonjour, j’utilise Spip version 2.1.13. Grace à vos explications je suis parvenu à intégrer un exercice à trous sans image créé avec hotpotatoes sans trop de difficultés.
    Mon problème est de parvenir à intégrer un exercice contenant une image. Malgré mes efforts, au lieu d’afficher l’image, l’exercice apparait comme ceci « familytree.jpeg ». J’ai pourtant créée une structure identique à spip en ayant un dossier jpg et un dossier html. Je suis sans solution.
    je vous remercie par avance de m’aider.
    Autre question : dans ce site là, il est question d’un plug in hot potatoes. J’ai beau chercher je ne trouve pas. Ca vous dit quelque chose ?
    http://sites86.ac-poitiers.fr/spip.php?article34

    Bonne fin de weekend

    • Le 28 novembre 2013 à 10:29, par Touffe En réponse à : Intégrer Hot Potatoes dans un site SPIP

      Si votre image ne s’affiche pas, c’est vraisemblablement parce que le chemin pour la trouver a été changé. Par défaut, je crois que votre page html hot potatoes va chercher l’image dans le même répertoire. Si vous chargez le fichier html par spip, il ne va pas charger l’image, et si vous la chargez ensuite toujours par spip, il n’ira pas la mettre dans le même répertoire. Le plus simple à mon avis est d’aller copier vos images via ftp dans le répertoire ad hoc, c’est-à-dire le même que là où il enregistre vos fichiers html (je présume que ce doit être /IMG/htm qui doit être créé pour l’occasion).
      En cas de doute, affichez le code source (ctrl u sous firefox) pour visualiser l’adresse de l’image incriminée.
      Cordialement

    Répondre à ce message

  • Le 14 octobre 2009 à 17:47, par dcap En réponse à : Intégrer Hot Potatoes dans un site SPIP

    Voici comment je fais pour ne pas passer par le FTP

    Je crée un dossier pour mon projet Hot potatoes.

    Dans ce dossier je crée un sous dossier « html » et un sous dossier « jpg » si je travaille avec des images jpg, un sous dossier « gif » si je travaille avec des images gif.
    Je crée mon exercice de telle manière que les images soient dans leur dossier respectif. Je crée les exercices Hot Potatoes dans le dossier « html ».

    Quand tout est terminé je télécharge directement les fichiers html qui vont se placer dans /IMG/html/ du site (pas besoin de créer le dossier html, il est créé au premier téléchargement).
    Je télécharge les images de la même manière (c’est à dire comme d’habitude). Elles vont se placer dans IMG/jpg toujours automatiquement.

    Je place le fichier html de l’exercice spip dans ma page (comme je le fais pour une image ou un document. Je ne touche pas aux photos.
    Les liens relatifs exercices-images fonctionnent puisque la structure créé au départ se retrouve à l’identique dans le site.

    Ça demande seulement un peu d’organisation mais ça reste simple. On peut bien sûr produire plusieurs exercices dans le même dossier.

    Je ne sais pas si j’ai été assez clair ? C’est sûr qu’un plugin ce serait mieux.

    • Le 17 septembre 2011 à 13:16, par gautier En réponse à : Intégrer Hot Potatoes dans un site SPIP

      Bonjour,

      peut on en faire de même avec le logiciel Netquizz, je préfère la présentation des exercices à celui de hot potatoes

    Répondre à ce message

  • Le 4 janvier 2009 à 00:00, par samper En réponse à : une tentative différente

    Bonjour,

    Pas encore sous spip 2.0 mais 1.9c, j’ai finalement tenté une démarche très amateure pour essayer d’afficher un exercice hot pot : téléchargement du fichier html en doc joint et intégration de celui-ci dans l’article. Clic dessus et le questionnaire s’affiche et fonctionne. On perd certes tout l’environnement de la page spip, mais l’exercice ne se trouve pas limité par un cadre en pop-up. Comme ce sont des questions à partir d’une lecture, j’ai simplement ajouté le fichier pdf en doc joint, à lire avant de répondre. Autre tentative pour plus de convivialité, j’ai téléchargé le fichier-lecture pdf en doc joint, mais comme il ne va pas se mettre dans le même dossier que le fichier html, le lien qui l’appelle dans ce fichier ne fonctionnera pas. Solution : par ftp, télécharger le fichier pdf dans IMG/html. Là, en le téléchargeant « par la force » dans ce dossier, il retrouve son copain html et la paire fonctionne parfaitement. Pas tenté avec des images, mais cela devrait le faire pareil. Inconvénient, il faut un accès ftp.

    Bricolage mais en attendant un plugin ou de me mettre à la version spip 2, ça le fait.

    Cordialement et meilleurs voeux de développement à spip en 2009 !

    Répondre à ce message

  • Le 8 octobre 2008 à 21:58, par janus En réponse à : Intégrer Hot Potatoes dans un site SPIP

    bonjour,

    j’utilise et spip et hotpotatoes depuis longtemps. Mais pour le moment je n’arrive pas à intégrer directement les activités générées par hotpotatoes directement dans mon squelette : comment fais-tu émilie ?

    d’avance merci

    • Le 18 décembre 2008 à 15:20, par emile En réponse à : Intégrer Hot Potatoes dans un site SPIP

      Salut Lanus,
      Spip2 résout pas mal de problèmes.
      On peut télécharger directement le document hotpot.htm
      Pour avoir la page hotpot.htm dans l’article coller dans le corps de l’article :
      <iframe name="cwindow" style="border:15px dotted #ADC7D6" with=600 height=480 src="#URL_DOCUMENT"></iframe>
      Dimensions et couleurs modifiables.
      Voilou, c’est tout.

    Répondre à ce message

  • Le 7 octobre 2008 à 09:08, par emile En réponse à : Intégrer Hot Potatoes dans un site SPIP

    Le pb du chargement par ftp n’en est pas un, d’ailleurs tu as trouvé la bonne solution, je crois. Par contre je ne comprends pas pourquoi tu veux modifier ton fichier hot potatoes, si tu as récupéré les images Grace à l’article Spip, tu sais où elles sont, elles sont toujours au même endroit, dans le dossier IMG où un de ses sous-dossiers, même s’il est protégé, il suffit de le définir une fois dans hot potatoes comme dossier de lieu des images, il s’agit seulement de lire les images, au moment où tu fais l’article dans hot potatoes. Non ?

    • Le 7 octobre 2008 à 15:29, par sylpub En réponse à : Intégrer Hot Potatoes dans un site SPIP

      Vu comme ça, après discussion, ça roule :)

      il va juste falloir que je leur fasse admettre que l’exo réalisé l’est pour le site spip et qu’il ne peut être réalisé sur un fichier indépendant sur leur poste perso...(dans ma démarche, ils réalisaient d’abord l’exo en local puis le basculait sous spip d’où la modif du chemin nécessaire. Là, effectivement, si je construis d’abord l’article, puis si je charge les images et ENSUITE, si je réalise l’exo , j’ai le beurre, l’argent du beurre et le sourire de la crémière !)

      Ou encore cette seconde démarche qui est tout à fait réalisable...

      Merci beaucoup, je vais intégrer cela dans les sites peda de mon établissement :)

      C’est le plugin dont nous avions besoin.

    Répondre à ce message

  • Le 7 octobre 2008 à 10:20, par emile En réponse à : Intégrer Hot Potatoes dans un site SPIP

    Aussi peut-être créer pour simplifier un répertoire IMG/gif ou autre suivant les types utilisés, sur son disque dur, puis faire son exo hotpot à partir de là, lors de l’insertion des images juste ajouter / devant <img src="IMG/gif/aigle.gif" alt="aigle.gif" title="aigle" width="300" height="224"></img> ce qui donne /<img src="IMG/gif/aigle.gif" alt="aigle.gif" title="aigle" width="300" height="224"></img> peut-être pas trop dur pour un débutant ? non ?

    Répondre à ce message

  • Le 6 octobre 2008 à 14:27, par emile En réponse à : Intégrer Hot Potatoes dans un site SPIP

    Pour les images, en intra-net ou ou extra-net, stocker toutes les image dans le dossier /IMG/gif ou jpg ou png de votre site spip avant de faire les exercices Hot Potatoes, lors de la réalisation des exercices aller chercher les images dans ce dossier. (Non ?)

    • Le 6 octobre 2008 à 21:24, par sylpub En réponse à : Intégrer Hot Potatoes dans un site SPIP

      non :)
      primo :car cela suppose un accés en ftp et les débutants ne savent pas faire et cela réduit considérablement la simplicité de spip
      deuxio :je verrouille l’accès aux dossiers /IMG and co car certains dossiers récupèrent des doc qui sont dans la zone accès restreint, donc charger l’image depuis un espace qui ne se laisse pas explorer suppose de connaitre la syntaxe exacte du chemin et du nom de l’image (ne pas oublier que certains persistent à nommer leurs images avec des espaces que le serveur corrige mais ...bon bref, ils ne savent pas faire)
      bref, le plus simple que j’ai trouvé est de créer l’article qui va supporter le fichier html, charger les images comme d’hab dans cet article sans en insérer le code dans l’article évidemment...
      et là ouvrir le fichier html pour insérer le chemin avant de le charger lui aussi dans l’article

      si un script auto pouvait corriger les chemins dans ce type de plugin, ça simplifierait tout !
      je soumets :) je ne sais pas faire...

    Répondre à ce message

  • Le 6 octobre 2008 à 20:51, par emile En réponse à : Intégrer Hot Potatoes dans un site SPIP

    Oui, les résultats sont enregistrés, aller là et cliquer sur le bouton consulter, là il y a des gens qui ont joué le jeu et se sont enregistrés. Perso, je préfèrerais utiliser les ressources du plugin jeux. J’ai pas encore trouvé le temps de chercher comment le modifier pour enregistrer les résultats en dehors de le bd de Spip, dans un fichier txt, mais je vais m’y coller un jour. Le pb c’est que je suis assez mauvais en info. Je suis instit de base et je ne suis interéssé par l’info que pour ce qu’elle permet de faire. Heureusement qu’il y a des gens compétents sur Spip contrib qui font des trucs sympas, j’en profite pour les remercier.
    La boucle que j’utilise c’est çà

    <BOUCLE_documents_hotpotatoes(DOCUMENTS) {id_article} {mode=document} {extension IN htm, html} {par num titre, date} {doublons}>
    <iframe name="cwindow" style="border:15px dotted #ADC7D6" width=600 height=480 src="#URL_DOCUMENT"></iframe><br/>
    </BOUCLE_documents_hotpotatoes>

    Je ne télécharge qu’un article.
    Si j’en veux plusieurs je prends celle là

    <BOUCLE_documents_hotpotatoes(DOCUMENTS) {id_article} {mode=document} {extension IN htm, html} {par num titre, date} {doublons}>
    <a href="#URL_DOCUMENT?keepThis=true&TB_iframe=true&height=550&width=600"  class="thickbox"  type="#MIME_TYPE">[(#TITRE|sinon{<:info_document:>})]<br/></a>
    </BOUCLE_documents_hotpotatoes>

    , là j’ai les titres des documents et une fenêtre Thickbox.
    Pour les images, ça marche comme j’ai dit regarde là.
    Pour les liens à l’intérieur des articles Hotpot, c’est comme pour le fichier des images sauf que les pages hot potatoes sont stockées dans le fichier IMG/html/ et renommer par spip de htm en html .
    Cela veut dire que lorsque tu fais tes liens précédent et suivant dans tes articles, il faut que tu upload-es toutes tes pages dans ce dossier par ftp avant de tirer tes liens à partir de hotpot.
    Je sais que c’est confu mais moi et l’info... Soyez tolérant.

    Répondre à ce message

  • Le 6 octobre 2008 à 17:59, par samper En réponse à : Intégrer Hot Potatoes dans un site SPIP

    A emile,

    Je suis allé voir ton intégration directe et je la trouve intéressante vu les liens vers l’exercice (ou article ?) suivant et précédent. L’inscription au début de l’exercice permet-elle l’enregistrement des résultats ou uniquement leur envoi par courriel ? Et pour les images ? Comme expliqué sur ton dernier post ? Question boucle : que rajouter ou modifier ?

    Merci pour tes précisions. Entre les deux propostions avec hot pot, ce serait génial d’arriver à un plugin qui permette ce que vous faites, voire plus.

    Cordialement.

    Répondre à ce message

  • Le 6 octobre 2008 à 13:49, par emile En réponse à : Intégrer Hot Potatoes dans un site SPIP

    PS.
    Pour la boucle cliquer sur squelette dans le pied de l’article.

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?
  • [Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Mailsubscribers

    16 janvier 2013 – 274 commentaires

    Ce plugin permet de gérer les inscriptions (ou abonnements) à la diffusion de contenu par email. Mailsubscribers permet de gérer les inscriptions par Opt-in simple ou double et la désinscription par URL. Ce plugin gère également plusieurs listes (...)

  • noiZetier v2

    9 novembre 2012 – 36 commentaires

    Le noiZetier offre une interface d’administration permettant d’insérer au choix des éléments modulaires de squelettes (noisettes) et de les ajouter ainsi à ses squelettes. Compatibilité La version 2 du noizetier fonctionne sous SPIP 3. Elle est (...)

  • cirr : plugin « rédacteur restreint »

    29 octobre 2010 – 60 commentaires

    Ce plugin « cirr : rédacteur restreint » permet d’affecter des rubriques aux rédacteurs et modifie les droits afin qu’un rédacteur restreint (ou un administrateur restreint) voit dans l’espace privé uniquement les rubriques qui lui sont affectées (et leur (...)

  • Un retour d’expérience d’utilisation de Formidable

    26 octobre – commentaires

    Il s’agissait de créer un formulaire d’inscription à un évènement modérer les inscriptions dans le privé publier les inscriptions dans le public Nous avons discuté de cette présentation lors de l’apéro SPIP du 15 février 2016 à la Cantine (...)

  • Métas +

    3 décembre – 14 commentaires

    Améliorez l’indexation de vos articles dans les moteurs et leur affichage sur les réseaux sociaux grâce aux métadonnées Dublin Core, Open Graph et Twitter Card. Installation Activer le plugin dans le menu dédié. Dans le panel de configuration, (...)

Ça spipe par là