Je viens de mettre en ligne mon #plugin_spip Hotspots (pour #SPIP évidemment) :
▻https://git.spip.net/spip-contrib-extensions/Hotspots
C’est un plugin qui permet d’installer une « grande » image de référence dans une rubrique, et cela fait, chaque article de cette rubrique pourra être positionné dans cette image sous la forme d’un « hotspot » rectangulaire, oval ou ponctuel (un point).
C’est une interface graphique particulièrement originale, et c’est redoutablement efficace à utiliser.
Alors attention : autant c’est facile à utiliser dans l’espace privé, autant pour le site public, vous aurez à sortir l’huile de coude et coder les choses vous-mêmes. J’en ai une utilisation tellement versatile que je n’ai jamais développé d’interface publique « clé-en-main » qu’on pourrait réutiliser telle quelle.
Pour comprendre la logiques des valeurs utilisées pour afficher les hotspots de manière responsive sur l’image de fond, on peut aller regarder le code du fichier :
/formulaires/modifier_hotspot.hml
Sur la page de rubrique, j’installe une grande image de référence (ici apparaissent déjà des hotspots) :
Dans chaque article de la rubrique, dans la colonne annexe, une petite vignette de cette image de référence apparaît : il suffit de cliquer dessus pour définir que cet article sera un hotspot.
À ce moment, dans la page de l’article, on peut définir précisément la forme et les limites du hotspot (ici un rectangle) :
Ensuite en fonction des besoins, je fabrique plein d’interfaces très différentes. Sur cet exemple, je l’ai utilisé pour fabriquer un « jeu » tactile demandant de replacer des bijoux au bon endroit :
Mais mon usage le plus fréquent, c’est de créer les hotspots dans des images panoramiques à 360° (évidemment, là il faut un peu bosser son javascript) :
▻https://musee.info/La-salle-Bazille
dans ce cas les hotspots sont positionnés dans l’interface du plugin sur une projection équirectangulaire de l’image panoramique :
Ou dans une image « zoomable » :
Un usage basique serait, évidemment, de gérer des « image map » (mais c’est quelque chose que je n’utilise rigoureusement jamais).