[ar] [ca] [cpf] [de] [en] [es] [fr] [it]

Ce forum d’entraide est recommandé pour les utilisateurs et utilisatrices occasionnels de SPIP (Système de publication pour l’Internet). Avant de poser une question, faites une recherche sur ce site, consultez les liens utiles. Si vous ne trouvez pas de réponse, postez votre message dans la rubrique appropriée, avec un titre explicite.

Sujets : 23974 Sujets résolus :  39 %

79 visiteurs en ce moment


Accueil > Forums de discussion >  Création de squelettes > modifier la couleur des titres (liens de navigation des articles de mon (...)

modifier la couleur des titres (liens de navigation des articles de mon site) situés au centre et à gauche de la page accueil du site

par Arno - 13 janvier 2009 01:04 - Réponse(s) : 10

Bonjour,

Ayant cherché sur le forum de SPIP et dans SPIP contrib, je n’ai pas trouvé la réponse à ma question.

Je souhaite modifier la couleur des titres (liens de navigation renvoyant vers les articles de mon site) situés au centre et à gauche de la page accueil de mon site http://wikipacific.lescigales.org

Mais je ne sais pas à quelle classe, div ou autre élément ils appartiennent, donc je ne sais pas où et quoi modifier dans le fichier habillage.css (si c’est bien le fichier à modifier).

Je vous suis reconnaissant de m’indiquer la syntaxe/code à écrire et l’emplacement où le mettre pour modifier la couleur des titres (liens de navigation renvoyant vers les articles de mon site) situés au centre et à gauche de la page accueil.

Merci d’avance
Arnaud


  • tu devrais pour tes développements utiliser les outils qui vont bien ; je te conseille le couple firefox + extension firebug...

    #navigation .articles a:focus.spip_out,
    #navigation .articles a:hover.spip_out,
    #navigation .articles a:active.spip_out {
     color:red;
     text-decoration:underline;
    }
    #navigation .articles a.spip_out {
     color:yellow;
     text-decoration:none;
    }

    comme ta question n’est pas trés claire (les liens vers les articles sont à gauche en haut ; à gauche au milieu ce sont les liens vers les rubriques...) peut-être veux-tu modifier les liens vers les rubriques (ceux écris en capitales) ; auquel cas, tu changes ci-dessus par :

    #navigation .rubriques a:focus...

    ps, inutile de poster plusieures fois le même message...


  • Bonjour,

    J’ai téléchargé Firebug et Firefox comme vous me l’avez conseillé.

    En fait, je cherche à faire à modifier la couleurs des titres (= liens vers les articles) qu sont au centre de la page (sur fond blanc) ; je crois que ça s’appelle le contenu ; je ne cherche pas à modifier la liste des liens de navigation vers les articles (situés à gauche en haut) ou vers les rubriques (situés à gauche au milieu).

    1) Donc, je vous suis reconnaissant de m’indiquer la ligne de code à écrire pour modifier la couleur de la liste de titres (= liens vers les articles) situés au centre de la page (sur fond blanc).

    2) Dans quel fichier écrire ce code. S’agit-il de "habillage.css" (dans le dossier squelettes) ou "spip_style.css" (dans le dossier dist) ?

    Je m’efforce d’être le plus clair possible, toutefois veuillez m’excuser si mes explications peuvent vous paraîtrent confuses !

    Merci pour votre aide

    Arnaud
    http://wikipacific.lescigales.org/


  • il faudrait ajouter une déclaration (dans une copie de habillage.css placée dans squelettes/) :

    h3 .titre a {
     color:red;
    }

  • Bonjour,

    Je cherche toujours à modifier la couleurs des titres (= liens vers les articles) qui sont au centre de la page (sur fond blanc) ; je crois que ça s’appelle le contenu.

    Je présume qu’il s’agit d’une classe titre h3, mais comment faire une déclaration ? Où la placer : au début ou bien à la fin ou ailleurs dans le fichier habillage.css ; j’ai essayé mais sans succès.

    Comme il s’agit des titres h3 dans le contenu (correspondant à body class="page_sommaire") du squelette sommaire.html (la page d’accueil) faut-il rajouter #sommaire et #contenu devant :

    h3 .titre a { color:#1919B3; }

    a:visited { color: #1919B3; }

    a:hover { color:#F24E24; }

    Arno

    http://wikipacific.lescigales.org


  • Souhaitant résoudre ce problème sur lequel je me penche depuis une semaine, je vous remercie de me répondre.

    Bonjour,

    Je cherche toujours à modifier la couleurs des titres (= liens vers les articles) qui sont au centre de la page (sur fond blanc) ; je crois que ça s’appelle le contenu.

    Je présume qu’il s’agit d’une classe titre h3, mais comment faire une déclaration ? Où la placer : au début ou bien à la fin ou ailleurs dans le fichier habillage.css ; j’ai essayé mais sans succès.

    Comme il s’agit des titres h3 dans le contenu (correspondant à body class="page_sommaire") du squelette sommaire.html (la page d’accueil) faut-il rajouter #sommaire et #contenu devant :
    h3 .titre a color :#1919B3 ;

    a:visited color : #1919B3 ;

    a:hover color :#F24E24 ;

    Arno
    http://wikipacific.lescigales.org


  • Dans une copie de habillage.css placée dans ton dossier squelettes tu dois définir :
    - 

    .titre
    {margin: 1em 0;
    padding: 0;
    }

    .titre h3
    {font-family: Arial;
    font-size: 1.6em;
    }

    .titre h3 a
    {color: green;
    text-decoration:none;
    }

    .titre h3 a:hover
    {color:#F24E24;
    }

    .titre h3 a:focus
    {color: green;
    }

    .titre h3 a:active
    {color: #eaeaea;
    }

    .titre h3 a:visited
    { color: #1919B3;
    }

  • Merci pour votre feedback. J’ai essayé les solutions suivantes mais sans succès.

    J’ai créé un fichier habillage2.css avec le code ci-dessous que j’ai placé dans le dossier squelettes avec le fichier original habillage.css

    J’ai également essayé de place ce code à la fin du fichier habillage.css
    dans la rubrique /* Couleurs des liens */

    Avez-vous d’autres suggestions à me faire ?

    .titre {margin: 1em 0; padding: 0; }
    .titre h3 {font-family: Arial; font-size: 1.6em; }
    .titre h3 a {color: #1919B3; text-decoration:none; }

    .titre h3 a:hover {color:#F24E24; }
    .titre h3 a:focus {color: green; }
    .titre h3 a:active {color: #1919B3; }
    .titre h3 a:visited { color: #1919B3; }

  • Bon, l’arborescence de ton squelette est de l’ordre de :

    <div class="liste-articles">
    <ul>               
    <li dir="ltr" style="text-align: left;">
    <h3 class="titre"><a href="spip.php?xxx">titre</a></h3></li>/ul>/div>

    ce qui fait beaucoup d’imbrication...

    Dans ton fichier habillage.css, section Listes d’articles et extraits introductifs, le noeud .liste-articles li .titre est déjà défini.

    Je pense qu’il faut essayer de partir de la en définissant dans habillage.css :

    .liste-articles li .titre h3
    {}
    .liste-articles li .titre h3 a
    {color: #1919B3; text-decoration:none; }
    .liste-articles li .titre h3 a:hover;
    {color:#F24E24; }

    etc...

    Bon courage, tiens-nous informé


  • Une fois encore, je remercie le bon génie et les anges gardiens de SPIP pour leur aide.

    Prenant note de vos conseils, j’ai mis le code suivant dans l’une ou l’autre des sections /* Listes d’articles et extraits introductifs */ et /* Couleurs des liens */ de habillage.css dans le dossier squelettes.

    Cela fonctionne dans les deux sections. Y-a t-il une section préférable à une autre ?

    .liste-articles li .titre a {color: #000000; text-decoration:none; }
    .liste-articles li .titre a:hover {color:#F24E24; }

  • Techniquement, ça ne change rien de le mettre dans l’une ou l’autre section. Je pense par contre qu’en terme d’organisation de ton fichier css, notament en cas de modifications ultérieures, mieux vaut le mettre à la suite des éléments qui déterminent ta liste d’article




Répondre à la question

« modifier la couleur des titres (liens de navigation des articles de mon site) situés au centre et à gauche de la page accueil du site »

Mots-clés

Vous pouvez étiqueter cette page de forum avec les mots-clés qui vous semblent les plus appropriés ; ils permettront aux prochains visiteurs du site de mieux se repérer :


Installation, mise à jour

Utilisation de l’espace privé

Administration, gestion, configuration du site

Créer ses squelettes

Qui êtes-vous ?