Comment ajouter un effet popup à une miniature dans Zwii CMS

Zwii un CMS maintenu par Rémi Jean son auteur, c’est un CMS en français très simple d’emploi destiné à une gamme d’utilisateur variée, de débutants à chevronnés. Les dernières versions sorties début mars 2018 apportent un lot important d’améliorations.  Une série d’articles regroupant ces astuces seront publiés sous cette catégorie.

Pour débuter, les images avec un effet popup, l’idée est de créer  un effet d’affichage lors du clic sur une miniature.

Pour les besoins de la démonstration, j’ai utilisé deux images, une taille réelle (200 pixels de large est un maximum) et une autre en miniature.

Cette démo est basée sur la version 8.2.5 dont l’éditeur de texte par défaut est TINYmce.

Une fois le CMS installé, en FTP, éditez  init.js dans core/vendor/tinymce, recherchez

templates: [
que vous remplacez par :
templates: [
        {
          title:"Image Lightbox",
          url:baseUrl+"core/vendor/tinymce/templates/lightbox.html",
          description:"Une image qui s'ouvre dans une lightbox."
        },

Sauvegardez le fichier.

Dans le dossier Templates, y copiez les fichiers lightbox.html et image_vide.png contenus dans cette archive.

C’est prêt, il n’y a plus qu’à utiliser le plugin, une vidéo valant mieux qu’une longue explication :

Il est aussi possible de se passer de la miniature en réduisant la taille de l’image servant de miniature…

 

 

 

 

 

 

Publicités