Pesquisar

Mostrando postagens com marcador sidebar. Mostrar todas as postagens
Mostrando postagens com marcador sidebar. Mostrar todas as postagens

Saiba Como se Faz:: » Sidebar »" Expandindo cada widget do blog"

Aqui neste espaço... 
Apenas divulgo e indico... 
Posts, notícias, dicas etc. 
...com devidas fontes  e créditos:    




Expandindo cada widget do blog

..." ter widget do seu blog "expandível"
...primeiro copie o título do widetg
que você quer expandir."



Agora,
vá até o HTML do seu blog e

..."e, em seu teclado,

clique na tecla F3

e cole aí o título do widget






..."Encontrando...


...agora,

um pouco abaixo

você verá um código assim:

<b:includable id='main'>

"  Cole abaixo dele este código"


<script type='text/javascript'>
//<![CDATA[
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a href="#" onclick="tmp = document.getElementById(&quot;' + rnd + '&quot;); tmp.style.display = (tmp.style.display == &quot;none&quot;) ? &quot;block&quot; : &quot;none&quot;; return false;" style="float:left;margin-right:5px;">');
//]]>
</script>[+/-]
<script type='text/javascript'>
//<![CDATA[
document.write('<\/a>');
//]]>
</script>


*Preferindo uma imagem, troque o código em roxo por este código abaixo e coloque aí o endereço da imagem.

<img src="ENDEREÇO DA IMAGEM"/>


..."   um pouco mais abaixo, procure por este código:



<div class='widget-content'>



"  Agora, embaixo dele

...cole este código abaixo




<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>



..."    mais abaixo procure por este outro código"


<b:include name='quickedit'/>


..."   cole acima dele este código:"





<script type='text/javascript'>
//<![CDATA[
document.write('<\/div>');
//]]>
</script>


..."   visualize,


se deu tudo certo,


é só salvar."





"    Exemplo de como o código

deverá ficar"




"   O código em preto

é o que deverá ter no HTML do seu blog,

e a parte em vermelho

é a que você  irá inserir."


Deverá ficar assim:                                                                                      



<b:widget id='Text1' locked='false' title='Do coração' type='Text'>
<b:includable id='main'>
<script type='text/javascript'>
//<![CDATA[
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a href="#" onclick="tmp = document.getElementById(&quot;' + rnd + '&quot;); tmp.style.display = (tmp.style.display == &quot;none&quot;) ? &quot;block&quot; : &quot;none&quot;; return false;" style="float:left;margin-right:5px;">');
//]]>
</script>[+/-]
<script type='text/javascript'>
//<![CDATA[
document.write('<\/a>');
//]]>
</script>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>
<data:content/>
</div>
<script type='text/javascript'>
//<![CDATA[
document.write('<\/div>');
//]]>
</script>
<b:include name='quickedit'/>
</b:includable>
</b:widget>




fonte e créditos:
Obrigada Elke
Share:

Saiba Como "Acrescentar Outra Coluna Sidebar (coluna horizontal)"


Pesquisa encontrada em templates e acessórios:


Vide a seguir:

"Bom, no La Blogueria encontrei essa dica" ..

Com ela você poderá colocar mais uma coluna ao blog

Só que essa coluna é horizontal ...
...e só tem sentido ser colocada,
 se você tiver um template 
onde as duas colunas fiquem de um lado só."







Clique para visualizar
Clique para visualizar







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.









Primeiro vá até o HTML do seu blog e coloque o código abaixo antes de

  #sidebar-wrapper {








#widebar-wrapper {
width:360px;
float:right;
padding-bottom:10px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}



Atenção: Esses dois códigos na cor verde é para que você faça as modificações necessárias como largura e lado das colunas.

360 px é a largura da coluna, vá trocando o número até que se ajuste ao tamanho desejado.

Caso no seu template as suas outras colunas fiquem do lado esquerdo, troque "right" por "left"


* Se você quer que a coluna fique acima das outras colunas:

Agora procure pelo código: <div id='sidebar-wrapper'> 

▲ ..."E acima dele cole o código abaixo."...▼






<div id='widebar-wrapper'>
<b:section class='sidebar' id='widebar' preferred='yes'>
</b:section></div>



*Se você quer que fique abaixo das outras colunas:


Procure pelo código:

Agora procure pelo código: 

 <div id='sidebar-wrapper'>:

e ao final dele terá:

</b:section>
</div>


▲..."E abaixo dele cole o código"...▼


<div id='widebar-wrapper'>
<b:section class='sidebar' id='widebar' preferred='yes'>
</b:section></div>





fonte e créditos: 
templateseacessorios







Share:

Seguir por e-mail

Seguidores

Google+ Followers

arquivo

Google+ Badge

"Alô Negócios !!!…buscas populares"

Alô Negócios !!!…buscas populares