Aller au contenu
Support de Zwii

5 fichiers

  1. Galerie GPS

    IMPORTANT : Ce module n’est pas compatible avec les versions 9.2.x de ZwiiCMS
     
    Une autre galerie, sur une idée de @bruno et basée sur le module gallery de Zwiicms le plus récent, cette Galerie GPS vous permet de présenter vos plus belles randonnées et de les partager sur votre site Internet, à l’aide des photos comportant les informations de géo localisation enregistrées par votre APN ou votre téléphone portable.
    Par sobriété cette galerie adopte l’interface précédente de la galerie quelque peu modifiée, mais elle est parfaitement à jour pour fonctionner pleinement sur la version 10 du CMS.
     

     
    Sur le bas des pages internes se trouvent 2 boutons, le premier affiche une carte sur laquelle vos photos sont géo-localisées
     

     

     
    Les miniatures sont cliquables, les images s’affichent en pleine page dans un autre onglet de votre navigateur
     

     
    Si vous avez relevé la trace de votre parcours*, et enregistré celle-ci dans un fichier .gpx, placez ce fichier dans le même dossier que celui des photos de votre randonnée, la trace s’affichera alors sur la carte de géo localisation, et un second bouton deviendra disponible, vous permettant d’afficher une autre carte avec laquelle vous pourrez étudier votre trace GPX, de plus, un lien vous permettra de la proposer en téléchargement
     

     
    Il y a plusieurs cartes disponibles, et vous pouvez les afficher en plein écran
     

     

     

     
    Installation de la Galerie GPS sur votre site ZwiiCMS :
    Décompressez l’archive galerie-gps.zip, elle contient un dossier module contenant un sous-dossier GalerieGPS, puis envoyez par FTP le dossier module à la racine de votre site sous ZwiiCMS
     
    Je vous souhaite de faire plein de belles randonnées 😉
     
    *Il existe de nombreuses applications GPS de randonnée téléchargeables pour votre téléphone portable

    25 téléchargements

       (2 avis)

    2 commentaires

    Mis à jour

  2. Diaporama Slider

    Ce module va vous permettre d'insérer un diaporama responsif dans une page Zwii.
     
    Voir ce module en situation, expérimenter ce module !
     
    Version 3.2 testée avec Zwii 9.2.28, Zwii 10.0.092 et Zwii 10.1
     
     
    Par configuration vous pourrez obtenir cet aspect :

    La navigation se fait en cliquant sur la zone droite ou gauche de l'image.
    Le texte apparaît de façon progressive au survol de l'image.
    Arrêt du défilement automatique au survol de l'image.
     
     
    Celui là :

    Navigation par boutons discrets.
    Le texte et les boutons apparaissent de façon progressive au survol de l'image.
    Arrêt du défilement automatique au survol de l'image.
     
    Ou encore cette version avec légende en haut et boutons de navigation rectangulaires :

     
    Une version sans les puces de navigations :

    Le module Slider peut être utilisé dans une page avec gabarit
     

     
     
    Le diaporama est basé sur responsiveslides.com, le module Zwii slider est basé sur le module Zwii gallery de @Rémi. Merci à @Gilux et à @roger pour leurs contributions dans le CSS et à @Fred pour ses conseils et la mise à jour du fichier edit.js.php.
     
    #Installation
     
    1- Dézipper l'archive slider_vxx.zip
    Elle contient le dossier slider et 1 autre fichier dont nous verrons l'utilité plus loin (edit.js.php).
     
    Si vous avez déjà fait l'installation d'une ancienne version du module slider, il est préférable de la supprimer avant de poursuivre. Si la version précédemment installée était >= 2.3 vous pourrez réutiliser votre diaporama après avoir procédé à nouveau à son paramétrage, pour une version plus ancienne il faudra le recréer.
     
    2 - Avec votre logiciel FTP transférer le dossier slider dans le dossier module de votre site (attention module, pas core/module)
     

     
     
    Résultat obtenu pour le site dev9test
     
    slider/vendor/js/ contient le fichier javascript nécessaire au fonctionnement du module.
     
    slider/view/index/ contient 4 fichiers : index.php responsable de l'affichage du diaporama, index.css qui regroupe tous le CSS du diaporama et themes.gif,  themes.svg pour les 2 boutons proposés.
     
    slider/view/config/ et slider/view/edit/ proviennent du module gallery et sont utilisés pour le paramétrage du diaporama. Ils sont légèrement modifiés.
     
     
    #mode d'emploi
     
    1 - Créer une nouvelle page, modifier cette page

     
    2 - Sélectionner le module Slider et choisir la position du module dans la page
     
    A partir de la version 9.2.07 de Zwii l'option "Position du module dans la page" apparaît. Elle vous permet de choisir où le diaporama va s'afficher dans la page.
    La position "libre" vous permet d'insérer du contenu avant et après le diaporama en saisissant [MODULE] à l'endroit voulu dans votre page.
     

     
    Avec des versions 9 de Zwii plus anciennes vous pouvez remplacer par FTP le fichier core/module/page/view/edit/edit.js.php par celui contenu dans l'archive et dont on a parlé plus haut. Si non votre diaporama s'affichera uniquement en bas de page.
     
    Cliquez sur l'icone "roue dentée", positionnée à côté du choix de module, pour passer à l'étape 3.
     
    3 - Choisir le dossier contenant les images
     
    Vous aurez au préalable chargé les images du diaporama dans un dossier à l'intérieur de site/file/source/ (par FTP ou par le gestionnaire de fichiers intégré à Zwii).
    A ce propos 3 remarques :
    * Le diaporama va s'adapter automatiquement au format (16/9, 4/3,...) ou à l'orientation des images mais je trouve que le meilleur résultat visuel sera obtenu avec des images de même format et de même orientation. Mais ce n'est qu'une opinion personnelle, vous êtes libre de mixer différentes images.
    * Le diaporama va afficher l'image dans le même conteneur quelque soit sa taille, une image trop petite va être dilatée, une image trop grande va augmenter le temps de chargement du diaporama. Je vous conseille des images de largeur minimum 800px si votre paramétrage de la " Largeur maxi du diaporama " est à 800px.
    * L'ordre de passage est maintenant paramétrable.
     

     
     
    Saisissez un nom, sélectionnez un dossier cible puis cliquez sur l’icône dossier. Vous devez obtenir ceci :
     

     
     
    Pour passer à l'étape suivante cliquez sur l'icône "crayon" située sous "Paramétrage du diaporama".
     
    4 - Paramétrage du diaporama.
     

     
     
    Sur cette page de paramétrage, après un rappel du nom et du dossier cible des images, vous avez accès aux réglages suivants :
    Choix du type de navigation manuelle par boutons ou par zones droite ou gauche de l'image, Choix du type de boutons, flèche dans un rectangle noir ou dans un cercle blanc. Visibilité des puces de navigation ou pager, Largeur maxi du diaporama en pixels, le réglage "100%" correspond à la largeur du site définie en configuration - 40 pixels, La durée de la transition, en secondes ou en millisecondes, entre diapositives (fading) , La durée totale d'affichage, en secondes ou en millisecondes, d'une image (fading compris, au minimum durée de la transition + 100ms), La visibilité de la légende uniquement au survol de l'image, toujours visible ou jamais visible, La position de la légende en bas ou en haut de l'image, Le temps d'apparition de la légende et des boutons, Le choix du type de tri des images, La saisie des légendes.  
    N'oubliez pas d'enregistrer.
     
    # C'est possible
     
    Dans un même site Zwii vous pouvez insérer plusieurs diaporamas avec pour chacun des paramétrages différents.
     
    # C'est pas possible
     
    Dans une page Zwii vous ne pouvez insérer qu'un seul diaporama.
     
    Avec Zwii ce n'est pas possible d'insérer plus d'un module par page, vous ne pourrez donc pas insérer un diaporama (module slider) dans une page de blog (module blog) ou dans un formulaire (module form).
     
     
     

    99 téléchargements

       (5 avis)

    0 commentaire

    Mis à jour

  3. Module Album

    Module Album
     
    IMPORTANT : la dernière version de ce module compatible avec ZwiiCMS 9.2.x est la version 1.0.b, toujours téléchargeable en bas de cette page
     
    Initialement écrit en septembre 2019 et publié sous le nom de Gallery 2.0 pour remplacer les lourdes images en pleine résolution, réduites visuellement et cropées, des premières versions de la galerie d'origine, par des vignettes légères de haute qualité, créées à la volée et mises en cache, le module Album propose une interface différente, affichant des miniatures en haute résolution respectant les proportions et l’orientation des photos, et des fonctions supplémentaires par rapport aux versions actuelles du module gallery livré avec le CMS
     
    Au premier affichage de l'Album, le script corrige éventuellement le nom, l'orientation et la dimension des images puis créé les vignettes et les affiche, le traitement des photos peut être assez long, le temps d’exécution du script dépend du nombre de photo à traiter, de leur poids et du nombre d'opération à effectuer, durant ce temps l'affichage est interrompu et la page se recharge plusieurs fois, patientez, le script fait son boulot jusqu'au bout.

    Dès le second affichage les vignettes sont simplement affichées depuis le cache
     
    Les photos qui intègrent la balise GPS sont géo-localisables sur une carte Open Topo Map :
     

     

     

     
    l'Album s’intègre dans la charte graphique de ZwiiCMS, l'affichage par défaut est sobre, il est facile de le modifier pour l’harmoniser avec votre site, en s'inspirant des données CSS du fichier "modification des couleurs" présent dans l'archive, à ajouter au fichier "custom.css" depuis l'interface de ZwiiCMS, après les avoir modifiées selon votre besoin
     
    Index de la galerie :

     
    Page interne de la galerie :

     

     
    Le fonctionnement global du module Album est identique à celui de la galerie d'origine, écrite par @Rémi, améliorée et augmentée par @Fred, sur laquelle il est basé
     
    Fonctionnalités supplémentaires :
        Renomme Réoriente Redimensionne
     
    - Les caractères non alphanumériques et les espaces sont supprimés des noms des photos.
    - Si besoin, la photo est réorientée.
    - Les photos trop grandes, donc trop lourdes, mettent beaucoup de temps à s’afficher, ou ne s’affichent pas du tout dans certains cas. Pour un affichage fluide et rapide de la galerie, les trop grandes photos sont dimensionnées à la taille maximum correspondant à l’affichage courant des écrans en haute résolution, soit 1920 × 1280 pixels, les photos d’origine sont conservées et sont accessibles par un lien présent sous la vignette correspondante, pour distinguer ces photos de celles non redimensionnées, leurs noms s’affichent dans une couleur différente, notez que si la légende n’existe pas, elle est remplacée par le nom de la photo.
     
    Ce traitement des images se fait au premier affichage de la galerie.
     
        Géo-Localisation
     
    Cette fonction permet de géo-localiser sur une carte Open Street Map les photos qui intègrent la balise EXIF GPS, et de donner leurs altitudes
     
    Les photos d’origine sont conservées et sont accessibles par un lien présent sous la vignette correspondante :

     
    Les couleurs de fond et de texte peuvent s'harmoniser avec votre site en modifiant et en ajoutant le css ci-dessous dans votre custom.css :
    /* !important Le style de la galerie est prioritaire sur le custom.css, pour que vos changements de style soit appliqués vous devez ajouter l'attribut !important à vos éléments */ /* Cases contenant les vignettes */ .galleryPicture, .galleryGalleryPicture { /*exemple*/ background-color: gray !important; } .galleryPicture:hover, .galleryGalleryPicture:hover { /*exemple*/ background-color: silver !important; } /* Nom ou légende de l'image */ .galleryName, .galleryGalleryName { /*exemple*/ color: white !important; } .galleryName:hover, .galleryGalleryName:hover { /*exemple*/ color: black !important; } /* Nom ou légende des images redimensionnées */ .picResized { /*exemple*/ color: yellow !important; } .picResized:hover{ /*exemple*/ color: purple !important; } Exemple avec couleur sombre et effet hover sur les vignettes :

     
    Exemple avec couleurs et effet hover sur les vignettes :

     
    Installation du module Album sur votre site ZwiiCMS :
    Décompressez l’archive module-album.zip, elle contient un dossier module contenant un sous-dossier album, puis envoyez par FTP le dossier module à la racine de votre site sous ZwiiCMS
     
    Remplacement de votre galerie existante par l'album :
    En utilisant le module Album, vous souhaiterez sans doutes conserver votre galerie existante, c’est très simple à faire : dans l’archive que vous aurez téléchargé se trouvent 2 fichiers, en plus du dossier d’installation du module album et de 3 autres fichiers informatifs :
     
    album-install-10.php remplacement.txt  
    Utilisation de ce fichier :
    Par sécurité, faites une copie de votre fichier page.json
    Cette action remplacera "moduleId":"gallery" par "moduleId":"album" dans le fichier /site/data/fr/page.json de la version 10.x
     
    Copiez le nom de fichier ci-dessous, et copiez-le en fin d'adresse de votre site ZwiiCMS en ligne, comme ceci :
    http://www.mon-site-en-ligne.com/album-install-10.php
    NB : si la réécriture d'url n'est pas activée sur votre site, n'ajoutez pas le point d'interrogation ?
     
    Puis ouvrez cette page en appuyant sur la touche "entrée" de votre clavier.
    Une page vide avec un lien retour s'affiche alors
     
    Par ce moyen, vous avez transféré l'ensemble de votre galerie vers le module album, que votre galerie soit celle livrée par défaut avec ZwiiCMS, ou celle que je proposais sous le nom de module gallery 2.0
     
    Nom de fichier à copier/coller et à utiliser pour une version 10.x de votre ZwiiCMS :
    album-install-10.php
     
    Attention : en utilisant le fichier album-install-10.php il y a le risque de renommer aussi la page si vous utilisez le mot gallery dans le titre tel que : My Gallery, la page s'appelant alors my-gallery, si votre page comporte le mot gallery, renommez-la avant d'utiliser le fichier album-install-x.php

    142 téléchargements

       (4 avis)

    0 commentaire

    Mis à jour

  4. Module Galerie ExiGal

    Module de galerie pour ZwiiCMS v10
    1. Avancement :
    Je souhaitais coller au plus prêt de la gallery stock et des améliorations notables réalisées par @Fred . Cette galerie est donc un "tuning" de la galerie d'origine. Elle apporte une gestion des données de géolocalisation des photos (Exif). Elle affiche, si existe, les données du fichier "gpx". Les galeries qui ne contiennent pas de photos avec des données exif --> Pas de modifications, le rendu de la galerie est celui d'origine.  Les galeries qui contiennent des photos avec des données exif --> La galerie d'origine est cachée, et une carte avec des "markers" est affichée. Les popups utilisent les nouvelles vignettes "mini_" de Fred (Merci à lui). - Un bouton permet d'afficher la galerie d'origine.
    - Pour ceux qui n'ont pas peur, vous pouvez cliquer sur les vignettes pour afficher l'image en taille réelle. Elles peuvent être grosses ! Mais vous pourrez les imprimer, les télécharger ...
    - Pour ceux qui ont peur, NE CLIQUER PAS ! L'affichage des vignettes est suffisant sur téléphone portable.
     
    Vous souhaitez le comportement normal pour une galerie qui contient des photos avec des données exif -->
    Vous créez un fichier noexif.txt dans le répertoire des photos de la galerie, vous retrouvez le rendu d'origine de la galerie.. Les galeries qui contiennent un fichier .gpx --> il est affiché (Trace et graphique d'altitude). 2. Todo
    Nettoyer le code. 3. Numéro de version
    Le numéro est celui de la version stock de base + EG.
     

    11 téléchargements

       (0 avis)

    2 commentaires

    Envoyé(e)

  5. Mini Galerie

    Mini Galerie
    Est une galerie d’images très légère et rapide, elle permet de directement présenter sous forme de vignettes un dossier d’images dans une page, sans pré-charger les images, les vignettes sont créées à la volée, les photos sont miniaturisées sans être rognées, les images en grande taille s’affichent dans la lightbox de ZwiiCMS. Il est possible de créer plusieurs minis galeries dans le même site. C’est une bonne alternative à la galerie par défaut.
     
    Installation :
    Décompressez l'archive mini-galerie.zip sur votre ordinateur et envoyez à la racine de votre ZwiiCMS le dossier site par FTP
    Dans votre ZwiiCMS, à la partie [Configuration -> Insérer un script dans "Body"], insérez le contenu du fichier script-body.php, puis insérez le contenu du fichier custom.css à la partie [Personnalisation du thème -> Éditeur CSS]
     
    Pour afficher la galerie par défaut, créez une page vide nommée : Mini Galerie.
    Pour créer une autre galerie vous devez créer une autre page vide et modifier en conséquence le script inséré dans "Body"
     
    Ce plugin ne modifie aucun fichier de votre ZwiiCMS, il ajoute :
    . un dossier mini-galerie comprenant 1 fichier php dans le dossier include : site/include/mini-galerie
    . un fichier mini.php dans le dossier source : site/file/source/mini.php
    . un dossier images dans le dossier source : site/file/source/images, qui contient 10 images de demo
     
    Personnalisation :
    1. Modifiez le contenu du fichier script-body.php :
    Comme indiqué ci-dessus, renseignez à la ligne case le nom de votre page tel qu’il apparaît dans la barre d’adresse du navigateur, exemple :
    case 'mini-galerie': devient alors :
    case 'nom-de-votre-page':  
    Le dossier des images par défaut est 'images', pour en utiliser un autre, vous devez changer ce paramètre, exemple :
    $dossier_source = 'mon-dossier-photo'; Veillez à respecter la syntaxe, le nom du dossier ne doit comprendre que des caractères alphanumériques et des tirets, donc pas d'espaces (les remplacer par un tiret), d'accents ou d'autres symboles, et il doit être inséré entre des guillemets simples ''
    Le nombre de vignettes affichées par lignes est 6 par défaut, modifiez ce chiffre selon vos besoins, il doit être inséré sans guillemets, exemple :
    $nbcol = 4; Modifiez, si besoin, la taille d’affichage des vignettes exprimée en pixels, elle est de 120 pixels par défaut, exemple :
    $ratio = 80;  
    2. Modifiez le CSS selon vos besoins
     
    Fonctionnement :
    Envoyez vos photos dans leur répertoire via votre client FTP ou à l'aide du gestionnaire de fichiers, les miniatures se feront automatiquement.
    NB : De part la position de l'include dans le code de ZwiiCMS, cette galerie s'affiche en bas de page.
     
    Crédits :
    Ce plugin est une adaptation pour ZwiiCMS d'un script trouvé ici : http://www.lephpfacile.com/howto/12-comment-faire-un-script-de-galerie-photos-miniatures
     
    __________________________________________________________________________________________________________________________________________________
     
    Modifications pour la version 1.1.2 :
     
    Simplification et amélioration de la création des vignettes.
     
    Notez que vous pouvez aussi utiliser ce script pour créer à la volée des miniatures de vos images depuis cette URL :
    /eventuel-sous-dossier-d-installation/site/file/source/mini.php?dir=dossier&img=image.jpg&ratio=200
    En spécifiant le dossier ou se trouve l'image à réduire, le nom complet de l'image à réduire et la taille voulue de la miniature (ou vignette), veillez à respecter la syntaxe
     

     

     

    60 téléchargements

       (1 avis)

    0 commentaire

    Mis à jour


×
×
  • Créer...