EDIT : Attention, le code Source de ce module ayant changé depuis le jour où cet article a été rédigé, certaines informations sont obsolètes !
Les lignes inscrite dans le module Newsletter sont souvent difficiles a lire, voire invisibles...
Voici tout ce qu'il faut pour les modifier:
On veut agir uniquement sur le module Newsletter, donc on commence chaque ligne par #Newsletter.
#Newsletter .box-content {
color:#machin;
}
change "inscription a la newsletter". Jusque la, c'est logique.
#Newsletter .box-content p {
color:#truc;
}
change "email", car ce mot est defini (par la partie du code a laquelle on n'a pas acces) dans un paragraphe (classe p), justement pour pouvoir le differencier de "inscription a la newsletter".
Edit : le pparagraphe n'existe plus.
#Newsletter input[type="submit"] {
color: #chose;
}
change "je m'inscris".
Edit : maintenant, ça s'appelle "Ok".
Enfin,
input {
color:#toto;
}
situe tout en haut, dans la partie des caracteristiques generales (donc ne commence pas par un selecteur type # ou .) change la couleur de ce qu'on tape dans les fenetres du blog (l'adresse email pour s'inscrire a la newsletter et le mot-cle qu'on met dans le module Recherche, par exemple) Edit : et le mot "email" qui est maintenant dans le cadre.
j'ai aussi ajouter dans cette fonction input:
border: outset;
pour avoir le cadre en relief que vous pouvez voir.
Moi, j'trouve ca beau. Pas Vous ? Ah bon.
Cependant, si vous voulez toucher exclusivement le cadre ou l'on met l'adresse e-mail pour s'inscrire a la Newsletter et pas les autres cadres d'input (pour reduire sa longueur, par exemple), il faut alors ajouter la fonction:
#Newsletter input[type="text"] { width: 80%;}
Pour avoir la petite image ci-dessus en-dessous du cadre "Je m'incris" , j'ai ajoute dans le paragraphe le formulaire (<form>)de la Newsletter son url. Ca donne donc finalement :
#Newsletter .box-content p
Edit : #Newsletter .box-content form
{
color:#FFDEAD;
padding-bottom:65px;
background:transparent url(http://idata.over-blog.com/0/05/85/46/gifs-animes/animaux-305.gif) no-repeat scroll bottom left;
}
Le padding-bottom: 'hauteur de l'image' px; permet d'agrandir la taille du paragraphe vers le bas, pour que l'image rentre en entier.
Les lignes inscrite dans le module Newsletter sont souvent difficiles a lire, voire invisibles...
Voici tout ce qu'il faut pour les modifier:
On veut agir uniquement sur le module Newsletter, donc on commence chaque ligne par #Newsletter.
#Newsletter .box-content {
color:#machin;
}
change "inscription a la newsletter". Jusque la, c'est logique.
#Newsletter .box-content p {
color:#truc;
}
change "email", car ce mot est defini (par la partie du code a laquelle on n'a pas acces) dans un paragraphe (classe p), justement pour pouvoir le differencier de "inscription a la newsletter".
Edit : le pparagraphe n'existe plus.
#Newsletter input[type="submit"] {
color: #chose;
}
change "je m'inscris".
Edit : maintenant, ça s'appelle "Ok".
Enfin,
input {
color:#toto;
}
situe tout en haut, dans la partie des caracteristiques generales (donc ne commence pas par un selecteur type # ou .) change la couleur de ce qu'on tape dans les fenetres du blog (l'adresse email pour s'inscrire a la newsletter et le mot-cle qu'on met dans le module Recherche, par exemple) Edit : et le mot "email" qui est maintenant dans le cadre.
j'ai aussi ajouter dans cette fonction input:
border: outset;
pour avoir le cadre en relief que vous pouvez voir.
Moi, j'trouve ca beau. Pas Vous ? Ah bon.
Cependant, si vous voulez toucher exclusivement le cadre ou l'on met l'adresse e-mail pour s'inscrire a la Newsletter et pas les autres cadres d'input (pour reduire sa longueur, par exemple), il faut alors ajouter la fonction:
#Newsletter input[type="text"] { width: 80%;}
Pour avoir la petite image ci-dessus en-dessous du cadre "Je m'incris" , j'ai ajoute dans le paragraphe le formulaire (<form>)de la Newsletter son url. Ca donne donc finalement :
#Newsletter .box-content p
Edit : #Newsletter .box-content form
{
color:#FFDEAD;
padding-bottom:65px;
background:transparent url(http://idata.over-blog.com/0/05/85/46/gifs-animes/animaux-305.gif) no-repeat scroll bottom left;
}
Le padding-bottom: 'hauteur de l'image' px; permet d'agrandir la taille du paragraphe vers le bas, pour que l'image rentre en entier.
Commentaires
Salope, t'est qu'une conne
Tss, Tss, tu viensde faire chuter ton karma, là...
Quand tu te seras réincarné en plaque d'égout, je viendrai faire pisser mon chien dessus et voilà tout !
Tss, Tss, tu viensde faire chuter ton karma, là...
Quand tu te seras réincarné en plaque d'égout, je viendrai faire pisser mon chien dessus et voilà tout !
commentaire n° : 2
posté par :
fafa
(site web)
le: 01/07/2005 20:12:19
J'arrivais pour te dire d'aller jeter un coup d'oeil du cote de http://xtrablog.over-blog.com/article-538009-6.html mais je pense que le charmant message courageusement pas signe precedant le mien est du charmant jeune homme qui a redige l'article...
Desolee de passer t'annoncer ca, sur un article ki n'a rien a voir, mais je preferais te mettre au courant... la connerie de certains est sans fond!
Bisous Zoelie, et longue vie a ton blog!
Desolee de passer t'annoncer ca, sur un article ki n'a rien a voir, mais je preferais te mettre au courant... la connerie de certains est sans fond!
Bisous Zoelie, et longue vie a ton blog!
commentaire n° : 3
posté par :
Vicky
(site web)
le: 02/07/2005 02:39:43
Plus grave, dans sa rubrique e-mail, il balance ton adresse... avec un charmant commentaire
commentaire n° : 4
posté par :
Vicky
(site web)
le: 02/07/2005 02:42:32
Kikou Zoelie Faudra que je teste ca^^
Euh tu as eu mon email???
Longue vie à ton blog ^^ change rien, c'est super :)
sugi
Merci Sugi ! Oui, j'ai eu ton e-mail, j'ai pas eu trop le temps de regarder ça aujourd'hui, mais demain, je m'y mets, promis (je vois un peu le problème à vue de nez...)
Euh tu as eu mon email???
Longue vie à ton blog ^^ change rien, c'est super :)
sugi
Merci Sugi ! Oui, j'ai eu ton e-mail, j'ai pas eu trop le temps de regarder ça aujourd'hui, mais demain, je m'y mets, promis (je vois un peu le problème à vue de nez...)
commentaire n° : 5
posté par :
sugihyde
(site web)
le: 02/07/2005 23:12:55
L'Eté de Kikujiro! Bidonante la scène à la piscine (anthologie presque!) J'ai adoré ce film!
Au fait, t'as eu le temps de voir Tokyo Godfathers?
Un autre très bien mais film-film, cette fois, c'est Old Boy de Park Chan-Wook! Plus du tout dans le même registre, par contre.
B de S à Z
Au fait, t'as eu le temps de voir Tokyo Godfathers?
Un autre très bien mais film-film, cette fois, c'est Old Boy de Park Chan-Wook! Plus du tout dans le même registre, par contre.
B de S à Z
commentaire n° : 6
posté par :
sieglind
(site web)
le: 03/07/2005 22:06:27
je persiste et signe. J'aime l'âme de ton blog
commentaire n° : 7
posté par :
honorius
(site web)
le: 06/07/2005 20:22:43
Et si tu changeais le relief pour qu il soit vers l interieur, plutot qur vers l exterieur, ca serai plus joli non?
commentaire n° : 8
posté par :
Romain
(site web)
le: 07/07/2005 13:26:22
Mais sais-tu, Romain, que c'est une fichtrement bonne idée que voilà !
J'ai changé : Quand pensez-vous ?
En plus, ça me fait découvrir le mot-clé inset (à la place d'outset, donc pour ceusse qui n'auraient pas compris), que je ne connaissais pas.
Merci, Romain !
J'ai changé : Quand pensez-vous ?
En plus, ça me fait découvrir le mot-clé inset (à la place d'outset, donc pour ceusse qui n'auraient pas compris), que je ne connaissais pas.
Merci, Romain !
commentaire n° : 9
posté par :
Zoélie
(site web)
le: 08/07/2005 01:40:29
je ne m'étais pâs encore attaquer à cette partie la, voila, c'est chose faite maintenant!!!^^
tu en penses-quoi?
sugi
tu en penses-quoi?
sugi
commentaire n° : 10
posté par :
sugihyde
(site web)
le: 25/07/2005 23:16:45
Bonjour Zoélie, tout d'abord merci pour toutes ces infos, c'est vraiment génial ! Peut-on mettre une image non pas en dessous, mais au dessus de la newsletter ? Merci bien
commentaire n° : 11
posté par :
Vince
(site web)
le: 29/07/2005 11:17:18
Et bien, c'est la partie qui m'a donné le plus de fil à retordre et encore, je ne suis toujours pas contente de ce que j'ai fait. faut dire que moi et les boutons....
mais un grand merci pour toutes tes explications très claires
mais un grand merci pour toutes tes explications très claires
commentaire n° : 12
posté par :
Clem
(site web)
le: 02/08/2005 16:59:01
Et comment on fait pour changer la couleur de "vous vous être bien inscrit à la newsletter et aller recevoir un mail"? je trouve nul part :-( merci.
commentaire n° : 13
posté par :
Romain
(site web)
le: 14/08/2005 01:29:17
Je suis toujours sur le look de mon nouveau blog...
Qu'est-ce que je dois changer dans le CSS de mon blog pour que mon module newsletter soit présenté exactement comme mon module recherche... ?
En gros, pour que "Je m'inscris" soit comme "Recherche" : en noir (#000000) dans une boite orange (#FFA500).
Qu'est-ce que je dois changer dans le CSS de mon blog pour que mon module newsletter soit présenté exactement comme mon module recherche... ?
En gros, pour que "Je m'inscris" soit comme "Recherche" : en noir (#000000) dans une boite orange (#FFA500).
commentaire n° : 14
posté par :
BD
(site web)
le: 15/08/2005 14:51:50
Salut Zoélie cet arcticle et celui du calendrier mon beaucoup aider merci a toi!!
Bisous
et bonne continuations ;)
commentaire n° : 15
posté par :
fritoss
(site web)
le: 04/01/2006 17:01:38
Je ne comprends pas très bien, où est-ce que je dois mettre le texte qui doit apparaître à la place de "inscription à la newsletter", "email" et "je m'inscris" ?
commentaire n° : 16
posté par :
Lolie
(site web)
le: 08/01/2006 11:04:09
Tu ne peux pas faire changer le texte, car il est code dans la partie HTML qu'on ne peut pas changer sur un blog... Par contre, on peut en changer la couleur ou ajouter une image au-dessus, ca, c'est dans le CSS qu'il faut mettre les lignes indiquees dans l'article.
réponse de : Zoelie (site web)
le: 09/01/2006 17:39:51
D'accord, merci ! Et encore bravo pour ton formidable travail !
commentaire n° : 17
posté par :
Lolie
(site web)
le: 13/01/2006 17:24:44
Si si !!! Zoelie, c'est possible ! C'est possible de changer "inscription à la Newsletter" en ce qu'on veut mais ça ne se voit pas sous Internet Explorer, seulement sous Mozilla. J'ai trouvé l'astuce chez Peur, va voir au lien suivant:
commentaire n° : 18
posté par :
Lolie
(site web)
le: 14/01/2006 09:34:30
Merci pour le lien, j'irai voir !
réponse de : Zoelie (site web)
le: 17/01/2006 14:31:34
Merci Zoélie pour tes conseils et ton blog magnifique. je suis la maman d'une jeune plasticienne Gwen (monde2gwen@free.fr) qui possède un blog sympa dans lequel figure le mien (mais je débute et mon blog a besoin d'un relooking et tes conseils vont m'ètre précieux. Bonne continuation à toi et encore félications.
commentaire n° : 19
posté par :
Atelier d'Evelyne "ÃÂ fleur de laine"
(site web)
le: 16/01/2006 14:52:13
Pas très élégant le commentaire du jeune homme ! on peut ne pas aimer, mais on reste poli - bref tes explications ont l'air super, mais faut déjà être très bon en informatique et moi je ne comprends que ce qu'on me montre de visu ! alors les bouquins, je ne comprends jamais rien - je cherche une âme sympa, habitant près de chez moi et qui me ferait voir sur mon ordi ! je ne désespère pas !!!
en tout cas ton blog est joliment fait et agréable à regarder !
à bientôt
en tout cas ton blog est joliment fait et agréable à regarder !
à bientôt
commentaire n° : 20
posté par :
sylfan
(site web)
le: 17/01/2006 13:46:42
C'est sur que c'est le mieux : quand j'ai debute en informatique (C++), j'etait bien contente d'avoir mon copain pour m'expliquer et repondre a toutes mes question debiles ...
Mais une fois qu'on a pige la logique, on fait ses propres tests et on finit par arriver a ce qu'on veut par essai/erreur ...
Bon courage a toi.
EDIT : pour le commentaire du jeune homme, je l'ai meme pas vu passer ...lol. Je crois que OB a supprime une serie de spams insultants ... ;)
Mais une fois qu'on a pige la logique, on fait ses propres tests et on finit par arriver a ce qu'on veut par essai/erreur ...
Bon courage a toi.
EDIT : pour le commentaire du jeune homme, je l'ai meme pas vu passer ...lol. Je crois que OB a supprime une serie de spams insultants ... ;)
réponse de : Zoelie (site web)
le: 17/01/2006 14:50:11
merci beaucoup pour ces quelques explications qui m'ont bien aidé. J'ai encore quelques soucis...
le texte "inscription à la newletter" est collé ou décalé dans la marge à gauche et je n'arrive pas à le ramener à hauteur de la case 'imput text".
y aurait-il une différence entre :
.box content
.box content p
. box content form
le texte "inscription à la newletter" est collé ou décalé dans la marge à gauche et je n'arrive pas à le ramener à hauteur de la case 'imput text".
y aurait-il une différence entre :
.box content
.box content p
. box content form
commentaire n° : 21
posté par :
zoolook
(site web)
le: 08/02/2006 15:26:33
J'ai un peu du mal a t'aider si je ne vois le module ... Pourrais-tu le remettre ? (et eventuellement, poser la question sur le forum pour une reponse rapide)
Ce que je peux te dire, c'est que les differents elements s'imbriquent ainsi :
.box-content -> "inscription a la newsletter"
-> .box-content form -> input [type="text"] (Email)
-> input [type="submit"] (ok)
Donc, si tu mets margin-left: 10px (une marge a gauche de 10px) a #Newsletter .box-content form { }, les deux input vont etre decaller de 10px vers la droite par rapport au texte "inscription" ...
Ce que je peux te dire, c'est que les differents elements s'imbriquent ainsi :
.box-content -> "inscription a la newsletter"
-> .box-content form -> input [type="text"] (Email)
-> input [type="submit"] (ok)
Donc, si tu mets margin-left: 10px (une marge a gauche de 10px) a #Newsletter .box-content form { }, les deux input vont etre decaller de 10px vers la droite par rapport au texte "inscription" ...
réponse de : Zoélie (site web)
le: 09/02/2006 11:24:43
Arrf, excuse moi Zoelie...
Mais c'est bon, je m'en suis sorti.
Et du coup, je n'utilise plus le module...
J'ai un lien directement vers la fenêtre popup d'inscription.
merci encore d'avoir pris le temps de répondre et regarder.
Mais c'est bon, je m'en suis sorti.
Et du coup, je n'utilise plus le module...
J'ai un lien directement vers la fenêtre popup d'inscription.
merci encore d'avoir pris le temps de répondre et regarder.
commentaire n° : 22
posté par :
Zoolook
(site web)
le: 19/02/2006 17:00:05
Super, merci, je n'ai pas réussi à tout appliquer, mais c'est un bon début...
commentaire n° : 23
posté par :
Romain
(site web)
le: 25/12/2006 16:16:41
Trackbacks
Aucun trackback pour cet article
smack
lionel des anges