[plugin] vignette: ajout d'une image d'illustration à vos articles

13

Réponses

  • @rockyhorror:

    Je remarque que l'assistance en ligne de mon plugin préféré utilise encore Timthumb dans ses démonstrations. Bien qu'il fonctionne très bien sans doute, il est maintenant célèbre pour offrir une porte d'entrée aux mal intentionnés.

    En tant que président du fan club du plugin Vignette, je suggère fortement de faire passer les exemples à l'utilisation "directe" de l'url sans rafistolage de dernière seconde, ou encore de passer à Cimage en mettant des exemples qui diraient "img.php?src=..." mais à mon avis cette mention risquerait de déconcentrer les nouveaux utilisateurs qui installent le plugin pour la première fois et qui s'informent sur comment l'inclure dans les pages.

    Même si l'intégration de Cimage et de Vignette se fait avec autant de facilité qu'elle se faisait avec Timthumb, mieux vaut peut-être y aller un sujet à la fois.
  • Bonjour,

    @krysttof:
    Dans les options du plugin, tu désactive l'intégration automatique, et tu utilises le hook showVignette() dans la homepage (home.php). Voir l'aide du plugin pour l'utilisation de ce hook.

    @Pierre:
    Je ne comprend pas, je ne fait aucune utilisation de Timthumb, ou aucun autre script externe dans le plugin.
  • @rockyhorror:

    C'est dans "lang/fr-help.php" (et forcément dans "lang/en-help.php" ), le machin qui apparaît en cliquant sur le bouton "aide" dans l'écran des plugins. C'est loin d'être un cas urgent, simplement de passer par là et le changer pour la prochaine version.

    Rien de moins que la perfection pour le plugin que j'installe dans 100% de mes sites, il fait partie de mon installation de base depuis le jour où j'ai appris son existence.
  • Une nouvelle installation a provoqué un (très petit) bug avec le plugin Vignette dans sa configuration de base. Une fois installé, avant même d'avoir chargé la moindre image, on doit obligatoirement désactiver l'intégration automatique pour que le les fils RSS fonctionnent. D'autres plugins classiques comme plxEditorm, plxMysearch ou plxMyContact ne causent pas de problèmes mais Vignette bloque toutes les versions de CSS, ça donne le très peu sympathique message que voici:

    This page contains the following errors:
    error on line 1 at column 8: XML declaration allowed only at the start of the document
    Below is a rendering of the page up to the first error.


    Tel que mentionné plus haut, ce n'est pas une situation qui empêche la Terre de tourner, une simple désactivation du paramètre d'intégration automatique et tout semble fonctionner.
  • Bonjour,

    Je vais regarder ça.

    Merci.
  • Bonjour,

    Voici une nouvelle version qui corrige le bug, remonté par Pierre, avc les flux RSS.

    Voir par ici
  • Bonjour à tous,

    Je cherchais aussi à rajouter un champ qui me permettait d'ajouter une image (vignette ou pas) pour chaque article en passant par $plxShow->lastArtList

    En version plus light, il suffit de donner le nom de l'image avec un champ unique de l'article, par exemple #art_id :
    <img src="themes/montheme/img/#art_id.png" />
    [== PHP ==]
    
    <?php $plxShow->lastArtList('<li>
    <a class="#art_status" href="#art_url" title="#art_title">#art_title</a> <img src="themes/montheme/img/#art_id.png" /><p><a href="#art_url"  #art_chapo</a></p> </li>',0,'1','','sort'); ?>
    

    C'est sans plugin, la seule "contrainte" c'est de nommer vos images ou vignettes avec le numéro correspondant à l'article.

    Bravo à tous pour vos plugins et contributions, cela faisais très longtemps que je n'avais pas utilisé pluxml et je découvre avec plaisir l'évolution du cms.
  • L'idée est bonne, ça simplifie le processus, même si ça demande au rédacteur de connaître le numéro d'article, ce qui n'est pas très difficile.

    Les petits problèmes sont quand même envisageables:
    - une image ne peut pas être utilisée pour plusieurs articles à moins d'en faire plusieurs copies
    - on ne voit pas l'image au moment de l'assigner à un article
    - on doit utiliser ftp pour charger le fichier dans le répertoire du thème
    - si on change de thème, même juste pour l'essayer, il faut recommencer

    Tous ces problèmes sont résolus par la simple installation du plugin Vignette qui prend moins d'une minute, c'est bien peu payer pour tout résoudre d'un coup.

    Ceci dit, si ces contraintes ne sont pas un problème, le petit truc fait très bien son travail.
  • @Pierre
    - une image ne peut pas être utilisée pour plusieurs articles à moins d'en faire plusieurs copies
    - on ne voit pas l'image au moment de l'assigner à un article
    - on doit utiliser ftp pour charger le fichier dans le répertoire du thème
    - si on change de thème, même juste pour l'essayer, il faut recommencer

    Tes remarques sont pertinentes, loin de moi l'idée de supplanter le plugin Vignette.
    On peut cependant résoudre la problématique du Ftp :
    J'en étais resté à une version ancienne de pluxml et je n'avais pas remarqué que les images se trouve dans le dossier "medias".
    Dans ce cas il faut juste changer le chemin de l'image :

    <img src="themes/montheme/img/#art_id.png" />
    par
    <img src="data/medias/#art_id.png" />

    Comme cela on gère les images avec "Médias", visualisation et nom inclus.

    On peux même s'amuser avec les noms des images pour avoir des noms d'images plus SEO-friendly :
    <img src="data/medias/#art_title_#art_id.png" /> ou même <img src="data/medias/#art_url.jpg" />
  • Aucune offense sous-entendue de mon côté non plus. Je cherchais simplement un genre de raison pour l'invention d'une meilleure trappe à souris.

    En effet, les détails additionnels feront en bonne partie le travail. Mais plus on avance, plus on se rapproche des fonctions du plugin. Ça devient plus théorique que pratique, dans tous les sens du mot.

    J'ai bien évidemment un parti pris pour la petite merveille qu'est le plugin Vignette. N'ayant jamais rencontré le moindre inconvénient à la présence de cet outil léger et gratuit, j'y allais tout bonnement au plus simple. Pour des rédacteurs qui risquent de se bourrer plus souvent qu'on aurait imaginé, j'ai l'habitude de faire des choix "d'expérience utilisateur" qui vont provoquer le moins de possibilités de faire une gaffe, le principe que nos amis du soleil levant appellent le poka yoke.

    Mais si mon petit plugin adoré n'existait pas, c'est certain que cette méthode serait une solution rapide que j'utiliserais. J'ai répété souvent que je ne pourrais pas utiliser Pluxml si aucun moyen n'existait pour "accrocher" une image à un article sans l'inclure dans le corp de texte. Je suis bien content de voir qu'il y a plus d'une façon d'assurer cette possibilité.

    Tout ça combiné avec Cimage, mon nouveau programme utilitaire fétiche, et le paradis à la fin de vos jours, et pourquoi pas avant...
  • Bonjour,

    Par défaut, la vignette s'affiche dans le chapo.
    Si je souhaite qu'elle ne s'affiche que dans le corps de l'article ( et donc qu'elle n'apparaisse qu'en mode article en entier), il faut que je désactive l'intégration automatique et que je crée un template de page pour y insérer l'emplacement de la vignette?

    Lorsque je clique sur ajouter vignette, il m'ouvre bien le gestionnaire de médias.
    Mais si je double-clique sur l'image concernée, il ne me l'insère pas dans le champ ajouter vignette mais il m'ouvre l'image.
    De même si je sélectionne l'image, je n'ai pas de menu pour la sélectionner dans le champ de vignette.
    Je copie donc manuellement le nom de l'image.
    Est-ce un bug? ou est-ce la démarche normale?

    Cordialement
  • cpalocpalo Member
    novembre 2015 modifié
    Petite aide pour afficher la vignette.
    J'ai desactivé l'intégration automatique ( qui permettait bien d'afficher les vignettes)
    Mais je ne vois pas trop comment le faire manuellement;
    [== PHP ==]
    <!-- création d'un édito -->
    	<article class="edito" role="article" >
    		<?php $plxShow->lastArtList('
    		<header>
    			<h1>#art_title</h1>
    		</header>
    		<section>
    			<div class="vignette">
    				<?php eval($plxShow->callHook("showVignette")); ?><img src="#url" alt="vignette" />
    			</div>				
    			<div>
    				#art_content(9999)
    			</div>
                  </section>
    		', 1, '001') ?>
    	</article><!-- fin #edito -->  
    
    Mais à la place de la vignette, j'ai l'affichage de: callHook("showVignette"); ?>
  • je-evrardje-evrard Member
    novembre 2015 modifié
    Un article intéressant qui me donne pas mal d'idées de mon coté : image à la une et aussi ceci :)
  • cpalo a écrit:
    Petite aide pour afficher la vignette.
    J'ai desactivé l'intégration automatique ( qui permettait bien d'afficher les vignettes)
    Mais je ne vois pas trop comment le faire manuellement;
    [== PHP ==]
    <!-- création d'un édito -->
    	<article class="edito" role="article" >
    		<?php $plxShow->lastArtList('
    		<header>
    			<h1>#art_title</h1>
    		</header>
    		<section>
    			<div class="vignette">
    				<?php eval($plxShow->callHook("showVignette")); ?><img src="#url" alt="vignette" />
    			</div>				
    			<div>
    				#art_content(9999)
    			</div>
                  </section>
    		', 1, '001') ?>
    	</article><!-- fin #edito -->  
    
    Mais à la place de la vignette, j'ai l'affichage de: callHook("showVignette"); ?>

    Tu y es presque. En effet, le machin callhook te retourne l'information pour pointer vers l'image attitrée, mais la cargaison n'inclut pas la balise html IMG, et c'est tant mieux à mon avis.

    Il te faut donc insérer le EVAL dans le paramètre SRC à l'intérieur de la balise IMG. Quelque chose comme:

    <img src="<?php eval($plxShow->callHook("showVignette")); ?>" alt="vignette" />
  • Bonjour,

    Comme résultat, il ne m'affiche que le symbole d'une image non trouvée suivie de "alt="vignette" />
    et en affichant le code source ( j'utilise firefox):
    <img src="<?php eval($plxShow->callHook("showVignette")); ?> est en rouge et m'indique comme message ( pas d'espace entre les attributs)
  • bazooka07bazooka07 PluXml Lead Developer, Moderator
    novembre 2015 modifié
    Bonjour,

    Si tu arrives à afficher cela dans Firefox (en tapant Ctrl-U ou Ctrl-Maj-I), c'est que le code PHP n'a pas été exécuté.
    Je soupçonne que l'interpréteur PHP s'est arrêté avant sur une autre erreur.
    Il y a peut-être un autre plugin qui met le bazar.
    Peux-tu regarder les fichiers de logs sur ton serveur ?
  • Je viens de regarder les logs, et rien de particulier.
    Mais je viens de cerner un peu plus précisement le problème.
    Tout d'abord, le code correct est celui-ci:
    [== PHP ==]
    <div class="vignette">
         <?php eval($plxShow->callHook("showVignette")); ?>
    </div>		
    
    <section>
        <?php $plxShow->artContent(); ?>
    </section>
    
    Ensuite, en mode article, cela fonctionne maintenant sans problème.
    Le problème que j'ai en fait, c'est lorsque je suis sur la page d'accueil :
    [== PHP ==]
    <article class="edito" role="article" >
        <?php $plxShow->lastArtList('
            <header>
                <h1>#art_title</h1>
           </header>
           <section>
                <div class="vignette">
                      <?php eval($plxShow->callHook("showVignette")); ?>
                </div>				
                <div>
                     #art_content(9999)
                </div>
           </section>
        ', 1, '001') ?>
    </article>
    
    et que le code est inséré dans la fonction lastArtList
  • bazooka07bazooka07 PluXml Lead Developer, Moderator
    Oups !!

    Je comprends mieux pourquoi tu vois du code PHP avec Firefox.
    Tu appelles lastArtList() en lui passant une chaine de format où il y a du code php à interprêter. Sauf que il n'y a rien de prévu dans la fonction pour interprêter du code PHP dans le format.
  • et en lisant un peu mieux la doc, il faudrait que j'utilise un code du genre avec la fonction vignetteArtList:
    [== PHP ==]
    <!-- création d'un édito -->
        <article class="edito" role="article" >
            <?php eval($plxShow->callHook("vignetteArtList", array('
    	     <li><a href="#art_url" title="#art_title"><img src="#art_vignette" /></a></li>
    	', 1, "1"))); ?>					
    </article><!-- fin #edito --> 
    
  • bazooka07bazooka07 PluXml Lead Developer, Moderator
    Bonjour,

    C'est bien cela.
    En fait le hook vignetteArtList est une adaptation de la fonction lastArtList().

    Dommage qu'il manque un hook à la fin de lastArtList() avant d'imprimer avec echo, pour pouvoir modifier la valeur de $row ;)
  • En effet, désolé, je n'avais pas porté attention au fait qu'on utilisait lasArtList, je me pensais dans une loop while($plxShow->plxMotor->plxRecord_arts->loop()) où il est tout à fait approprié d'utiliser le call hook machin. Je suis tellement souvent contraint d'utiliser cette méthode plutôt que le lastArtList que je n'avais pas vu la nuance.

    Ainsi, tel que montionné par bazooka07, le vignetteArtList est simplement une version de lastArtList où il est possible d'inclure #art_vignette, une variable qui n'existe pas dans lastArtList.

    La suite logique est donc:

    - d'utiliser lastArtList partout où une vignette n'est pas utilisée
    - si oui, prendre plutôt vignetteArtList
    - et en dernier lieu, si une opération php (ou javascript ou autre) est nécessaire au beau milieu de la chaîne d'un de ces fonctions, passer à la boucle WHILE mentionnée plus haut. À ce moment, c'est le retour de notre eval($plxShow->callHook("showVignette")) sans l'utilisation ni de lastArtList ni vignetteArtList.
  • lut:)
    Je viens de teser = super !
    MAIS serait-il possible pour la balise 'alt' de remplacer le terme ' vignette ' par le nom du fichier image ?
    L'idéal étant ceci:
    ' ma-belle_image 2.jpg ' devenant ' ma belle image 2 '
    - pas de .jpg ou autre, et plus de - _
    @+
  • C'est certainement possible et même relativement simple. Il faut toutefois "nettoyer" la chaîne de caractères avant de l'insérer dans la balise img.

    Probablement que la fonction str_replace() sera un bon outil, le net regorge d'exemples expliquant comment on peut rapidement remplacer les tirets et autres par des espaces. Il restera à dresser la liste des suffixes possibles pour les images (jpg, png, etc) qui pourrait être assez longue et tout retirer, même en plusieurs passes s'il le faut.
  • Bonjour,

    Je regarde ça.
  • bazooka07bazooka07 PluXml Lead Developer, Moderator
    [== PHP ==]
    <?php
    $laBelleImage = 'Ma_belle-mere_en_porte-jarretelles.jpg';
    $patterns = array('#[-_]#', '#(\.\w+)$#');
    $replaces = array(' ', ''); // un espace pour le premier, une chaine vide pour le 2ème
    $res = preg_replace($patterns, $replaces, $laBelleImage);
    echo $res;
    ?>
    

    ]:D ]:D
  • Bonjour,

    Nouvelle version, qui utilise le nom de fichier, en remplaçant les -_ par des espaces, pour la balise alt.
    disponible par ici

    @bazooka07: Merci pour le tips
  • bazooka07bazooka07 PluXml Lead Developer, Moderator
    novembre 2015 modifié
    @rockyhorror,

    Je te fais les mêmes remarques que plxEditor:

    - Tu as écrit le dossier de plugins en dur dans le code : plugins. Comme j'ai l'esprit mal tourné, il y a belle lurette que j'ai renommé ce dossier kaissahoutils pour tromper les vilains garçons qui sévissent sur la toile. Mais passons.
    - Je trouve préférable d'utiliser le gestionnaire de médias original de Pluxml plutôt que d'en faire une copie bricolée. En prenant le hook pour les médias et une touche de javascript, on y arrive assez facilement. Cela permet d'utiliser conjointement d'autres plugins comme html5Uploader
    Tu peux télécharger ton plugin corrigé ici : http://kazimentou.fr/pluxml-plugins2/index.php?plugin=vignette&download
    Dans le hook AdminMediasFoot, vérifie que $urlBase correspond à a bonne valeur. L'url de la vignette est une adresse relative par rapport à la racine du site.
    Jette aussi un oeil au javascript.

    Cordialement
  • DeevadDeevad Member
    novembre 2015 modifié
    Merci Rockyhorror pour la mise à jour, et merci Bazooka07 pour les correctifs et aussi pour m' apprendre l'existence du html5Uploader.
    Je vais tester tout ça.

    En petite 'feature request' ; j'aimerai parfois pouvoir lister des vignettes d'articles de façon absolu dans mes pages statiques. Ca me permettrait des mise en page complexe et d'illustrer des pages statiques avec des minis galleries. ( oui, mon Pluxml avec le plugin de Rockyhorror est une gallerie http://www.davidrevoy.com/categorie1/artworks )
    Quelquechose qui fonctionnerai un peu comme 'vignetteArtList' ( un motif avec plein d'options #art-title, #art-vignette, #art_url ...etc... ) puis un second champs pour pointer une liste d'article precis, comme ci-dessous un exemple abstrait avec les articles ID 025, 150, 200 et 250 ( 025|150|200|250 ). J'ai essayé de bidouiller "vignetteArtList" en la duplicant en "vignetteArtDisplay" ; mais peu importe mes heures de bidouillages je n'y arrive pas... Merci d'avance si un programmateur aux connaissances plus avancé arrive à faire ce genre de fonctions pour enrichir ce plugin.
    [== PHP ==]
    <?php eval($plxShow->callHook("vignetteArtDisplay", array('
            <!-- #art_title -->
            <figure class="thumbnail col sml-4 med-3 lrg-3">
              <a href="#art_url" title="#art_title">
                <img src="#art_vignette" alt="#art_title" title="#art_title" >
              </a>
                <figcaption><a href="#art_url" title="#art_title">#category_list , #art_title <span>#art_date #art_nbcoms</span></a></figcaption>
            </figure>
            ',025|150|200|250,''))); 
    ?>
    
  • bazooka07bazooka07 PluXml Lead Developer, Moderator
    @Deevad,

    Vu comme ça, cela oblige à avoir un template par page statique, juste parce que les numéros d'articles changent.
    Il semble plus logique d'ajouter un champ supplémentaire à chaque page statique qui stockera la liste d'articles.
    On se retrouve alors avec un seul template. Ensuite dans l'édition de la page statique, on saisit un peu de laïus et la série d'articles.

    Et pourquoi des pages statiques ? Tu ne peux pas créer une catégorie par mini-galerie et avoir un template particulier pour ces catégories ?
    Rappel : dans la gestion des catégories, on peut choisir le template associé.
    Et on peut associer un article à plusieurs catégories.

    Je comprends pas trop "vignettes d'articles de façon absolu". Les vignettes sont indiquées par leurs adresses relatives à la racine du site.

    A++
  • J'ai eu pas mal souvent à faire ce que décrit Deevad, j'ai abandonné mes tentatives de comprendre les crochets et j'ai tout bonnement chargé dans une matrice la totalité des adresses de vignettes des articles avec les informations que je voulais leur associer. Ça sort du cadre de PluXml mais le temps me pressait. Vous comprenez donc que, tout de suite après, je passe à une succession de tris et plusieurs boucles d'affichage qui produisent le HTML selon les élans artistiques du designer.

    Je travaille justement sur un thème qui va exploiter cette méthode, il devrait être installé bientôt dans la portion de Ressources, il devrait s'appeler "Enzyme", pour les intéressés. Vous savez, ces grandes pages de portfolio où l'on peut choisir de voir toutes les catégories ou en choisir une dans un menu? Comme vous le savez sans doute, le contenu entier de de genre de page est chargé d'un coup, on "obscure" des portions derrière le rideau et on en "laisse paraître" d'autres par le menu. À venir dans un forum près de chez vous...
Connectez-vous ou Inscrivez-vous pour répondre.