[RÉSOLU] affichage des articles en mosaïque
Salutatous,
Le contenu complet de mes articles s'affichent l'un en-dessous de l'autre à raison de 9 articles par page.
Je souhaiterais que ces 9 articles s'affichent,
d'une part, sous forme de mosaïque,
et d'autre part, de façon épurée (1 image + le titre de l'article),
ceci, à raison de 3 par lignes, soit 3 lignes de 3 articles.
Et au clic sur l'un des articles ça affiche le contenu complet de l'article en question.
Je pense dupliquer le fichier "categorie.php" et après renommage l'utiliser comme nouveau template.
Mais je ne sais pas comment coder ce que je souhaite...
Je tourne sur Pluxml 5.1.7 avec le tout dernier Thème Mystique.
Merci d'avance de vos lumières![:) :)](https://forum.pluxml.org/plugins/emojiextender/emoji/twitter/smile.png)
Nico
Le contenu complet de mes articles s'affichent l'un en-dessous de l'autre à raison de 9 articles par page.
Je souhaiterais que ces 9 articles s'affichent,
d'une part, sous forme de mosaïque,
et d'autre part, de façon épurée (1 image + le titre de l'article),
ceci, à raison de 3 par lignes, soit 3 lignes de 3 articles.
Et au clic sur l'un des articles ça affiche le contenu complet de l'article en question.
Je pense dupliquer le fichier "categorie.php" et après renommage l'utiliser comme nouveau template.
Mais je ne sais pas comment coder ce que je souhaite...
Je tourne sur Pluxml 5.1.7 avec le tout dernier Thème Mystique.
Merci d'avance de vos lumières
![:) :)](https://forum.pluxml.org/plugins/emojiextender/emoji/twitter/smile.png)
Nico
Connectez-vous ou Inscrivez-vous pour répondre.
Réponses
de ce style là: http://codepen.io/chrisss/pen/dLhBk
EDIT: je n'arrive pas à enlever l'espace entre les colonnes.
EDIT 2: 'Width' doit être à 24% pour 4 colonnes; 32% pour 3
Pas mal ce code tout en CSS
Je vais essayer ça...
En fait ce que je souhaite reproduire c'est ça :
http://www.davidrevoy.com/index.php
Les articles des catégories sont affichés sous forme de mosaïque (image + titre), et quand on clique dessus ça affiche l'article complet avec ses commentaires.
Note : qu'est-ce-qu'il est fort David Revoy en tant qu'illustrateur !
Merci...pas de mérite, j'utilise knacss pour cela.
[del]Pour ce que tu veux tu peut là aussi utliser 'grid' de knacss.. c'est que je fais pour un projet d'albums photos.[/del]
Dans les 'div' tu peut mettre ce que tu veux, comme tu le veux, texte, images, titre, etc...
EDIT: j'ai modifié mon code, vérifi si cela te vas; Là encore je modifie 'width' dans 'autogrid4' pour tenir compte des margin
Attention cet homme est dangereux !!!
Trop fort .... et de passage occasionnellement sur le forum
mes sites principaux : fonds d'écran gratuits - longue traîne - référencer votre site - brocante en ligne -
Dans mon fichier "style.css" j'ai donc ajouté ceci :
Et dans mon fichier "categorie-collection.php", j'ai encadré la boucle while comme ceci :
Merci encore Chriss
Ok je t'envoie la facture... O:)
Je venais de reprendre la bidouille sur mon pluxml pour un relooking 2015 et en lisant le forum , je suis tombé sur cette discutions. C'est flatteur, merci !
Je suis dans le coin si il y a besoin d'un truc/d'une méthode qui est sur mon site, j'ai fait pas mal de bidouille mais je veux bien les partager.
Tout tourne autour du plugin Vignette de Rockyhorror ; ou je récupère une image d'illustration de chaque article et transforme à la volé avec timthumb.
Le reste, du bidouillage de la classe lastArtList pour afficher aussi une douzaine des dernières vignettes en page statique.
La bonne nouvelle est que Timthumb peut être assez facilement remplacé par un outil nouveau et amélioré appelé Cimage, j'en ai parlé dans la discussion
http://forum.pluxml.org/viewtopic.php?pid=44702#p44702
où je relevais mes manches pour un week-end d'acharnement et me suis retrouvé avec une petite opération d'une heure ou deux qui s'est admirablement bien passée. Les fonctions de Cimage incluent toutes et chacunes des configurations auxquelles Timthumb nous avait habitués, et une multitude de nouvelles. L'excuse pour garder Timthumb s'effrite, c'est une question de sécurité.
Alors, à vos github, l'adresse est https://github.com/mosbth/cimage