BlogTuto

Tuto pour blog et assistance blogueur. Dépannage des blogueurs, passage en mode avancé accompagné, relooking blog, bannière pour blog

Attention !
Ce blog a déménagé et n'est plus mis à jour. Rendez vous sur le nouveau blog :

http://www.blogtuto.org/

jeudi 30 octobre

Un menu de plus sous la bannière

ça fait un bout de temps que je cherche un menu comme celui là.
Un menu qui s'intègre facilement dans une bannière qui soit facile à corriger.
Voici donc le principe.
la bannière doit avoir un fond uni pour intégrer harmonieusement les liens du menu.
Visuellement ça donne ça

Image_1

Donc ça donne dans le script deux choses

Sur la feuille de style :

#topbar-logo {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-width: px;
    border-color: #;
    background: #000000 url("http://p4.storage.canalblog.com/43/75/302457/31869260.jpg") no-repeat 0%; 0%;
    height: 250px;
    display: block;
}
div .logolink a {
    display: block;
    text-decoration: none;
    width: 100%;
    height: 250px; <-- ici la hauteur de la bannière
}
#topbar {
    background-color: #CBAFBE; <-- ici la couleur du fond de votre bannière
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-width: 1px;
    border-color: #;
    padding: 10px;
    display: block; <-- ici il faut avoir block à la place de none

Dans la page d'accueil, les archives, la page d'un message et la page de l'auteur il faudra ajouter le script de cette façon :

<body>
<div id="container"> <div id="topbar-logo"><div class="logolink"><a href="<$BlogURL$>"</a></a></div></div><div id="topbar">

<h1>
[<a href="http:votreadresse.com"> Accueil </a> ]
[<a href="http://votreadresse.com"> titre </a> ]
[<a href="http://votreadresse.com"> titre</a> ]
[<a href="http://votreadresse.com"> titre</a> ]
[<a href="http://votreadresse.com"> titre </a>']

</div> </h1>

<!-- colonne de gauche-->

<div id="leftbar"> <div class="navlinks">

Vous avez en gras la partie à coller!

Et voilà le tour est joué!

Chouette non?


Tags :
Posté par Lavande à 17:08 - Commentaires [1] - Permalien [#]



Commentaires

    heu bin j'y comprends rien à tous ces codes, mais merci quand meme pour tout ce boulot que tu fais pour nous !!!

    Posté par virginie, vendredi 31 octobre à 14:20

Poster un commentaire







Haut de Page