« Insérer une vidéo DailyMotion | Page d'accueil
22/06/2007
Insérer sa propre bannière
Suite à une forte demande des utilisateurs concernant la personnalisation de la bannière, voici un tutorial qui vous expliquera pas à pas comment procéder pour mettre votre bannière à la place de celle qui existait déjà.
- Dans un premier temps, il vous faut ajouter votre bannière à vos fichiers.
- Récupérez ensuite le lien de votre image (en cliquant sur le nom).
Arrive maintenant la partie la plus difficile mais si vous suivez bien les étapes, tout devrait aller.
- Allez dans les configurations avancées de l'onglet "PRESENTATION" et modifiez votre feuille de style.
Pour plus de sécurité, sauvegarder son contenu dans un éditeur de texte de votre choix avant toute modification.
- Il s'agit maintenant de modifier les lignes de code concernant votre bannière. Pour cela, repérer la ligne #banner.
Vous devriez avoir les lignes suivantes:
Les valeurs qui suivent les ":" peuvent différer suivant les modèles.
- Dans #banner, ajouter une ligne : display:none;. Si cette ligne existe déjà, modifiez sa valeur par none. Ceci permet de faire disparaître la bannière préexistante sans pour autant les enlever ce qui permet de rester référencé.
- A présent, repérez le bloc avec #banner-img et remplacez display:none; par display:block;
- Vous pouvez maintenant ajouter votre image en remplaçant la ligne background:#...... par background:#XXXXXX url("url_de_votre_bannière") no-repeat 0% 0%;
Remplacez XXXXXX par le code hexadecimal de la couleur dominante de votre bannière
- Ajoutez height: hauteur_de_votre_bannière; dans le bloc précédent et dans le bloc div.img-link a {.
Votre feuille de style doit maintenant ressemblez à ce qui suit:
Pour les modifications portées sur le design 4 (en comptant à partir du haut de la gauche vers la droite) uniquement:
* Au niveau des styles "#container .container-decorator1" : remplacez "90px" dans background: transparent url(http://[...]) no-repeat 0% 90px; par la somme suivante : hauteur de votre image + marge de 9px.. Ex : votre image fait 120px en hauteur, le code à insérer est : "129px"
Pour les modifications portées sur le design 5 (en comptant à partir du haut de la gauche vers la droite) uniquement.
* Au niveau des styles "#container .container-decorator1" et ".album-container .container-decorator3" : remplacez "90px" dans background: transparent url(http://[...]) no-repeat 0% 100px; par la somme suivante : hauteur de votre image + marge de 8px.. Ex : votre image fait 120px en hauteur, le code à insérer est : "128px"
10:30 Publié dans Personnaliser | Lien permanent | Commentaires (18) | Trackbacks (0) | Envoyer cette note
Trackbacks
Voici l'URL pour faire un trackback sur cette note : http://technoblog.blogspirit.com/trackback/1298818
Commentaires
ok super tout ca ! mais quelle est la taille originale de la bannière ? (en pixels svp)
est ce que je peux mettre une bannière sur la moitié de la page unikement ?
Ecrit par : lolo | 13/06/2007
ok super tout ca !
mais quelle est la taille originale de la bannière ? (en pixels svp)
est ce que je peux mettre une bannière sur la moitié de la page unikement ?
Ecrit par : lolo | 13/06/2007
Bonjour, il n'y a pas de taille définie pour la bannière. Vous verrez lorsque vous insérer une bannière plus petite qu'il y a une couleur de fond. Voilà pourquoi nous mettons background: XXXXXX etc... afin de la définir
Ecrit par : Michel | 15/06/2007
Bonjour, il n'y a pas de taille fixe pour la bannière.
Vous verrez que lorsque vous insérer une bannière qui est plus petite, une couleur de fond apparaît. Voila pourquoi dans la ligne background nous vous demandons de mettre le code hexadecimal de la couleur dominante de votre bannière.
Ecrit par : Michel | 15/06/2007
J'aimerais changer la couleur de la page d'acceuil de mon blog qui est sur hautetfort comment dois-je proccéder? J'aimerais qu'elle soit toute noire!
Merci d'avance.
Ecrit par : Jeanne | 19/06/2007
Merci de toute votre patience et de votre souci pédagogique pour aider les bricoleurs du html qui rêvent de s'exprimer avec un petit plus "esthétique". Dans le déroulement des opérations, vous écrivez :
"A présent, repérez le bloc avec #banner-img et remplacez display:none; par display:block;"
Or sur l'image du résultat, à la balise "banner-img", on voit les deux commandes.
Ensuite ça veut dire quoi svp "design 4" et "design 5" ? Et sur la page de feuille de style, j'avoue ne pas trouver "#container .container-decorator1". :-(
P.S. : petit aparté, je conseille le petit programme PIXIE qui est bien utile pour choper le code html de couleurs grâce à une pipette se placant sur vos pages web ou autres types de documents.
Ecrit par : Newbie | 22/06/2007
Bonjour,
les modifications ont été apportés. ;)
Ecrit par : Michel | 22/06/2007
Le petit programme PIXIE?
Est ce une réponse à ma question Newbie?
Ecrit par : Jeanne | 22/06/2007
j'ai testé sur un photoblog hautetfort, et ça ne marche pas...
Ecrit par : Sophie | 18/07/2007
Bonjour
J'ai fait l'essai et je dois etre nulle car ca ne marche pas, ça me fait un fond marron alors que mon image c'est un bois et que la couleur de fond que j'ai choisi doit etre verte. Je ne comprends pas pourtant j'ai bien suvi les instructions je l'ai même refait deux fois. pas simple a faire ça enfin ça restera comme ça dommage car ma bannière et jolie;
Merci quand même
Noisette
Ecrit par : Noisette | 23/07/2007
Wow, j'aurais bien aime lire ton post avant de galerer pour ecrire mon article.
Je vais rajouter un lien car ton post est beaucoup plus detaille.
Dans le meme esprit, est ce que tu sais ou je peux trouver l'API smarty (les tags ainsi que leurs parametres) supportes par haut & fort. Y'a quelques infos dans les templates mais ca ne pas l'air exaustif.
Merci d'avance
Ecrit par : PG | 23/08/2007
Merci pour ces conseils !!!
http://les-annonces-gratuites.blogspot.com
Ecrit par : courti | 02/11/2007
Depuis peu j'ai au dessus de ma bannière personnalisée, une autre bannière de PUB (moche) dont je ne veux pas. Savez-vous comment l'enlever cad avoir un blog sans pub (sauf pour Hautetfort tout en bas du blog).
Merci
Ecrit par : Valérie | 11/11/2007
Pour avoir un blog sans publicité il faut passer en offre payante.
Ecrit par : Damien | 12/11/2007
Superbe article! Merci pour elle.
S'agissant,
James
Ecrit par : James | 02/12/2007
Waouh! Votre site est vraiment génial, merci pour tous ces conseils. Je voulais vous demander: Y'a t'il un moyen sur hautetfort de connaitre le nombre d'abonnés au flux RSS de notre blog et même pourquoi pas qui sont ces abonnés??
Ecrit par : Charlye | 10/01/2008
Hello et merci pour cet article
la seconde étape : comment ajouter un link sur la bannière (vers pasge d'accueil, bien sûr)
j'ai essayé de rajouter une balise
Ecrit par : madgiksoul | 02/04/2008
Bonjour,
Sur notre blog hautetfort, je souhaite intégrer dans ma bannière un flash au lieu du gif actuellement en place pour une question de qualité d'image. Quelqu'un sait-il comment procéder ?
J'arrive parfaitement à faire afficher mon élément flash dans une note mais pas dans ma bannière.
Merci pour votre aide.
Edwin
Ecrit par : Edwin | 14/07/2008