MiniGriSpip

Petit site de test et de démonstration du squelette MiniGriSpip 1.6...
Accueil du site > Autres projets > Archives > Filtre Filets de Séparation 1.0
  • Calendrier
«août 2006»
lun.mar.mer.jeu.ven.sam.dim.
123456
78910111213
14151617181920
21222324252627
28293031

Aujourd'hui lundi 18 décembre 2017

 2006   2007   2008   2011 
  • Infos
  • Dernière modification :
    Le mercredi 14 décembre 2011
  • Statistiques contenus :
    Articles : 24 -  Brèves : 4
    Commentaires : 212
    Sites : 3 -  Auteurs : 2
  • Statistiques visites :
    Aujourd'hui : 0 -  Total : 194147
  • Article

Filtre Filets de Séparation 1.0

Petit filtre pour insérer des filets de séparation dans les textes...

Le dimanche 27 août 2006, par FredoMkb

Les possibilités de formatage du texte par défaut proposées par Spip, couvrent l’ensemble des besoins en général, mais, parfois, on souhaiterais disposer d’un formatage particulier pour une utilisation spécifique.

Ce filtre ajoute une des ces fonctionnalitées...

Sommaire

Présentation

Filets de Saparation est un filtre qui ajoute la possibilité d’insérer des filets de séparation, paramétrables par des feuilles de style, dans le corps des textes, aussi bien pour les articles que pour les brèves.

Le but est d’offrir un moyen simple et rapide pour structurer et visualiser les niveaux d’imbrication des differents textes a l’interieur des differentes parties et chapitres qui composent un article ou brève.

Ce filtre se veut un complement un peu plus souple et personnalisable que le filet de separation par defaut produit par Spip lors de l’insertion des 4 tirets normaux.

Vous découvrirez dans cet article un exemple d’utilisation.

Installation

Filets de Saparation se présente sous la forme de deux fichiers qu’il faut déplacer (ou dupliquer) à l’intérieur du répertoire de votre squelette :

- "filets_sep.php" est le fichier qui contient le filtre de création et d’insertion des filets dans le texte fourni.

- "filets_sep.css" est le fichier qui contient les styles d’affichage des différents filets produits par le filtre.

Voici les étapes à suivre pour installer le filtre afin qu’il soit utilisable dans vos squelettes, commençons par le fichier "filets_sep.php" :

- Si votre squelette dispose d’un fichier nommé "mes_fonctions.php", éditez-le, puis insérez la ligne de code suivante en tête du fichier, juste après la balise qui débute le code Php <?php :

include("filets_sep.php");

- Une autre possibilité consisterait à éditer les fichiers "mes_fonctions.php" et "filets_sep.php", et par un simple copier/coller, insérer, à partir de ce dernier, l’ensemble du code de la fonction nommée "filets_sep" dans le premier fichier, n’importe où entre les balises <?php et ?>.

- Enfin, si votre squelette ne dispose pas d’un fichier nommé "mes_fonctions.php", il suffit alors de renommer le fichier "filets_sep.php" en "mes_fonctions.php".

Voici ensuite les étapes pour installer les feuilles de style afin que l’aspect des filets générés soient paramétrable :

- Si votre squelette dispose déjà d’un fichier de feuilles de style par défaut, il suffit de l’éditer, ainsi que le fichier "filets_sep.css", et copier l’ensemble de styles présents dans ce dernier à l’intérieur du premier.

- Si votre squelette ne dispose pas d’un fichier de feuilles de style, ou si vous ne souhaitez pas modifier celui existant, vous pouvez intégrer la fueille de style "filets_sep.css" directement à l’intérieur des fichiers Html de votre squelette qui l’utiliseront, à savoir, "article.html" et "breve.html", en insérant le code suivant, entre les balises <head> et </head> :

<link rel="stylesheet" href="[(#CHEMIN{filets_sep.css})]" type="text/css" />

Voilà, l’installation est finie, passons maintenant à l’intégration du filtre dans les codes des pages Html de votre squelette.

Intégration

Ce filtre est spécialement dédié au traitement des textes des articles et brèves, il est donc à utiliser à l’intérieur des boucles correspondantes sur la balise "#TEXTE".

Par exemple, dans une boucle "(ARTICLES)", il faut placer ce filtre sur la balise "#TEXTE" de la manière suivante :

