Code couleur d'un site

Résolu
Bonjour,je possede un site web : http://www.mappinghl.tk qui utilise le CMS Xoops, ce site est composé d'un theme qui est pas mal au niveau des blocs, mais qui manque de couleurs.

J'aimerais pouvoir changer les couleurs (ex: le fond du teste en noir, les titres des boutons menu en rouge ou autre...) et ce, sur toutes les pages et pas seulement sur la page d'accueil.

J'ai cherché sur google et tout ce que j'ai pu voir ne m'a pas parrut assez explicite .

Merci de m'aider, et si vous désirez mon code source (themes.html / style.css) demandez le moi merci encore !!

--
Mapping is a drug : http://www.mappinghl.tk !!
Configuration: Windows Vista
Firefox 2.0.0.14

50 réponses

Résumé de la discussion

La modification des couleurs d'un thème XOOPS doit s'effectuer globalement via le CSS afin d'appliquer les changements sur toutes les pages, et pas uniquement sur la page d'accueil. Plusieurs conseils recommandent d'éditer le fichier style.css du thème et d'utiliser des valeurs hexadécimales pour les couleurs, éventuellement en le remplaçant par FTP. En pratique, des ajustements concrets ciblent des sélecteurs comme .outer a ou a:hover, avec tests sur différents navigateurs pour obtenir un rendu cohérent. En cas de difficulté persistante, il peut être utile d'envisager des variantes globales comme l'harmonisation des couleurs des liens et des boutons sur l'ensemble du site.

