SPIP-Contrib

SPIP-Contrib

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

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

Accueil > Affichage multimédia > Images > Traitement d’images > Filtres images pour avant SPIP 1.9 > Améliorer la gestion des marges des images incluses dans du texte

Améliorer la gestion des marges des images incluses dans du texte

5 avril 2005 – par François Schreuer – commentaires

Ceci est une archive périmée mais qui reste intéressante, parfois autant pour l’article que les commentaires associés.

Ceci est une ARCHIVE, peut-être périmée. Vérifiez bien les compatibilités !

21 août 2005 — Attention, depuis la parution de la version 1.8.2 de SPIP, cet article est obsolète : il règle un problème qui n’existe plus. Cette page est conservée pour mémoire.


La version 1.8 de SPIP ne permet pas de différencier les marges latérales des images incluses dans du texte en fonction de l’alignement choisi pour ces images. Il n’est par exemple pas possible de faire en sorte qu’une image alignée à droite ait une marge de droite nulle et une marge gauche non nulle, et inversément.

Voici une solution peu-élégante mais très facile à mettre en place qui permet d’obtenir l’effet recherché, comme par exemple ici.

1. Placez le filtre suivant dans le fichier mes_fonctions.php3 ;

2. Ajoutez la définition des classes spip_documents_left et spip_documents_right dans votre feuille de style, par exemple de la façon suivante :

3. Appelez le filtre sur tous les champs dans lesquels des images sont incluses :

4. Pour l’insertion de vos images dans les champs texte de SPIP, utilisez le raccourci <docxxx|right> ou <docxxx|left> où xxx est le numéro de l’image (et non <imgxxx|right>).

Dernière modification de cette page le 4 août 2009

Retour en haut de la page

