12 de nov de 2009

Sidebar que se expande (fica escondida)


Para que em seu blog a sidebar seja expansível como neste modelo,  leia com atenção as instruções abaixo. Respire, tenha paciência e perseverança que você irá conseguir.
Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.


Vá até o HTML de seu blog e depois do código:
]]></b:skin>

 Cole o código abaixo.

<script language='javascript'>
function showdiv(ativar,id1,id2)
{ var A=document.getElementById(id1);
var B=document.getElementById(id2);
if(ativar==&#39;sim&#39;)
{
B.style.display = &#39;block&#39;;
A.style.display= &#39;none&#39;;
}
else
{
A.style.display = &#39;block&#39;;
B.style.display= &#39;none&#39;;
}
}</script>

Agora procure pelo seguinte código: (sem expandir modelos de widget)

<div id='sidebar-wrapper'>


Cole antes dele o código abaixo:


<div id='ocultarcat'>
<div class='mais'>
<a href='#' onClick='showdiv(&quot;sim&quot;,&quot;ocultarcat&quot;,&quot;mostrarcat&quot;); return false'><center><strong> Mostrar sidebar &#9660;</strong></center></a>
</div>
</div>
<div id='mostrarcat' style='display:none'>
<div align='left'>
<div class='menos'>
<a href='#' onClick='showdiv(&quot;nao&quot;,&quot;ocultarcat&quot;,&quot;mostrarcat&quot;); return false'><center><strong>Ocultar sidebar &#9650;</strong></center>
</a>
</div>


Agora  com bastante atenção, procure por um código como este abaixo, que  deverá estar um pouco abaixo de onde você acabou de colar o último código.


</b:section>
</div>

E cole este código abaixo:

</div>
</div>

Portanto o código deverá ficar assim:

<div id='ocultarcat'>
<div class='mais'>
<a href='#' onClick='showdiv(&quot;sim&quot;,&quot;ocultarcat&quot;,&quot;mostrarcat&quot;); return false'><center><img src='http://3.bp.blogspot.com/_BaCxSD9NFn8/SvotKdgB9QI/AAAAAAAABDg/E4E6PC67ufo/s1600/setabaixo.png'/><strong> Mostrar sidebar &#9660;</strong></center></a>
</div>
</div>
<div id='mostrarcat' style='display:none'>
<div align='left'>
<div class='menos'>
<a href='#' onClick='showdiv(&quot;nao&quot;,&quot;ocultarcat&quot;,&quot;mostrarcat&quot;); return false'><center><img src='http://4.bp.blogspot.com/_BaCxSD9NFn8/SvotJ5QIdKI/AAAAAAAABDY/m3L_pOSM9Ps/s1600/seta%2Bcima.png'/><strong>Ocultar sidebar &#9650;</strong></center>
</a>
</div>
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='LinkList2' locked='false' title='Outros templates' type='LinkList'/>
<b:widget id='CustomSearch1' locked='false' title='Pesquisar este blog' type='CustomSearch'/>
<b:widget id='Label1' locked='false' title='Marcadores' type='Label'/>
<b:widget id='BlogArchive1' locked='false' title='Arquivo do blog' type='BlogArchive'/>
<b:widget id='HTML1' locked='false' title='Créditos' type='HTML'/>
<b:widget id='LinkList1' locked='false' title='Outros templates' type='LinkList'/>
</b:section>
</div>
</div>
</div>


A parte na cor preta deverá existir em seu blog e deverá estar assim.
O código na cor verde deverá estar de acordo com os widgets de seu blog
O código na cor vermelha é a parte que você acrescentou com essa tutorial..

Com este código você poderá ocultar qualquer parte do blog.

 Para ocultar as postagens, procure o trecho que está em negrito na cor azul e aplique o código como na explicação acima onde está em vermelho.

AQUI O PRIMEIRO CÓDIGO

<div class='mainwrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Postagens no blog' type='Blog'/>
</b:section>
</div>

AQUI O SEGUNDO CÓDIGO


Créditos: Hack Blogger

4 comentários:

  1. oi ELKE tudo bem? gostei da SIDEBAR QUE SE EXPANDE legal. abraços LOURDES

    ResponderExcluir
  2. nossa elke
    foi
    show
    voce
    é demais
    sou sua fa de verdade
    bejs
    ve lá


    http://edilenesblog.blogspot.com/

    ResponderExcluir
  3. Oi Elke...
    Eu testei e de início achei ótimo, mas despois testando percebi que os seguidores não aparecem com a sidebar assim, uma pena pq a ideia é bacana até...

    bjs

    ResponderExcluir
  4. Eu tenho uma dúvida. Se eu tiver mais de uma sidebar no meu blog, e quiser ecultar somente uma, uso este mesmo código?

    ResponderExcluir

A legislação brasileira prevê a possibilidade de se responsabilizar o blogueiro pelo conteúdo do blog, inclusive quanto a comentários; portanto, o autor deste blog reserva a si o direito de não publicar comentários que firam a lei, a ética ou quaisquer outros princípios da boa convivência. Não serão aceitos comentários anônimos ou que envolvam crimes de calúnia, ofensa, falsidade ideológica, multiplicidade de nomes para um mesmo IP ou invasão de privacidade pessoal / familiar a qualquer pessoa. Comentários sobre assuntos que não são tratados aqui também poderão ser suprimidos, bem como comentários com links. Este é um espaço público e coletivo e merece ser mantido limpo para o bem-estar de todos nós.


Copyright © Templates e Acessórios |
Design by Elke di Barros | Tecnologia do Blogger
    Twitter Facebook Google + YouTube