Fiz alguns testes com o script para expandir elementos no blog que encontrei no blog Vagabundia, acrescentei nova <div e eis o resultado: Expandir toda a sidebar do blog escondendo assim todos os widgets e de quebra, vc ainda poderá colocar uma cor de fundo. Clique AQUI e veja o resultado. Bom né ?
Pra começar salve o layout de seu blog.
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 sem clicar em "Expandir modelos de widget" procure pelo seguinte trecho:
<div id='sidebar-wrapper'>
Agora acima dele cole o seguinte código:
<div id='sidebararea-wrapper'>
<div style='text-align:center;'>
<a href='javascript:sidebararea.slideit()'>EXPANDIR SIDEBAR ▼ | CONTRAIR SIDEBAR ▲</a>
</div>
<div id='sidebararea'>
Agora encontre o seguinte código:
<!-- spacer for skins that want sidebar and main to be the same height-->
E acima dele cole o próximo código:
<script type='text/javascript'>var sidebararea=new animatedcollapse("sidebararea", 500, false)</script>
</div>
</div>
Pronto, agora salve e procure o seguinte código:
/* Outer-Wrapper
Cole o próximo código antes dele fazendo as modificações necessárias:
/*sidebararea-------------------------------------------------------*/
#sidebararea-wrapper{width: 370px;background: #ccc;padding: 6px 2px 2px 2px; margin: 12px 4px 6px 18px;border: 1px groove $bordercolor;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;/* fix for long non-text content breaking IE sidebar float */}
Em amarelo----largura da área da sidebr, veja ele tem que ser maior que o seu sidebar.
Em azul---------cor de fundo da sidebar
Agora procure por: ]]></b:skin>
E abaixo dele cole o código abaixo.
<script src='http://sites.google.com/site/templateseacessorioselke/expande/1expande.js' type='text/javascript'/>
Se preferir, (é altamente recomendado) hospede o código javascript em um servidor e depois cole o endereço no código acima que está na cor verde.
expande.js