Vos commentaires

  • Le 7 avril 2005 à 20:25, par gbucher En réponse à : Remplacer le chenit (argo suisse-romand) des balises crééent par « img5|right » ou autre par des classes

    dans mes_fonctions.php3 :

    Je sais, ça ressemble beaucoup à ce que propose François Schreuer mais j’ai pas dû tout comprendre. Chez moi, les images dans le texte deviennent simplement des sans classe. En tout cas, cette exemple est fonctionne bien chez moi.

    • Le 13 mai 2005 à 14:17, par charlycha En réponse à : > Remplacer le chenit (argo suisse-romand) des balises crééent par « img5|right » ou autre par des classes

      Salut,
      Après avoir essayer ta solution, j’ai remarquer qu’elle ne fonctionnait pas sur mon spip 1.8.1.

      voilà le code corrigé :

      // supprime le style="" des images afin de les traiter en class
      function classImg($texte) {
      // Chaine en entrée : <img src='//static-contrib.spip.net/IMG/jpg/protection.jpg' width='170' height='170' alt="" style="border-width: 0px; float: left; margin: 4px;" />
      // Chaine en sortie : <img src='//static-contrib.spip.net/IMG/jpg/noprotection.jpg' width='170' height='170' alt="" class='spipimg_left' />

         $pattern = "/img src='(.*)' width='(.*)' height='(.*)' alt=\"(.*)\" .*float: ([a-zA-Y0-9]*);.*\/>/";
         $replace = "img src='$1' width='$2' height='$3' alt=\"$4\" class='spipimg_$5' />";
         return preg_replace($pattern, $replace, $texte);
      }

      ensuite, il suffit d’avoir ces style dans la CSS :

      .spipimg_left, .spipimg_right, .spipimg_center  {
              border-width: 0px;
              margin-top: 4px;
              margin-bottom: 10px;
      }
      .spipimg_left {
              float: left;
              margin-left: 0px;
              margin-right: 15px;
      }
      .spipimg_right {
              float: right;
              margin-left: 15px;
              margin-right: 0px;
      }
      .spipimg_center {
              float: center;       
              margin-left: 15px;
              margin-right: 15px;
      }

      Voilà, j’espere que ca pourra aider !

    Répondre à ce message

  • Le 20 février 2006 à 14:30, par Voldor En réponse à : Améliorer la gestion des marges des images incluses dans du texte

    Je viens d’installer [Spip 1 8 2g] et j’ai des problèmes avec les marges des images donc cet article m’intéresse fort ;-)

    Mais j’aimerais savoir, avant de l’utiliser, pourquoi vous dites que tout cela est réglé avec [Spip 1 8 2g] ?

    J’ai cherché et n’ai encore pas trouvé de réponse à cette question, c’est pourquoi j’ose vous la poser...

    Pardon si elle est naïve...
    Merci d’avance de m’éclairer ;-)

    Répondre à ce message

  • Le 14 avril 2005 à 13:48, par penchaki En réponse à : > Améliorer la gestion des marges des images incluses dans du texte

    Hello,
    comprends pas ca ne fonctionne absolument pas chez moi ?
    copier coller du script dans mes_fonctions

    (#CHAPO
    [(#TEXTE|justifier|rectifier_marges_images)]
    dans mon squelette ...

    ma feuille de style
    .spip_documents_left
    margin-right : 0.5em ;
    margin-bottom : 0.5em ;

    .spip_documents_right
    margin-left : 0.5em ;
    margin-bottom : 0.5em ;

    et voici la réponse code source

    comme s’il n’y avait aucun filtre ?

    Si vous avez une idée ?
    Merci beaucoup d’anvance
    penchaki

    • Le 14 avril 2005 à 14:11, par François Schreuer En réponse à : > Améliorer la gestion des marges des images incluses dans du texte

      Salut,

      Tout d’abord, je vous suggère d’utiliser les balises <cadre></cadre> ou <code> pour citer du code, sinon on sait rien lire et ça explose la mise en page du site.

      Je viens de refaire pas à pas l’installation, soit :

      1. installer un spip
      2. placer le filtre dans le fichier mes_fonctions.php3
      3. ajouter les deux définitions de style
      4. passer sur le filtre sur les champs ad hoc des squelettes

      Et ça marche parfaitement.

      Je viens de faire ça avec la version CVS pour être sûr que ça passait. Ca passe. J’avais également testé ce code sur une version 1.8.

      Quelle version de SPIP utilisez-vous ?

      François

    • Le 14 avril 2005 à 20:57, par François Schreuer En réponse à : > Améliorer la gestion des marges des images incluses dans du texte

      Ok, j’ai compris pourquoi ça ne marche pas. Vous devez appelez les images en mode « documents » et pas en mode image. C’est-à-dire écrire dans vos champs spip <doc678|right> au lieu de <img678|right>, qu’il y ait ou non un titre ou une légende liés à cette image. L’explication, c’est que SPIP renvoie juste l’image quand on appele <img... alors qu’il renvoie un div quand on appelle l’image en mode « document ». Et comme c’est sur le div qu’on intervient,...

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

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

  • Mailshot

    16 janvier 2013 – 254 commentaires

    Ce plugin prend en charge l’envoi en nombre d’info-lettres par email. Mailshot permet l’envoi en nombre d’emails au moyen d’un SMTP (ou d’un service externe) dédié à cet effet. Il permet de limiter la cadence d’envoi. Enfin, ce plugin implémente la (...)

  • bigfoot

    16 juin 2015 – 56 commentaires

    Un plugin qui facilite l’utilisation des notes de bas de page en les affichant dans des infobulles à l’aide d’un peu de javascript. Le constat de l’auteur du script : Les notes de bas de page sur le web sont une plaie. Tu dois d’abord essayer de (...)

  • SkelEditor 2.0

    1er mars 2010 – 74 commentaires

    La version remaniée et enrichie du plugin, pour SPIP 2.1, qui vous permet d’éditer votre squelette directement en ligne sans passer dans le FTP Ce plugin vous permet d’éditer les fichiers du squelette courant depuis l’interface privé. Cela peut (...)

  • CKeditor 3.0

    4 octobre 2009 – 1218 commentaires

    CKeditor est l’évolution de l’éditeur WYSIWYG : FCKeditor, avec ce plugin vous pourrez utiliser cet éditeur à la place de l’éditeur de spip tout en laissant le choix à vos auteurs de l’éditeur qu’ils préfèrent utiliser. Attention : cet éditeur WYSIWYG (...)

  • GIS 4

    11 août 2012 – 1344 commentaires

    Présentation et nouveautés La version 4 de GIS abandonne la libraire Mapstraction au profit de Leaflet. Cette librairie permet de s’affranchir des librairies propriétaires tout en gardant les mêmes fonctionnalités, elle propose même de nouvelles (...)