10 de mai de 2008

Título dos posts expandiveis

Algumas pessoas tem me perguntado como fazer para colocar o título dos posts expandíveis como AQUI neste exemplo. Bom, então aí vai a dica.

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 do seu blog e clique em "Expandir modelos de widget". Procure agora pela tag (código)

</head>

Acima desta tag, cole o código abaixo.


Código 1

<script type='text/javascript' src='http://www.anniyalogam.com/widgets/hackosphere.js' />
<script type='text/javascript'>
function toggleIt(id) {
post = document.getElementById(id);
if (post.style.display != 'none') {
post.style.display = 'none';
} else {
post.style.display = '';
}
}
</script>





Agora procure pelo código abaixo

<b:includable id='main' var='top'>


Veja que você terá que copiar os códigos em vermelho e coloca-los em seu código como está abaixo.

"As partes na cor preta são os códigos que existem em seu blog e as partes em vermelho são os códigos que você deverá copiar e introduzir em seu blog. "


Código 2



<b:includable id='PeekABooPost' var='post'>
<div class='post uncustomized-post-template'>
<table><tr>
<td width='40px'>
<a href='javascript:void(0)' title='Expand/collapse this post' style='text-decoration:none' expr:onclick='"javascript:toggleIt(\"" + data:post.id + "\");"'>[+/-]</a>
</td>
<td>
<h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3>
</td>
</tr></table>
<div class='post-body' expr:id='data:post.id' style='display:none'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>
</b:includable>


<b:includable id='main' var='top'>
<!-- posts -->
<div id='blog-posts'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<b:include data='post' name='PeekABooPost'/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>


<b:include data='post' name='post'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</b:loop>
</div>





Créditos: El Scaparate de Rosa

2 comentários:

  1. oi elke e o bernardo do blog perdeu todas as datas... akele menino q conversou com vc akele dia!!

    lembra?!?!?!?!

    axo q concertei o erro q da !


    fiz no meu e deu certo!

    AONDE TEM O <script type='text/javascript' >



    VC MUDA PARA <b:includable id='Blog1' var='post'>


    e fexe a tag!

    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