who's online

28/10/2008

Instalando LinkBar no seu blog

| |

Gente sabe aquela barra que tem links como Home,parceria,templates e etc... que voce ve em varios blogs....Entao aquilo se chama LinkBar e vou ensinar como instalar uma daquelas no seu blog...

Procure no seu template por isso:


#header .description {
Depois do do codigo inteiro desse CSS cole isso aqui:

/* -----   LINKBAR   -----  */
#linkbar {
margin: 3px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 100%;
position: relative;
background: #3075B8;
border: 0px solid #fff;
border-bottom: 0;
}

#linkbar ul {
margin: 0px 0px 0px 0px;
padding: 5px 5px 7px 5px;
text-align: right;
list-style-type:none;
}

#linkbar li {
display: inline;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

#linkbar h2 {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: none;
visibility: hidden;
}

#linkbar a {
clear: both;
margin: 0px -4px 0px 0px;
padding: 3px 20px 3px 20px;
width:100%;
text-decoration:none;
font-family: arial, sans-serif;
font-weight: bold;
font-size: 12px;
color: #fff;
border-right: 1px solid #fff;
}

#linkbar a:hover {
color: #000;
background: #fff;
}
Depois procure por esse codigo:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Titulo do seu blog(Cabeçalho)' type='Header'/>
</b:section>
    </div>
 Cole apos esse codigo esse codigo aqui:

<div id='linkbar-wrapper'>
<b:section class='linkbar' id='linkbar' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Linkbar' type='LinkList'/>
</b:section>
</div>
 Pronto depois e so ir em Layout-Elemetos da Pagina, e em baixo do seu cabeçalho vai estar lar o seu gadget de linkbar, depois e so adicionar os links de sua preferencia....

vlw gente... logo mais eu trago outro tutorial...

6 Curiosos:

Paula Cristina disse...

Oi ! Tudo bom ?!

Olha, tá rolando um concurso lá no Merthiolate e o vencedor vai ganhar 1000 Cartões de Visitas !

Passa por lá e dá uma olhada no regulamento.

beijos

Ravenc disse...

Oh vlw pela
dica
abçs

ώorine™ disse...

muitoooooooooo booooooooooom essa dica

gostei e eu consegui , fazr isso no meu blog !!!

Anônimo disse...

Cara eu naum achei o codigo "#header .description {" procurei de tudo que pe jeito até modelo expandido, mas eu não achei, até tentei colocar mesmo assim, por favor me ajude eu gostaria de ter um linkbar no meu blog.

Dota disse...

Virtualz1 no seu caso você teria que colocar o CSS acima desse codigo:

/*-- (Menu/Nav) --*/

e faz o resto como está ai que da certo...

Alessandro Nicoli de Mattos disse...

Olá,

Muito bom este linkbar. Mas tenho uma dúvida e sugestão. Eu gostaria de inserir um ícone PNG de 32x32 do lado esquerdo de cada link. É possível implementar isso?

Obrigado,

http://comomentirsutilmente.blogspot.com/ (em fase de testes)

Novo Comentário