[(#TEXTE|filets_sep)]

Si vous avez d’autres filtres a utiliser sur la même balise, comme par exemple le filtre qui sert à redimensionner les images contenues dans l’article, inserez alors de preference le filtre "filets_sep" en premier :

[(#TEXTE|filets_sep|reduire_image{400,0})]

Vous pouvez évidemment utiliser ce filtre sur d’autres données, comme les "#CHAPO" des articles par exemple, même si ce n’est pas l’endroit le plus indiqué à priori.

Utilisation

Voici comment utiliser ce filtre dans le texte des articles et breves...

Les balises à utiliser s’inscrivent toujours de la même manire, en utilisant 4 tirets bas (qu’on obtient par "majuscule + tiret"), séparés, deux par deux, par une lettre correspondant au type de filet a insérer dans le texte.

La syntaxe générale des balises est donc : "__lettre__".
Pour les utiliser correctement, il faut les placer dans un paragraphe isolé, c’est à dire, en laissant une ligne vierge avant et après chaque balise.

Trois balises sont supportées, produisant des filets d’aspect different (plus ou moins longs selon la feuille de style par défaut), voici donc une description détaillée de chacune d’elles (Attention, afin que le filtre, qui agit sur cet article, ne produise pas un filet dans la représentation des codes présentés ci-dessous, les lettres qui les déffinissent ont été précédées et suivies d’une espace, bien-sûr, vous devrez les utiliser sans ces espaces) :

- 1. La balise "__ l __"
Elle s’obtient en inscrivant 2 tirets bas en premier, puis la lettre "L" minuscule (qui signifie "long"), puis, enfin, 2 tirets bas.
Cette balise produit un filet de la longueur du bloc texte hôte, avec la feuille de style par défaut, ce qui produit le filet ci-dessous :

- 2. La balise "__ m __"
Elle s’obtient en inscrivant 2 tirets bas en premier, puis la lettre "M" minuscule (qui signifie "moyen") puis, enfin, 2 tirets bas.
Cette balise produit un filet de la longueur du bloc texte hôte moins 60 pixels de marge gauche et droite, avec la feuille de style par défaut, ce qui produit le filet ci-dessous :

- 3. La balise "__ c __"
Elle s’obtient en inscrivant 2 tirets bas en premier, puis la lettre "C" minuscule (qui signifie "court") puis, enfin, 2 tirets bas.
Cette balise produit un filet de la longueur du bloc texte hôte moins 120 pixels de marge gauche et droite, avec la feuille de style par défaut, ce qui produit le filet ci-dessous :

L’aspect de l’ensemble de ces filets est parametrable grace aux styles correspondants (voir le chapitre suivant à propos de leur pramétrage).

Paramètrage

Ce filtre remplace les différentes balises citées, dans le texte fourni, par des paragraphes Html vides, mais ayant chacun un style spécifique, par exemple :

<p class="filet_sep_long"></p>

Chaque paragraphe ayant son propre style, il devient alors facile des les formater à votre guise.

Trois styles par défaut sont fournis avec ce filtre, dans le fichier "filets_sep.css", qu’il faudra installer suivant une des méthodes décrites plus haut dans le chapitre "Installation".

Évidemment, ces 3 styles différents, correspondants aux 3 types de filets produits par le filtre, peuvent être modifiés et adpatés a vos besoins... n’hésitez pas à faire des tests, tout est simplement paramétrable grâce aux feuilles de style...

Exemples

Comme une image vaut tous les discours, voici quelques exemples d’utilisation et formatage de ces filets.

Je me suis servi de l’exemple fourni dans l’article de ce filtre, sur le site de démonstration du squelette MiniGriSpip où le filtre est installé, pour faire quelques tests et vous montrer les possibilités de formatage que les feuilles de style permettent d’obtenir...

- Filets simples, même type mais dimensions différentes

Cliquez sur la vignette pour aggrandir l’image
PNG - 97.9 ko

- Filets simples, type, couleur et dimensions différentes

Cliquez sur la vignette pour aggrandir l’image
PNG - 97.9 ko

- Filets et fonds, avec différents formatages

Cliquez sur la vignette pour aggrandir l’image
PNG - 93 ko

- Filets et fonds, avec inclusion d’images

Cliquez sur la vignette pour aggrandir l’image
PNG - 134.6 ko

Tous ces filets différents ont été obtenus uniquement en jouant avec les feuilles de style... comme vous pouvez le constater, une fois le filtre installé et les styles paramétrés, il devient très facile de créer des séparations personnalisées dans vos textes... un jeu d’enfants :-)

Téléchargement

Cliquez sur l’icône pour télécharger le filtre
Zip - 3 ko
Filets de Séparation

  • Il n'y a aucun mot-clé...
Suivre la vie du site RSS 2.0 | SPIP | Mgs MGS