Codes CSS pour empêcher les visiteurs de personnaliser leurs commentaires.

Alors, certains doivent se demander pourquoi faire une chose pareil ?  Il y a deux principales raisons possibles:

1 - Si l'admin du blog décide de changer de thème ainsi que la couleur de fond, les couleurs personnalisées des commentaires ne seront pas modifiées. Donc si un visiteur a écrit son commentaire en noir, le texte du commentaire ne sera plus visible lorsque l'admin mettra un thème au fond noir ou sombre (noir sur noir).

2 - Tout simplement pour les personnes qui préfèrent que leur blog reste sobre.

Lire la suite...

Lire la suite...

Je vais vous montrer comment changer le curseur de votre blog.

Lire la suite...

Avant de commencer, voici une petite liste de sélecteurs pour les commentaires. (Voir la liste complète)

1- .comment_normal,  .comment_admin (Commentaires)

Pour bien vous montrer à quoi correspondent ces sélecteurs, j'ai mis une bordure rouge. Comme vous pouvez le voir, .comment_normal et comment_admin correspondent à chaque commentaire avec Header, contenu, avatar etc... Bref, le bloc commentaire en entier. C'est également avec ces sélecteurs que l'on peut définir la largeur des commentaires, moi j'ai mis 90%.

2- div.commentheader (en-tête)

L'en-tête de vos commentaires. Si vous souhaitez que votre en-tête soit différente de celle de vos visiteurs il faut ajouter .comment_admin devant le sélécteur. Ce qui donne .comment_admin div.commentheader

Pour moi, l'en-tête de mes commentaires est plus foncé que ceux des visiteurs.

div.commentheader {propriété: valeur;}   

.comment_admin div.commentheader {propriété: valeur;}   

3- Éléments dans l'en-tête (Numéro, date, Pseudo)

.commentnumber {propriété: valeur;}  / n° du commentaire /

.commentpseudo {propriété: valeur;} / Pseudo /

.commentpseudo a {propriété: valeur;} / Pseudo lien (pour ceux qui on un compte ekla) /

.commentdate {propriété: valeur;}  / Date du commentaire /

4- div.commentbody (contenu de vos commentaires)

Là, rien de compliqué non plus.

div.commentbody {propriété: valeur;}

Si vous voulez que vos commentaires (donc l'admin) soient différents, comme pour l'en-tête, il faut ajouter .comment_admin devant

.comment_admin div.commentbody {propriété: valeur;}

5- Avatar

Pour définir la taille de l'avatar: {width: xpx;}

.commentavatar / Zone où se trouve votre avatar / 

.commentavatar img / l'avatar, image /

6- Bouton "Répondre"

 .comment-reply>a

7- Commentaire réponse.

Si vous voulez personnaliser les commentaires réponses, il vous suffit d'utiliser les sélecteurs donnés plus haut en ajoutant .block-reply devant. Exemple.

.block-reply  .commentavatar {propriété: valeur;}
.block-reply  .commentavatar img  {propriété: valeur;}
.block-reply .commentpseudo {propriété: valeur;}
.block-reply  div.commentbody {propriété: valeur;}

8- "Voir les réponses"

Si les réponses des commentaires sont cachées.

.show-replies {propriété: valeur;}

9- "Votre commentaire" en bas d’article

.module_contenu_block>a {propriété: valeur;}

S'il vous faut des précisions, n'hésitez pas à me laisser un commentaire :)