S'identifier - S'inscrire - Ecrire un article - Contact

Affichage des articles par vignettes - Résolu

Par rap • Aide • Lundi 21/04/2008 • 16 commentaires  • Lu 3661 fois • Version imprimable

Bonjours à tous, j'aimerais savoir comment configurer l'affichage des articles par vignette, voila le code que j'utilise :

[ [afficher les articles] ].[ [mots-clés] ].images(image;titre)

Le problème c'est que les vignettes et le titre apparaissent dans un cadre blanc et la couleur de fond de mon article est noir, j'aimerais donc savoir comment faire pour rendre ce cadre de la même couleur que l'article.

Merci.

Commentaires

css par OlivierMG le Lundi 21/04/2008 à 11:24

OlivierMG Apparemment, le tableau des images est dans une classe "similar_articles_by_keywords hoverbox", dans la feuille /public_images/hoverbox.css, tu pourrais donc peut-être ajouter du css dans ton modèle pour modifier l'affichage.

| [^] | Répondre
Re: css par rap le Lundi 21/04/2008 à 11:26

rap Oui mais qu'est-ce qu'il faut utilisé comme nom dans le css ?

| [^] | Répondre
par rap le Vendredi 02/05/2008 à 20:23

rap Bon j'ai testé un peu des truc dans le css et j'ai remarqué que ".image" paramètre la vignette mais je n'arrive pas à paramétrer l'ensemble.

Dans le code html final, l'affichage apparait dans les balises : <ul class="hoverbox"><li><div class="image"></div>/li></ul>

| [^] | Répondre
Re: par mitra le Vendredi 02/05/2008 à 22:56

Rap,

J'ai fait un essai en rajoutant "border: none;" au CSS de ma liste qui est dans un "sidebar_lrg" et ça a l'air de marcher.

Si tu as un problème de fond gris, il suffit de mettre le fond en transparent : "background-color: transparent;"

Ainsi, ça donnera :

#sidebar_lrg ul li {
...
background-color: transparent;
border: none;
...
}

| [^] | Répondre
Re: par Jean-Luc le Dimanche 04/05/2008 à 12:31

Jean-Luc Je n'ai pas de "sidebar_lrg" dans ma CSS ! Comment je peux faire aussi pour afficher les vignettes mosaïques sans bordure et avec un background transparent ?

| [^] | Répondre
Re: par rap le Dimanche 04/05/2008 à 12:42

rap Moi non plus j'ai pas de "sidebar_lrg"

| [^] | Répondre
Re: par OlivierMG le Dimanche 04/05/2008 à 13:15

OlivierMG "sidebar_lrg" est le nom de la colonne de blocs large du modèle ithème. Pour les autres modèles, il suffit que tu remplaces "sidebar_lrg" par le nom de la colonne de blocs ("sidebar", "column", "column_left", etc.) utilisé par ton modèle.

EDIT : bien sûr, si ta mosaïque est dans un autre type de bloc, il faut utiliser le nom de ce bloc à la place de sidebar. ça peut être aussi appliqué directement à tout le blog, avec par exemple un #main ul li{.....} ,si par exemple toutes les colonnes sont dans un ensemble "main", mais attention, dans ce cas, ce style sera appliqué à tous les éléments de toutes les listes du blog.

| [^] | Répondre
par rap le Lundi 05/05/2008 à 19:23

rap Bon j'arrive toujours pas à paramétrer ces vignettes, mon skin est personnalisé donc j'ai configurer moi même les couleurs de fond pour tous les blocs, mes articles apparaissent dans une div class avec une image de fond mais les affichages d'articles avec vignettes apparaissent toujours dans un fond blanc, quoi que je fasse.

Il y a bien un moyen pour paramétrer ces vignettes, logiquement on pourrait même changer la taille des miniatures et la façon dont elles apparaissent lorsqu'on pointe la souris dessus non ?

| [^] | Répondre
Re: par mitra le Lundi 05/05/2008 à 21:43

Peux-tu m'envoyer ton modèle personnalisé pour voir si je peux le faire (cliquer sur le contact sur karafarin.viabloga.com) ? C'est vrai que parfois on n'arrive pas à faire faire aux css ce que l'on veut ! J'ai toujours pensé que c'est parce que je ne maîtrisais pas assez !

Par contre, je ne sais pas si on peut changer la taille des miniatures !

| [^] | Répondre
par rap le Mardi 06/05/2008 à 17:34

rap

 

| [^] | Répondre
Re: par mitra le Mardi 06/05/2008 à 18:16

rap,
Peux-tu (aussi) nous mettre un lien vers la page de ton blog qui pose problème ?

| [^] | Répondre
Re: par rap le Mercredi 07/05/2008 à 16:58

rap http://rap.viabloga.com/news/test-affichage

| [^] | Répondre
Re: par mitra le Mercredi 07/05/2008 à 17:12

As-tu déjà essayé dans ton css externalisé (<link rel="stylesheet" href='/public_images/hoverbox.css' type="text/css" media="screen, projection" />) de remplacer :

.hoverbox li
{
background-color: #eee;
border-color: #ddd #bbb #aaa #ccc;
border-style: solid;
border-width: 1px;
    color: inherit;
    display: inline;
    float: left;
    margin: 3px;
    padding: 5px;
    position: relative;
    width:155px;
}
Par :
.hoverbox li
{
background-color: transparent;
border: none;
    color: inherit;
    display: inline;
    float: left;
    margin: 3px;
    padding: 5px;
    position: relative;
    width:155px;
}

| [^] | Répondre
Re: par rap le Mercredi 07/05/2008 à 19:15

rap Et on fait comment pour modifier ce css ?

| [^] | Répondre
Re: par Stephane le Mercredi 07/05/2008 à 19:33

Stephane Tu mets les styles sur des éléments encore plus précis dans ton CSS à toi :

#tonelement .hoverbox li {
   tes css
}

si ta définition est plus spécifique, elle prendra le pas sur celles qui sont définies dans le fichier externe pour .hoverbox 

| [^] | Répondre
Re: par rap le Jeudi 08/05/2008 à 11:44

rap Merci Stéphane ça marche super bien

| [^] | Répondre

Session

Pour participer plus facilement, ouvrez une session :

Identifiant de
mon blog
Nom d'utilisateur
Mot de passe

Si vous avez déjà un blog sur ViaBloga ou si vous avez ouvert un compte sur l'un d'entre eux, vous pouvez vous identifier avec votre nom d'utilisateur et mot de passe en précisant d'abord l'identifiant de votre blog.

S'inscrire

Discussions actives (+ commentaire)

Ailleurs sur ViaBloga

Derniers weblogs mis à jour :

23:00 - Photos Promenade Numérique
15:56 -
18:22 - Bord à Bord Fluvial
21:33 - Fédération Apicole de la Charente Maritime - apiculture - abeilles
06:55 - Les Amis de Kervoyal
18:19 - P'tit truc
18:00 - Boire et Manger, quelle histoire !
17:16 - Défendre et Promouvoir les Valeurs de la République Sociale
09:16 - Voleur d'âme
15:25 - Domaine Les Lutinières

Toutes les mises à jour

Archives par mois