Profil

  • Christelle
  • retrouvez-moi sur : http://www.awerpi.fr
  • retrouvez-moi sur : http://www.awerpi.fr

Photo.Graph

Catégories

5 janvier 2010 2 05 /01 /janvier /2010 08:41

Il était temps que je m’y penche… !

Voici comment personnaliser les formulaires moches d’over-blog : « commentaire » et « recommander ».

 

Puisqu’un bon schéma vaut mieux qu’un long discours :

formulaires-commentaire-recommander.jpg

 

 

 

Voici les classes concernées :

 

.diablog

- concerne toute la fenêtre de commentaire et de recommandation, sauf les pieds où se trouvent les boutons « fermer », « publier ce commentaires » ou « recommander cet article »

 

 

.diablog .buttons

- concerne les pieds de la fenêtre de commentaire et de recommandation où se trouvent les boutons « fermer », « publier ce commentaires » ou « recommander cet article »

 

 

.diablog .title

- concerne la cellule supérieure des formulaires où se trouvent les titres : « ajouter un commentaire » ou « recommander cet article »

 

 

.ob_form fieldset ul li .w100prct

- concerne les champs de textes où les visiteurs indiquent leurs nom, e-mail et site dans le formulaire de commentaire

 

 

.diablog .content .ob_form fieldset ul li textarea

- concerne le champ de texte où les visiteurs vont écrire leur commentaire dans le formulaire de commentaire.

 

 

.diablog .content .ob_form

- concerne la cellule centrale où se trouvent la totalité des formulaires de commentaire et de recommandation sauf les pieds et les titres.

 

 

.ob_form fieldset ul li label

- concerne les textes d’indications présents à côté des champs de textes à compléter par les visiteurs. Soit « votre nom », « votre email », « votre site » du formulaire de commentaire.

 

 

.ob_form fieldset ul li .inline

- concerne les textes suivants du formulaire de commentaire « se souvenir de ces informations », « rédigez ici votre commentaire » et « me prévenir par un email du prochain commentaire sur cet article »

 

.diablog .content .ob_form fieldset p

- concerne les textes de réglement du formulaire « Visible uniquement par l'auteur du blog » et « Nous vous rappelons que vous êtes responsable du contenu des commentaires que vous publiez. Votre adresse IP (xx.xx.xx.xxx) sera archivée »

 

 

 

 

Pour mieux cerner la personnalisation d’un formulaire de commentaire, voici un exemple :

Je veux que mon formulaire soit sur fond rouge, que les textes « votre nom » etc… soient en jaune et en arial par 10px, que les textes « se souvenir de ces informations » etc… soient en violet en italique, que le champ où le visiteur va écrire son commentaire, contienne une image en arrière plan, que le titre « ajouter un commentaire » soit souligné et écrit en blanc, que le pied du formulaire soit rose.

 

.diablog {background-color:#FF0000 ;}

.ob_form fieldset ul li label {color:#FFFF00; font-family:arial; font-size:10px;}

.ob_form fieldset ul li .inline {color:#9900FF; font-style:italic;}

.diablog .content .ob_form fieldset ul li textarea {background:transparent url(http://monimagedefond.png);}

.diablog .title {text-decoration:underline; color:#FFFFFF;}

.diablog .buttons {background-color:#FF00FF;}

 

A vous de jouer !

Partager cet article

Repost 0
Published by Christelle Vinsonneau - dans webdesign
commenter cet article

commentaires

Odettef 25/01/2010 21:54


Tiens c'est une bonne idée ça. Faut que je trouve le temps de le faire.
Merci pour toute l'aide que tu nous apportes.
Douce nuit à toi


Christelle Vinsonneau 31/01/2010 12:15


Merci de ta visite et bonne continuation