Bienvenue sur le forum d'entraide d'OverBlog.
Nous vous conseillons de chercher une réponse sur notre base de connaissances avant de poster une demande sur le forum.
[RESOLU] Modifications du "design" des commentaires
  • Louvre-passionLouvre-passion
    Bonjour,
    Dans le CSS comment faire pour modifier le "design" des commentaires (couleur et taille polices...).
    Merci d'avance pour votre aide.
  • KinouKinou
    Bonsoir,
    sur la FAQ, tu as des infos sur ce fil
  • Louvre-passionLouvre-passion
    Bonjour,
    Dans le fil indiqué il y a cette réponse sur la couleur des commentaires :
    http://fr.forum.over-blog-kiwi.com/discussion/346/resolu-couleur-des-commentaires/p1
    Malheureusement dans les options de configuration du thème "Elegant press", l'option
    "Couleur du titre des commentaires" n'existe pas.
  • MehdiMehdi
    Bonjour,

    cherche:

    .ob-commentsList .ob-message .ob-text {
        background-color: #f2f2f2;
        background-image: url("../images/quote_light.png");
        background-position: 10px -6px;
        background-repeat: no-repeat;
        display: block;
        font-size: 12px;
        line-height: 20px;
        margin: 10px 0;
        padding: 16px 10px 13px 80px;


    et ajoute une couleur (ici rouge)

    .ob-commentsList .ob-message .ob-text {
        background-color: #f2f2f2;
        background-image: url("../images/quote_light.png");
        background-position: 10px -6px;
        background-repeat: no-repeat;
        color: #f41a1a;
        display: block;
        font-size: 12px;
        line-height: 20px;
        margin: 10px 0;
        padding: 16px 10px 13px 80px;


    tu peux aussi copier tout ce code juste avant la dernière balise </style> marquant la fin de ton css

    si tu veux modifier la couleur de fond des commentaires il faudra jouer sur:

      background-color: #f2f2f2;
        background-image: url("../images/quote_light.png");

    ob a ajouter une petite image que tu peux garder ou supprimer

    pour la taille de la police, tu joue sur le font size


  • MehdiMehdi
    pour jouer sur la couleur de: "il y a 7 jours"...(par exemple)

    cherche:

    .ob-commentsList .ob-user span {
        height: 20px;
    }


    on aojute une couleur

    .ob-commentsList .ob-user span {
        color: #070707;
        height: 20px;
    }
    __________________

    pour la couleur orange actuellement du nom du commentateur

    cherche

    .ob-commentsList .ob-website {
        color: #f7a128;
        cursor: pointer;
        font-weight: bold;
        text-decoration: none;
    }

    tu change: #f7a128;
    ___________________

    si tu veux des bord arrondis sur tes commentaires

    cherche donc encore






    .ob-commentsList .ob-message .ob-text {
        background-color: #f2f2f2;
        background-image: url("../images/quote_light.png");
        background-position: 10px -6px;
        background-repeat: no-repeat;
        color: #f41a1a;
        display: block;
        font-size: 12px;
        line-height: 20px;
        margin: 10px 0;
        padding: 16px 10px 13px 80px;
    }

    et tu ajoute une bordure par exemple plus des arrondis   (tu décide de l'epaisseur de la bordure et sa couleur)

    le moz border radius déterminant l''arrondi en pixel ...réglable donc))


    border: 2px solid #F58020;
         border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;  }

    ce qui donnera au final:

    .ob-commentsList .ob-message .ob-text {
        background-color: f2f2f2;
        background-image: url("../images/quote_light.png");
        background-position: 10px -6px;
        background-repeat: no-repeat;
        display: block;
        font-size: 18px;
        line-height: 20px;
        margin: 15px 0;
        padding: 16px 10px 13px 80px;
      border: 2px solid #F58020;
         border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;  }
    ________________

    rendu des arrondis sur mon blog

    http://www.mariage-franco-marocain.net/article-nouveau-delai-2013-pour-casier-judiciaire-marocain-115868563.html
    _____________

    bon travail et oublie pas les ; et les accolades fermantes....... ;)

  • KinouKinou

    Je viens d'ajouter ce fil sur la FAQ   ;)

  • Louvre-passionLouvre-passion
    Merci à tous pour ces informations très complètes, je vais travailler sur ce design.
Rédiger un commentaire