[SPIP 1.8] La technique du timbre, telle que nous l’avons exposée précédemment, fonctionne très bien à la condition que toutes les images ainsi manipulées soient en format « paysage », c’est-à-dire plus larges que hautes. En effet, notre « timbre-masque » étant lui-même plus large que haut, si on découpe une image ayant des proportions très différentes, on risque des découpes désastreuses.

Par exemple, sur une image verticale, on obtient ceci :

La technique suivante consiste à déterminer, directement avec une boucle SPIP (c’est-à-dire sans ajouter de code PHP), si une image est verticale ou horizontale (portait ou paysage).

Commençons par une boucle qui affichera des informations sur les images jointes à un article :

Cela affiche, dans notre cas :

• IMG/jpg/DSC02185_1.jpg - largeur : 600 - hauteur : 900
• IMG/jpg/DSC00399.jpg - largeur : 900 - hauteur : 676
• IMG/jpg/DSC02139_1.jpg - largeur : 900 - hauteur : 675

Nous avons donc des valeurs SPIP, #LARGEUR et #HAUTEUR, qui affichent les dimensions d’une image.

Avec le nouveau moteur de la version 1.8, il est possible d’utiliser ces balises SPIP comme critères de sélection des boucles.

Nous allons donc, à l’intérieur de notre BOUCLE_doc, ajouter une boucle de contrôle, c’est-à-dire une boucle qui affiche l’élément déjà sélectionné, en ajoutant un critère supplémentaire.

La premier argument de cette nouvelle boucle, {id_document}, sélectionne le document qui est déjà sélectionné. Le second argument, {largeur>#HAUTEUR}, permet de dire :
— nous voulons le document actuel,
— nous voulons ce document s’il a une largeur supérieure à la #HAUTEUR de la boucle précédente ; or, la #HAUTEUR de la boucle dans laquelle nous nous trouvons, c’est déjà celle du document !

La partie alternative de la boucle signifie que, si la largeur n’est pas supérieure à la #HAUTEUR, alors nous affichons un autre texte.

• IMG/jpg/DSC02185_1.jpg - largeur : 600 - hauteur : 900 Plus haut que large
• IMG/jpg/DSC00399.jpg - largeur : 900 - hauteur : 676 Plus large que haut
• IMG/jpg/DSC02139_1.jpg - largeur : 900 - hauteur : 675 Plus large que haut

Cette technique peut se révéler utile pour gérer des différences subtiles d’habillage selon les dimensions de logos ou d’images de portfolio.

Dans notre cas, nous allons simplement l’appliquer à notre technique du timbre. À partir d’ici, il faut SPIP 1.9 et GD2.

En plus de notre masque timbre-horizontal.png, nous ajoutons un autre masque, vertical (portrait), timbre-vertical.png.

timbre-horizontal.png

(Si vous utilisez ce fichier, pensez à le renommer.)

timbre-vertical.png

Et réunissons les deux techniques :

Le résultat est alors :