[RÉGLÉ] Taille auto des images d'article dans la pagination blog !!!

[Visiteur]

Bonjour á tous,
je viens à vous une nouvelle fois, pour m'aider á résoudre ce problème.
les articles de mes catégories sont présentées ainsi, un article complet prenant la largeur du container, puis les articles plus ancien en date sont en dessous sur deux colonnes.
Le problème se situe au niveau des photos des articles. Les photos de ces dernier, ne se réduise au format de la colonne et sorte de leur cadre.


Quel sont les paramètre que je dois changer pour que les photos s'auto redimensionnent lorsque l'article passe dans les colonnes ?

J'ai bien testé le principe de mettre un lire la suite avant la photo, mais ce système, ne me redonne pas l'article en entier lorsque je clique dessus et donc sort l'image de son contexte.

Merci pour votre aide et vos conseils.

[edantadis]

Re : Taille auto des images d'article dans la pagination blog !!!

Il n'y a pas de paramètres dans Joomla qui permette de faire cela (à ma connaissance en tout cas).

Soit il faut gérer ça en CSS soit ne mettre les images plus larges que la taille d'une colonne qu'après le lire la suite.

A moins de me tromper je ne vois pas d'autre solution...

[Visiteur]

Re : Taille auto des images d'article dans la pagination blog !!!

J'en suis venu á la même conclusion que toi, je vais aller trifouillé dans le CSS pour voir si je peux faire un paramétrage des image sur les article en colonne ...
A moins que quelqu'un d'autre aie une meilleur solution !!!!
Merci pour ton aide

[Visiteur]

Re : Taille auto des images d'article dans la pagination blog !!!

Donc, je viens de trouver une petite solution à mon problème, même si je cherche à la dupliquer automatiquement pour l'ensemble du site.
Pour ceux ou celles qui aurai le même soucis, j'ai édité mon texte d'article avec l'éditeur html et ai ajouté au style de l'image la partie en bleu.
<img alt="monequipement" style="display: block; margin-left: auto; margin-right: auto; max-width: 100%; " src="images/sampledata/administration/monequipement.jpg" height="297" width="450" />

Plus qu'a trouver l'emplacement pour mettre cette propriété dans le css, afin de ne pas l'avoir a le mettre sur chaque image lors de la création d'article ....

Je ne marque pas encore résolu , si une personne a une autre solution ... je suis toujours preneur ...

merci

[Rajoz]

Re : Taille auto des images d'article dans la pagination blog !!!

Bonjour Dolfijn,

Dans le fichier CSS du template (habituellement appelé template.css) tu peux ajouter à la fin :

.taille-auto { max-width: 100%  !important; height: auto !important; }

Si tu utilises JCE pour insérer l'image, dans l'onglet "Avancé" dans "Styles CSS" tu choisis taille-auto.
Avec ton éditeur HTML, tu peux ajouter manuellement la classe à l'image : <img class="taille-auto" ...

Il est possible de faire plus simple pour ne pas avoir à ajouter manuellement une classe à chaque image en ajoutant au template.css :

img { max-width: 100%  !important; height: auto !important; }

Mais attention, cela va s'appliquer à toutes les images utilisées dans les articles avec le risque par exemple d'interférer avec l'affichage d'une galerie. Pour pallier à cela il n'y a pas de solution générique et le css à ajouter va dépendre du template et de la galerie utilisés.

Amicalement,
Rajoz

[mol86]

Re : Taille auto des images d'article dans la pagination blog !!!

Donc, je viens de trouver une petite solution à mon problème, même si je cherche à la dupliquer automatiquement pour l'ensemble du site.
Pour ceux ou celles qui aurai le même soucis, j'ai édité mon texte d'article avec l'éditeur html et ai ajouté au style de l'image la partie en bleu.
<img alt="monequipement" style="display: block; margin-left: auto; margin-right: auto; max-width: 100%; " src="images/sampledata/administration/monequipement.jpg" height="297" width="450" />

Plus qu'a trouver l'emplacement pour mettre cette propriété dans le css, afin de ne pas l'avoir a le mettre sur chaque image lors de la création d'article ....

Je ne marque pas encore résolu , si une personne a une autre solution ... je suis toujours preneur ...

merci

Salut,

Alors je suis pas un expert mais ca me parait quand même un peu crade ton truc Et si t'as une autre image dans ton article ? Et si t'as pleins d'images dans pleins d'articles differents ? Tu vas t'amuser à mettre cette grosse balise img en dur dans chacun de tes articles dans le back end et à spécifier la taille de l'image ? Time-consuming à mort et anti-productif => Faut trouver autre chose.

Ce que je te propose de faire c'est de localiser le bloc dans lequel se trouve ton image en css. Pour cela telecharge firebug si tu le ne l'as pas deja (indispensable), installe le et appuie sur F12 sur ton site web, ca ouvrira firebug). en 5 secondes tu as localisé ton bloc conteneur du template en vigueur, appelons-le "#toto" si c'est un id, ".toto" si c'est une classe. Tu ouvres le fichier css de ton template et tu places le code suivant :

.toto img{
    width : 100%;
}

ou

#toto img{
    width : 100%;
}

Comme ca au moins cela fitera en largeur la taille de ton bloc conteneur, quel qu'il soit. Puis ça a le mérite de s'appliquer pour toutes les images placés dans tous tes articles => tu fais le taf qu'une fois and that's it.
Bon courage!

[Visiteur]

Re : Taille auto des images d'article dans la pagination blog !!!

Je te remercie pour cette info et cette aide !
Merci aussi pour l'avertissement au sujet du risque d'interférence avec les galeries .
je vais testé avec JCE

[Visiteur]

Re : Taille auto des images d'article dans la pagination blog !!!

Salut,

Alors je suis pas un expert mais ca me parait quand même un peu crade ton truc Et si t'as une autre image dans ton article ? Et si t'as pleins d'images dans pleins d'articles differents ? Tu vas t'amuser à mettre cette grosse balise img en dur dans chacun de tes articles dans le back end et à spécifier la taille de l'image ? Time-consuming à mort et anti-productif => Faut trouver autre chose.

Ce que je te propose de faire c'est de localiser le bloc dans lequel se trouve ton image en css. Pour cela telecharge firebug si tu le ne l'as pas deja (indispensable), installe le et appuie sur F12 sur ton site web, ca ouvrira firebug). en 5 secondes tu as localisé ton bloc conteneur du template en vigueur, appelons-le "#toto" si c'est un id, ".toto" si c'est une classe. Tu ouvres le fichier css de ton template et tu places le code suivant :

.toto img{
    width : 100%;
}

ou

#toto img{
    width : 100%;
}

Comme ca au moins cela fitera en largeur la taille de ton bloc conteneur, quel qu'il soit. Puis ça a le mérite de s'appliquer pour toutes les images placés dans tous tes articles => tu fais le taf qu'une fois and that's it.
Bon courage!

Merci pour ton aide , c'est bien ce que je me disait, d'où mon intention de chercher á modifié le CSS

[Visiteur]

Re : Taille auto des images d'article dans la pagination blog !!!

Et bien voilà problème réglé, après une recherche de bon emplacement ...

.toto img{
width : 100%;
}

fais son office ....

encore merci pour votre aide à tous