23 avril 2007
Changer la bannière, en mode avancé
Oui!!
Bon alors,
déja dans un premier temps, ce tuto s'adresse à ceux qui veulent changer de bannière, pour ceux qui n'en avaient pas voir plutôt celui-ci:===>Mettre une bannière en avancé alors que je n'en avais pas
On s'est créé un gentil blog, en mode normal on s'est mis une bannière, toute belle

Puis on a évolué, sommes passés en mode "avancé", avons ajouté des trucs de ci de là....
Et on veut changer de bannière parce que du coup ça ne correspond plus trop....
Heuuuuu oui, mais en mode avancé, il n'y a plus le choix de chargement du logo ou de la bannière,
- Diantre!! Mais où donc vais-je pour la changer, cette belle et nouvelle bannière?
Première étape,
Créer un nouveau message, qu'on sauvera en mode brouillon, pour pouvoir y retourner de temps en temps.
Et là, charger la photo (mais attention, pas par le traditionnel lien "d'insertion d'image", mais par l'insertion d'un fichier. Car.... la photo serait redimensionnée et ne correspondrait plus à la longueur de la bannière.

Ceci effectué, basculer en mode "html" [avec la touche <> ] et copier l'adresse url du document chargé.

Sauvegarder (publier en mode brouillon ne le rend pas accessible au public et permet de pouvoir récupérer au besoin l'adresse du fichier dans "mes documents" du blog).
Deuxième étape,
Editons donc nos fichiers de mise en page, et plus principalement la feuille de style
Recherchons la ligne du background dans le div #topbar-logo
On sélectionne l'adresse de l'ancienne bannière, et on y colle la nouvelle,
il se peut aussi que les dimensions diffèrent, donc ne pas oublier de modifier height: nouvellehauteurenpx;
on valide, et on jette un oeil sur le résultat
(réactualiser la page au besoin "[Ctrl] + [F5]")
Commentaires
voui Lynou, ton
background #3346C66:url("http://p8.storage.canalblog.com/82/58/362421/18535749.jpg)no-repeat 0 0;
"
n'est pas bon, utilise plutôt:
[G]background: #3346C66 url("http://p8.storage.canalblog.com/82/58/362421/18535749.jpg") no-repeat 0 0;[/G]Bonjour,
Merci pour ton aide si rapide, mais ca ne marche toujours pô !!
Je suis débutante en paramétrage de blog, pas super douée apparamment !! Sniffffffff je n'y comprends rien, j'ai fait comme tu m'as dit et rien de rien !! je déserpère vraiment
je te remets le copié-collé au cas ou :
#topbar-logo {
border-top-style: double;
border-right-style: double;
border-bottom-style: double;
border-left-style: double;
border-width: 5px;
border-color;
background:#3346C66 url("http://p8.storage.canalblog.com/82/58/362421/18535749.jpg") no-repeat 0 0;
height:90;
display: block;
}
div .logolink a {
display: block;
text-decoration: none;
width: 100%;
height: 97px;
}
#topbar {
background-color: #FFFFFF;
border-top-style: double;
border-right-style: double;
border-bottom-style: double;
border-left-style: double;
border-width: 5px;
border-color: #99B2CC;
padding: 10px;
display: none;
}
désolée de t'embêter encore avec ca, et merci d'avance
Lynouvoui, mais là Lynou40, c'est parce que ton adresse n'est pas reconnue
[Img]:url://storage.canalblog.com/82/58/362421/18535749.jpg[/Img] il n'y a rien qui s'affiche
pas d'image, donc ça ne peut pas fonctionner.
je viens de jeter "un oeil" sur ton blog, il y a une bannière, peut être as-tu changé l'adresse :)Bonsoir alérion
Tout d'abord je voudrai te remercier pour ton aide si généreuse.
Enfin voilà j'ai réussi grace à toi. Bon il me reste un soucis avec la taille de la bannière mais le plus dur est fait, de plus j'ai fait une mauvaise manip, créée un autre modèle sans m'en rendre compte, enfin tu vois quand je dis que je suis débutante et vraiment nulle !! Donc j'ai supprimé l'autre modèle, et ma mauvaise manip a basculée mon site en avancée (iréversible) !! donc je me démène maintenant à tout prendre en main. Moi qui ne connais rien au language htlm, je te dis c'est pas du gateau pour moi !!
mais bon avec de l'aide aussi précieuse que la tienne, on va y arriver !! heureusement que des gens comme toi partage leur savoir sans rien demander en retourd, et je t'en remercie pour cela.
Longue vie à ton site génial et merci merci
LynouJ'ai bidouillée seule
comme j'aime le changement je prépare d'avance mes nouveaux skins en mode classique et quand je suis OK je balance en mode avancé
Je vous ai beaucoup lu sur CB à ce jour je m'améliore début fin février, mais je ne réussis pas à mettre ma musique, je suis inscrite chez WAT, mais je suis dans le flou pour mettre les balises, j'ai ttes les indications de WAT... mais rien, je crois que c'est mon AGE!![Youpiii]
Cordialement votre CZ MERCI si vous pouvez m'orienter
[Héééhooo]bonsoir, je ne maîtrise pas le mode avancé mais c'est trop tard...
j'ai suivi tes instructions mais rien n'y fait !
un oeu d'aide?
merci beaucoup
#topbar-logo {
border-top-style: none;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-width: 1px;
border-color: #FFFFFF;
background: #transparent ; url(")" rel="nofollow">http://p1.storage.canalblog.com/11/66/447087/25385099.jpg">) no-repeat 0% 0% ;
height: 150px;
display: block;
}
div .logolink a {
display: block;
text-decoration: none;
width: 100%;
height: 0px;
}
#topbar {
background-color: #transparent;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-width: 1px;
border-color: #FFFFFF;
padding: 10px;
display: block;
}Bon voila.........
Je ne sais pas comment j'ai fait mais ma bannière ne s'affiche plus. J'ai bien sûr étudier toutes tes explications mais vraiment je ne me sors pas..... Serait t'il possible d'avoir un coup de main
#topbar-logo {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-width: 1px;
border-color: #;
background: # url("http://p7.storage.canalblog.com/78/51/373395/27884781.jpg")no-repeat 0% 0%;
height: 197px;
display: block;
Je ne vois pas ce qui cloche et pour être franche je n'y comprends rien.
Merci de m'aider !!!!!bah oui là déjà:
background: # url("http://p7.storage.canalblog.com/78/51/373395/27884781.jpg")no-repeat 0% 0%; [Non]
aller on va simplifier ;)[:)]
mets ça:
[G]background: transparent url(http://p7.storage.canalblog.com/78/51/373395/27884781.jpg) no-repeat 0 0;[/G][Oui]bonjour bonjour,
je n'arrive pas à trouver de solution et pourtant je navigue, je navigue.
Bref, j'ai fait un changement de bannière, jusque là tout va bien sauf que (ben oui quand même) ma bannière n'ayant pas la même dimension que la première (je suis en mode avancé) il se trouve un grand cadre blanc juste sous la bannière... Comment que je fais môa ??!!! merci pour ton aide !
body {
margin: 0px 0px 0px 0px;
text-align: center;
background-color: #339999;
}
#container {
width: 901px;
padding: 0px;
background-color: #FFCCCC;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-width: 1px;
border-color: #FFFFFF;
margin-right: auto;
margin-left: auto;
}
#content {
float: left;
width: 500px;
background-color: #FFCCCC;
border-top-style: none;
border-right-style: dotted;
border-bottom-style: dotted;
border-left-style: none;
border-width: 1px;
border-color: #663300;
overflow: hidden;
}
#rightbar {
float: left;
width: 200px;
background-color: #339999;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-width: 1px;
border-color: #;
overflow: hidden;
}
#leftbar {
float: left;
width: 200px;
background-color: #339999;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-width: 1px;
border-color: #;
overflow: hidden;
http://monaange.canalblog.com/
[Bravo][Bravo][Bravo][Bravo][Bravo]aaargh!
Salut Alérion, ton blog est super, mais il m'arrive la même mésaventure que ci-dessous, pourrais tu m'aider stp?
Merci d'avance,
mavalca
[I]"Salut, j'ai tout bien fait comme tu dis, mais ça marche pô...
La première fois, j'ai capté qu'il fallait un jpg donc ça c bon, mais est-ce qu'il y une taille de pixel ou un poids à respecter??
Sinon, sur ma feuille de style générale, à "topbarre logo", y'a juste écrit backgroung #333;
Alors moi j'ai enlever le ; et j'ai mis ça (en tout) :
background: #333 url "http://p8.storage.canalblog.com/81/10/293113/13576265.jpg"
Qu'est-ce qui cloche? Merci pour ta réponse!Bouquet
Alice
nharicotvert@gmail.com
http://frenchbean.canalblog.com
Posté par nharicot, 26 mai 2007 à 20:34
il faut changer beaucoup de chose, en fait, et tu n'avais pas de bannière avant...
je te mail la solution :)
Posté par Alérion, 26 mai 2007 à 22:52"
[/I]coucou
j'aurais besoin d'aide car je n'arrive pas à changer ma bannière et c'est pas fautes d'avoir essayé.
Je t'explique : j'ai installé ma bannière avant de passer en mode avancé (bannière faite avec photofiltre et unfreez) et là je voudrais la changer pour la mettre avec un générateur de glitters. mais z'y arrive pas.
Je t'avoue que j'ai demandé conseil à Démolite qui n'a pas pus m'aider[Triste ouin]car elle pense que le problème vient de chez canalblog[Triste ouin]
voici le code avec l'adresse de la bannière que je veux installer
#topbar-logo {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-width: 1px;
border-color: #;
height: 25Opx;
display: none;
background:transparent url(":url:storage.canalblog.com/24/19/415715/31635443.gif") no-repeat 0% 0%;
height: 130px;
display: block;
et là l'adresse de la bannière qui apparait mais que je ne veux plus
:url:storage.canalblog.com/44/37/415715/31638248.gif
HELP ME PLEASE
merci d'avance[Attend]
Salut, j'ai tout bien fait comme tu dis, mais ça marche pô...
La première fois, j'ai capté qu'il fallait un jpg donc ça c bon, mais est-ce qu'il y une taille de pixel ou un poids à respecter??
Sinon, sur ma feuille de style générale, à "topbarre logo", y'a juste écrit backgroung #333;
Alors moi j'ai enlever le ; et j'ai mis ça (en tout) :
background: #333 url "http://p8.storage.canalblog.com/81/10/293113/13576265.jpg"
Qu'est-ce qui cloche? Merci pour ta réponse![Bouquet]
Alice
nharicotvert@gmail.com
http://frenchbean.canalblog.com[YoupYoup][YoupYoup][YoupYoup][YoupYoup][YoupYoup][YoupYoup][YoupYoup][YoupYoup]
Merci!!
Je pensais que la banière de base était le titre du blog en fait (bécasse que je suis!).
[Trinquer] Chus trop contente, même si c'est pas ma banière définitive, je met ton blog en favori au cas où!
Bon week end,
nharicotau secours
merci de tes explications très très claire mais en fait, je veux savoir où dois-je mettre le code de l'horloge si je veux le mettre dans la colonne droite de mon blog, est ce dans la feuille de style générale ou autre et où exactement, je vous remercie vivement, je suis passée en mode avancé, j'ai peur de faire quelque chose et tout gacher
merci
http://amounamazyouna.canalblog.com/mauvaise application
je pense que je n'ai pas bien appliqué ton explication et j'ai tout enlevé l'ancienne bannière et la nouvelle ne s'est pas mise en place,
sauvez moi comme toujours, merci d'avance
http://amounamazyouna.canalblog.com/oui oui oui [Oui] oum rayane, en fait, tu ne dois pas avoir d'espace entre [G]url[/G] et [G]("http://p9.storage.canalblog.com/95/05/275315/14057577.jpg")[/G] ils doivent etre collé:
[G]url("http://p9.storage.canalblog.com/95/05/275315/14057577.jpg")[/G] (c'est magique;))ha bin vi, mais fallait juste retirer l'espace et laisser le reste... :)
bon rempace ta ligne par
background: #FF9999 url("http://p9.storage.canalblog.com/95/05/275315/14057577.jpg") no-repeat 0 0;
[Coder] les joies de la "prog" :)problème bannière
Bonjour,
Comme tu peux le voir sur mon site actuel, ma bannière est uniquement constituée d'un texte et d'une couleur. Je suis passé en mode avancé et j'aimerais à présent changer cette bannière pour y mettre une photo en fond (tout en gardant le même texte par dessus)... Pourrais-tu me donner une solution?
Merci!tu as déjà ta bannière?
sachant qu'il faut que tu écrives sur ton dessin, c'est d'office ou la bannière ou le texte, si tu veux les deux il te faut l'écrire directement sur ta bannière.
ensuite, tu "suis" à peu près les différentes étapes expliquée ici, sauf que toi dans ton CSS tu n'as pas de bacground :... tu repère le [G]background-color[/G], et tu le remplace par [G]background: #couleur url(detaphoto) no-repeat 0 0;[/G]
ce n'est pas terminé... [Coder][Coder][Coder]
là où c'est noté display:none; (toujours dans #topbar-logo) et remplace [G]none[/G] par [G]block[/G]
et dans #topbar tu fais l'inverse [I](remplace [G]block[/G] par [G]none[/G])[/I]bonjour alérion, je vois que tu t'y connais mieux que moi... (c'est un euphémisme, je rame, je galère, j'en peux plus!)(tout ça va finir par la fenêtre)(il me faut une bière) bref, je vois que quelqu'un (n'haricot) t'a déjà demandé de répondre à cette question, et tu as l'air de l'avoir satisfaite, alors voilà, j'ai réussi à trouver l'adresse de la bannière qu'on m'a faite (et oui, en plus, je demande à tout le monde qu'on me fasse tout... y'a vraiment des gens cool autour du monde!), mais comme je n'avais pas de bannière (je ne change pas de bannière en fait, je veux en mettre une), d'après ce que tu dis, il ne suffit pas de coller l'adresse dans "topbar" background. Alors si tu as le temps un de ces quatre, moi aussi ça m'intéresse de savoir faire ça... bravo pour tes explications déjà, j'ai avancé et compris des trucs...
lili violettebon, je ne sais pas si tu n'as que ça à foutre, mais j'ai suivi les explications, je n'ai plus de titre du tout. Je t'ai fait un copier coller de ce que ça donne, peut- être que tu comprendras mieux que moi! (et pour la bière, c'est quand tu veux!)
}
#topbar-logo {
border-top-style: none;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-width: 1px;
border-color: #99B2CC;
background: #CC6600 url(http://p0.storage.canalblog.com/04/53/236448/16781028.jpg)no-repeat0 0;
height: 0px;
display: block;
}
div .logolink a {
display: block;
text-decoration: none;
width: 100%;
height: 0px;
}
#topbar {
background-color: #CC6600;
border-top-style: none;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-width: 1px;
border-color: #99B2CC;
padding: 10px;
display: none;
}
a {
text-decoration: none;
}
a:link {
color: #993333;
alors, docteur, il va bientôt mourir mon blog?AU SECOURS...!!
Bonjour, je voudrais mettre 1 bannière en mode avancé, mais je rame un peu!!
Voici ce que j'ai:
#topbar-logo {
border-top-style: none;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-width: 3px;
border-color: #33FF99;
background: #FFFFCC; url("http://img341.imageshack.us/img341/1461/banniereradiojf2.png") no-repeat 0 0;
height: 5px;
display: block;
Y a un problème quelque part??
Par avance, merci.
Frèd...
Bon, on s'est déjà cotoyer dans le passé, figures toi qu'aujourd'hui je change de bannière... Je sais pas bien si tu vois le délire...
Bon alors j'ai tout bien réussi, sauf que j'ai beau modifier la taille du doc de base, quand j'importe le tout sur canalblog, il ne veut pas aller plus loin que colonne de gauche+colonne du milieu + la moitié de la colonne de droite (au lieu de toute la colonne de droite...
Alors je regarde dans la feuille de stule générale, et j'y vois ça :
#topbar-logo {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-width: 1px;
border-color: #;
background: #333 url("http://p5.storage.canalblog.com/55/44/293113/17923839.jpg") no-repeat 0% 0%;
height: 270px;
display: block;
J'me suis dit "c'est p'tet le height, mais en fait j'pense que ça doit parler de la hauteur, et donc je vois rien concernant la largeur, si? Nan? Peut être?
T'as une idée?? [Attend]
Merci...


Bonsoir,
Etant vraiment nulle en informatique, je viens te demander de l'aide car je m'arrache les cheveux avec ma bannière !!!
elle ne veut pas s'afficher dans mon blog !!!!
#topbar-logo {
border-top-style: double;
border-right-style: double;
border-bottom-style: double;
border-left-style: double;
border-width: 5px;
border-color: #CCFFCC;
background #3346C66:url("http://p8.storage.canalblog.com/82/58/362421/18535749.jpg)no-repeat 0 0;
"
height:90;
display: block;
}
div .logolink a {
display: block;
text-decoration: none;
width: 100%;
height: 97px;
}
#topbar {
background-color: #FFFFFF;
border-top-style: double;
border-right-style: double;
border-bottom-style: double;
border-left-style: double;
border-width: 5px;
border-color: #99B2CC;
padding: 10px;
display: none;
}
a {
Merci de ton aide
Lynou