Site de démonstration du jeu de squelettes ESCAL fonctionnant sous SPIP3 et mis à la disposition des Etablissements SColaires de l’Académie de Lyon... et de qui veut.

Utilisé à ce jour dans 1550 sites

| fr

| en | es | it

Accueil

Tests

test modele image_fluide

Article mis en ligne le 24 novembre 2013

dernière modification le 27 mars 2015

par Jean Christophe Villeneuve

Visites : 1374 - Popularité :

Test sur le modèle <image_fluideXXX> qui doit

respecter la largeur maximum des images dans les articles définies dans la configuration d’Escal
ne pas agrandir l’image si elle est plus petite que cette limite
réduire l’image sur les petits écrans en fonction de la taille de ces derniers
être centrée

Tests avec largeur maxi des images : 500px

Test avec une image de 640 X 180 px

Test avec une image de 360 X 480 px

Test avec une image de 594 X 671 px

Test avec une image de 48 X 48 px

Haut de page

Répondre à cet article

Modele "image_fluide" & plugin "Insertion avancée d’images"

Jaseur Boréal - le 3 janvier 2018

Bonjour,

Avec l’arrivée récente en 2017 du plugin "Insertion avancée d’images" décrit dans l’article-escal 328 il va y avoir redondance d’outils.

Dans l’espace privé de SPIP, ce plugin est par contre nommé "Médias compatibles responsive et modifiés"

Je teste les "Insertion avancée d’images" en remplaçant
-* <image_fluidexxx>
par
-* <imgxxx|center|rond|largeur=500|flip>

Pour l’instant j’ai un défaut d’affichage : l’espace est réservé, le titre & descriptif d’image s’affiche, mais pas encore l’image.

Va falloir aller tripatouiller le fichier .htaccess, d’après les explications données par Arno*.

Mon besoin actuel, qui sera aussi celui d’autres escaliens c’est de trouver facilement la procédure détaillée, rassemblée dans l’article concerné, pour basculer progressivement les pages contenant ces "images fluides" vers des "images avancées responsives".

Je continue les tests. L’affichage des images et logos dans les listes d’articles des sous-rubriques, va pouvoir aussi bien mieux "s’adapter" aux écrans et aux doigts.

Répondre à ce message

Modele "image_fluide" & plugin "Insertion avancée d’images"

Jaseur Boréal - le 3 janvier 2018

En ajoutant, comme le suggère Arno* une règle de réécriture des liens d’images dans le fichier "htaccess" ( source paris-Beyrouth) du site :

RewriteRule (.*)\-resp([0-9]+v?)(\-([0-9\.]+))?\.(jpg|png|gif)index.php?action=image_responsive&img=$1.{$5&taille=$2&dpr=$4}

L’affichage est extra, comme on peut le voir ici par exemple. Cela apporte un vrai [changement esthétique et simple aux images dans un article : https://www.lettonie-francija.fr/Aminata-Kalnins-spectacle-choral-jeunes-traverser-les-ponts-1366]

Répondre à ce message

Modele "image_fluide" & plugin "Insertion avancée d’images"

conil26 - le 3 janvier 2018

Bjr,

Le nom exact du plugin à afficher dans "Ajouter des plugins" est :
"Médias compatibles responsive et modifiés"