Bobot (l’IA à votre service)
  1. non, le voici :
    http://ns4.freeheberg.com/~xzibit72/themes/cs-lite/style.css

    tu peut l'enregister sur ton bureau, modifier les couleurs (en html, les couleur sont en hexa et commence par #, tu peut utiliser des site en ligne te donnant les codes couleurs tel que : http://www.henri-ruch.ch/HTML/Couleurs/couleurs.asp)
    en suite tu le remplaces à l'aide de ton logiciel ftp
    1. Si tu peux nous faire parvenir ton css, il suffit généralement de quelques modifs
      1. Voila j'ai mis le theme au complet afin que vous m'indiquiez la démarche merci encore !!

        http://ns4.freeheberg.com/~xzibit72/uploads/cs-lite.rar
        1. D'accord, ca me servira de lecons..... ;-D

          Je vais essayer et te retiens au courant merci encore !
          1. J'ai remplacer quelques couleurs sur le style css, je l'ai remplacer par l'ancien, et quand je retourne sur mon site, c'est toujours pareil.....pourrais-tu me dire comment faire stp ?
            1. T'as pas du modifier les bonnes partie correctement, dis moi clairement celle que tu veut modifier, et je te dirai a quel endroit tu le fera.
              1. Les articles au centre je les voudrais ecrit en blanc sur un fond noir.
                Les Titres des blocs de gauches et droite en rouge ( style ecriture de la banniere)
                Le header (noir dégradé) a coté de la banniere qui se rapproche de la couleur de la banniere

                Voila merci de m'aider .
                1. Alors tu remplace :

                  Tous les haut de bloc sont formé d'image, je te laisse les télécharger et les modifier, moi j'ai pas ce qui faut.
                  Elle sont commune à tous les blocs, si tu en modifie une, tous les header vont changer, et je n'y peut rien là.
                  http://ns4.freeheberg.com/~xzibit72/themes/cs-lite/images/lbtdiag.jpg //gauche
                  http://ns4.freeheberg.com/~xzibit72/themes/cs-lite/images/rbtdiag.jpg //droite

                  td#leftcolumn .blockTitle {
                  text-align: left;
                  padding: 2px;
                  color:#CC0000; //couleur du texte rouge
                  font-weight: bold;
                  vertical-align: middle;
                  }
                  td#leftcolumn .blockContent {
                  border-left: 1px solid #999;border-right: 1px solid #999;border-bottom: 1px solid #999;
                  background: #000000; //couleur du fond noir
                  padding: 3px;
                  line-height: 120%;
                  margin: 0 0 3px;
                  color: #CC0000; //couleur du texte rouge
                  }

                  td#centerRcolumn .blockTitle {
                  padding: 2px;
                  color:#FFFFFF
                  font-weight: bold;
                  margin-top: 2px;
                  vertical-align: middle;
                  }

                  td#centerRcolumn .blockContent {
                  border-left: 1px solid #999;border-right: 1px solid #999;border-bottom: 1px solid #999;
                  background: #000000; //couleur du fond noir
                  padding: 3px;
                  margin: 0 0 2px 0;
                  line-height: 120%;
                  background: #000000;
                  }

                  td#rightcolumn .blockTitle {
                  text-align: left;
                  padding: 2px;
                  color: #CC0000; //couleur du texte rouge
                  font-weight: bold;
                  vertical-align: middle;
                  }
                  td#rightcolumn .blockContent {
                  border-left: 1px solid #999;border-right: 1px solid #999;border-bottom: 1px solid #999;
                  color: #CC0000; //couleur du texte rouge
                  padding: 3px;
                  line-height: 120%;
                  margin: 0 0 3px;
                  background: #000000; //couleur du fond noir
                  }
                  Voila, tu peut tous remplacer, sa devrai marché
                  1. Je viens de le faire regarde ce que ca donne.....
                    La colonne de droite est trop rouge je la voudrais comme celle de gauche en noir si possible et finallement mettre le titre (seulement et pas le contenu) en blanc ainsi que le fond de la page d'accueil en noir/gris merci de me dire que modifier.

                    Merci beaucoup pour m'avoir deja bien aider.
                    1. Voila, j'avais bien fait une petite erreur, remplace le paragraphe du bas :
                      td#rightcolumn .blockContent {
                      border-left: 1px solid #999;border-right: 1px solid #999;border-bottom: 1px solid #999;
                      color: #CC0000; //couleur du texte rouge
                      padding: 3px;
                      line-height: 120%;
                      margin: 0 0 3px;
                      background: #000000; //couleur du fond noir
                      }

                      et pour le reste c'est OK ?
                      1. Je viens de modifier ce que tu m'as dit,en trifouillant un peu ca le fait merci !
                        Il me faudrait aussi si possible le fond des textes d'accueil en noir/gris avec le texte en blanc.

                        STP

                        Merci énormement pour tout ce que tu as deja fait.
                        1. Re_bonjour et désolé, mais j'ai eu un soucis avec mon theme et ca m'a énervé, résultat : j'ai changer de theme !

                          Il me faut juste 2 petites chose et je clos la discution stp :

                          - La couleur de tout les textes en blanc plutot qu'en gris .
                          - La taille de la police en plus grand (j'y connais rien, mais admettons que ce soit du 10px, je le voudrais en 14px .

                          C'est tout MERCI BEAUCOUP POUR TON AIDE !

                          http://ns4.freeheberg.com/~xzibit72/themes/4thefort/style.css (c'est mon style.css) ;-D
                          1. Salut, de rien, sa ne m'a pas pris beaucoup de temps !

                            td#centerRcolumn .blockTitle {
                            padding: 2px;
                            color:#FFFFFF
                            font-weight: bold;
                            margin-top: 2px;
                            vertical-align: middle;
                            }

                            td#centerRcolumn .blockContent {
                            border-left: 1px solid #999;border-right: 1px solid #999;border-bottom: 1px solid #999;
                            background: #646464; //couleur du fond girs, tu peut le foncé encore si tu veu
                            padding: 3px;
                            margin: 0 0 2px 0;
                            line-height: 120%;
                            color: #FFFFFF; //Texte en blanc
                            }

                            Mais par contre tu va avoir un soucis sur la couleur des liens (gris sur gris tu le verra pas) alors remplace ça aussi :
                            tu peut modifier les couleurs à ton gout
                            a { //couleur du lien
                            color: #F60; //orange
                            text-decoration: none;
                            font-weight: bold;
                            }
                            a:hover { //couleur du lien lors du survol
                            color: #FF0033; //rouge
                            text-decoration: none;
                            }
                            1. Merci bien, mais ce matin j'ai de nouveau un probleme, impossible d'acceder a mon ftp !
                              Depuis ce matin, je n'arrive plus a me connecteer a mon site via mon ftp (que ce soit cuteftp ou filezilla) .

                              La connexion commence et je recois ce message sur cuteftp : "Control connection closed."

                              Sur filezilla : Statut : Résolution de l'adresse IP pour ftp4.freeheberg.com
                              Statut : Connexion sur 213.251.184.118:21...
                              Statut : Connexion établie. Attente du message d'accueil...
                              Erreur : Connexion au serveur impossible !

                              Je viens de tester sur le ftp de freeheberg "net2ftp" et il y a bel et bien un probleme....mais lequel ?

                              Que dois-je faire et d'ou cela provient ?

                              Mon site : http://xzibit72.freeheberg.com/

                              Merci de m'aider. ;-D
                              1. Leur serveur a probablement due tombé en panne. Faudra que tu réessaye plus tard.
                                1. Ba le ftp remarche, j'ai donc pu essayer et ca n'a rien changé....
                                  Le style.css présent sur le site en ce moment est celui que tu m'as dit de modifier, tu peut donc verifier si j'ai tout fait correctement, a prioris je pense que oui.

                                  MERCI ENCORE !!
                                  1. Tu n'as pas remplacé correctement.
                                    Ca (vers le haut du fichier):
                                    a {
                                    color: #777777;
                                    text-decoration: none;
                                    font-weight: bold;
                                    }
                                    a:hover {
                                    color: #F60;
                                    text-decoration: none;
                                    }
                                    doit etre remplacé par :
                                    a { //couleur du lien
                                    color: #F60; //orange
                                    text-decoration: none;
                                    font-weight: bold;
                                    }
                                    a:hover { //couleur du lien lors du survol
                                    color: #FF0033; //rouge
                                    text-decoration: none;
                                    }

                                    Et ça non plus c'est pas remplacé correctement :
                                    td#centerRcolumn .blockTitle {
                                    padding: 2px;
                                    color:#FFFFFF
                                    font-weight: bold;
                                    margin-top: 2px;
                                    vertical-align: middle;
                                    }

                                    td#centerRcolumn .blockContent {
                                    border-left: 1px solid #999;border-right: 1px solid #999;border-bottom: 1px solid #999;
                                    background: #646464; //couleur du fond girs, tu peut le foncé encore si tu veu
                                    padding: 3px;
                                    margin: 0 0 2px 0;
                                    line-height: 120%;
                                    color: #FFFFFF; //Texte en blanc
                                    }

                                    Une fois que t'as remplacer le fichier, verifie grace à ce lien : http://ns4.freeheberg.com/~xzibit72/themes/cs-lite/style.css que tu as bien modifier le bon au bon endroit.
                                    1. Promis j'ai tout fais comme indiqué a l'instant et c'est toujours pas bon....
                                      Je pense que le plus simple serait que tu me passe le style.css modifié si possible, car la, je ne comprend plus rien....
                                      Je suis vraiment désolé d'etre aussi "nul" et te remercie de ta gentillesse.

                                      Merci
                                      1. Mon msn ? xzibit72@hotmail.fr Merci énormement !
                                        1. C'est bon c'est partie !
                                      • 1
                                      • 2
                                      • 3