Proportions des images dans le carrousel sur les contenus

bqui · 13/03/2013 12:48:26

Bonjour,

Pour présenter les actualités d'un service, je souhaite utiliser le carrousel de la remontée de contenus.

Certaines illustrations utilisées ne se prêtent pas au redimensionnement en 270x568.

Est il possible de redimensionner en conservant les proportions ?

Question subsidiaire : est il possible de modifier la taille du carrousel (200x400) ?

Merci.

Raphaël Franchet · 13/03/2013 13:30:59

Bonjour,
est-ce que nous parlons de la vue "carrousel" de la remontée de contenu, fournit par la charte par défaut ?
(visible ici sur la démo (dans la partie haute de la page)

bqui · 13/03/2013 14:45:25

Oui, je parle de cela.

Raphaël Franchet · 13/03/2013 16:54:52

Il s'agit d'une vue d'exemple de la charte de démo.
C'est donc un exemple à adapter à vos besoins (et finalement, pas tellement une fonctionnalité du noyau).

Pour la 3.5, le js est amélioré et prend en compte le touch (tablette et téléphone).

Donc dans votre cas, n'hésitez pas à personnaliser cette XSL pour mettre les tailles d'images qui vous intéressent. Par contre, il faut peut être aussi ajuster les CSS qui vont avec. Et finalement, ce qui sera le plus pénible selon vos talents sera d'ajuster l'image "cadre" de fond... ou alors de la remplacer par du CSS3.

Pour ce qui est du retaillage, le CMS fournit des aides pour redimensionner une image :
1) on fixe une dimension, le cms choisi l'autre en conservant l'aspect
2) on fixe les deux dimensions : l'image est potentiellement déformée
3) on fixe les deux dimensions mais les cms renvoie une image non déformée qui rentre dans ce cadre.

Exemple, si vous avez une image 400x300
1) si vous demandez une largeur de 120 pixels, le cms renverra une image de 120x90
2) si vous demandez une de 120 pixels par 120 pixels, le cms renverra une image de 120x120 (donc déformée)
3) si vous demandez une taille 200x200, le cms renverra une image de 200x150

Pour le cas n°1

<img src="{resolver:resolveImage($type, $url, 120, 0)}" alt="{$alt-text}" width="120"/>

Pour le cas n°2

<img src="{resolver:resolveImage($type, $url, 120, 120)}" alt="{$alt-text}" width="120" height="120"/>

Pour le cas n°3

<img src="{resolver:resolveBoundedImage($type, $url, 200, 200)}" alt="{$alt-text}"/>

bqui · 13/03/2013 18:29:44

Merci pour ces explications bien détaillées.

Pour le redimensionnement du cadre, je l'avais fait ... effectivement ce n'est pas le plus simple.

Pour le dimensionnement de l'image, je n'avais pas vu que c'était un appel dans la xsl.

Je butte quand même sur un problème : Dans mes actualités, j'ai une illustration de 150x120 et pour que le carrousel s'affiche correctement, il faudrait qu'elle fasse 200x160 ... est ce possible ?

Raphaël Franchet · 13/03/2013 19:29:54

En effet, il n'y a des helpers que pour diminuer les images, pas pour les agrandir...
Dans votre cas, il faudrait ajouter un div autour de l'image à taille fixe pour faire en sorte que même si l'image est plus petite, le carrousel ne soit pas cassé...
Vous pouvez ouvrir une proposition de nouvelle fonctionnalité pour ajouter un helper dans votre sens, mais bon, ça me semble couvrir un petit nombre de cas... et il y a déjà des tickets sur des helpers d'images : votez !!!

bqui · 14/03/2013 12:35:39

Il m'a suffit de mettre une taille au li et de toucher un peu au css ; tout s'affiche correctement.

A voté.

Merci.

Forum Ametys

#1 13/03/2013 12:48:26

Proportions des images dans le carrousel sur les contenus

#2 13/03/2013 13:30:59

Re: Proportions des images dans le carrousel sur les contenus

#3 13/03/2013 14:45:25

Re: Proportions des images dans le carrousel sur les contenus

#4 13/03/2013 16:54:52

Re: Proportions des images dans le carrousel sur les contenus

#5 13/03/2013 18:29:44

Re: Proportions des images dans le carrousel sur les contenus

#6 13/03/2013 19:29:54

Re: Proportions des images dans le carrousel sur les contenus

#7 14/03/2013 12:35:39

Re: Proportions des images dans le carrousel sur les contenus

Board footer