Tutorial colocando side bar grande no blog


E ai galera me pediram e eu vou encinar  como adicionar aquela side bar grande para ''seguidres pag do faceboock entre outros''
1° de tudo faça backup do seu template :)

2° va em editar html e procure pela tag ]] e cole o codigo abaixo acima da tag ]]


/*----------------------------------------------------
{--------}  SideBar  {--------}
----------------------------------------------------*/
.articles-right {
width:500px;
float:left;
}
#sidebar4 {
float: center;
width: 500px;
height:450px;
font: 12px Arial, Tahoma, Helvetica, sans-serif;
margin:30px 0px 0px 0px;
}
.sidebar4 h2 {
padding:45px 0px 35px 194px;
color:#fff;
text-shadow:1px 1px #000;
font: bold 17px Arial, Helvetica, sans-serif, Verdana, Tahoma;
overflow: hidden;
background: url(Imagen do topo) no-repeat;
height:40px;
}
#sidebar4 .widget-content{
background: url(IMAGEN DO MEIO) repeat-y;
wight:500px;
height:250px;
padding:0px 15px 0px 15px;
margin:0px 0px 0px 0px;
}
#sidebar4 .widget {
margin:0px 0px 20px 0px;
padding:0px 0px 80px 0px;
background: url(IMAGEND DO RODAPE) no-repeat bottom left;
}

3° Bom logo apos ter adicionado o codigo procure por esta tag 
<div id='main-wrapper'> (pode variar o nome dependendo do template)

4°Adicione o codigo abaixo acima da tag 

<div class='articles-right'>
<!-- begin.SIDEBAR1 -->
        <b:section class='sidebar4 section' id='sidebar4' preferred='yes'>
</b:section>
<!-- End.Sidebar1 --> </div>

bom e esta pronto a sua side bar :D
-----------------MODIFICANDO O CODIGO-----------
°= TAG HTML
°= IMAGEN
Compartilhe este artigo: :

Postar um comentário

 
Support : Miguel Tornquist
Copyright © 2011. Bullet Run Brasil - All Rights Reserved

Proudly powered by Blogger