Postagens Recentes

11 de mai. de 2008

Treme seu blog

2 comentários:
Não me pergunte qual a finalidade desse script, rsrsrrs

Ele faz com que seu blog trema quando o visitante entra em seu blog.

Clique AQUI e veja o exemplo.

Copie o código e coloque no HTML/Javasript em seu blog









<script language="JavaScript1.2">
function tremer(n) {
if (self.moveBy) {
for (i = 10; i > 0; i--) {
for (j = n; j > 0; j--) {
self.moveBy(0,i);
self.moveBy(i,0);
self.moveBy(0,-i);
self.moveBy(-i,0);
}}}}
tremer(5)
</script>

10 de mai. de 2008

Bordas arredondadas no Blogger

5 comentários:
Para colocar bordas com os cantos arredondados em seu blog não é dificil, mas você precisará de um pouco de atenção para faze-lo. Se você navega pelo Firefox, clique AQUI para visualizar este template onde usei o código em vários locais.
Ah, este código funciona no Firefox, Chrome, Safari e Linux. Claro, menos no Internet Explorer :-(


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 coloque o código abaixo acima de onde tiver:

border: 3px solid $bodercolor;

Note que acima é só um exemplo, pode ser que em seu blog esteja diferente, o que importa mesmo é que tenha que ter "border:" e um número diferente de 0 onde no exemplo está o múmero 3.

Faça isso onde encontrar " border:" pois é esse código que corresponde a borda e claro, o número terá que ser diferente de 0



-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius:10px;



Mas Elke, não encontrei nenhum código border em meu blog.


Então procure pelo código:


.sidebar .widget, .main .widget {


E abaixo dele coloque o código:



border: 3px solid #000000;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius:10px;




* Onde está em verde é a cor da borda

O código deverá ficar mais ou menos assim

Título dos posts expandiveis

2 comentários:
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

Tradutor Google no blog

18 comentários:

Imprimir página entre os posts

Nenhum comentário:
Essa tuto fiz especialmente para a Mimo, do blog Receitas da Tia Dete.

Para ela é de fato necessário visto que ela tem dois excelentes blogs, um sobre receitas e outro sobre dietas.



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.



Mimo, teste e veja se está tudo certo. (Minha impressora está sem tinta, rsrsrsrs)

Veja o exemplo AQUI.

Copie o código abaixo





<input type="button" value="Imprimir página" onclick="javascript:print()"></input>





Agora vá até o HTML do seu blog, clique em Expandir.

Free Image Hosting at www.ImageShack.us


Procure pelo código :



<div class='post-footer'>

Cole abaixo o código que você copiou e salve. Prontinho !


Aparecerá um botão assim entre seus posts

8 de mai. de 2008

Link-me num clique

Um comentário:
Há muito tempo tenho em meu blog meus botões para link que são apenas um botão onde a pessoa clica e automaticamente me linka. Bom, acho que só funciona de Blogger para Blogger mas sempre me lembrava e logo me esquecia de ensinar a dica. É bem fácil, tudo o que você precisará é ter uma imagem para que seja seu botão onde as pessoas poderão te linkar.

Se você não tem, poderá fazer o seu em dos sites abaixo.



Depois hospede-os em um site para conseguir um endereço (url) para a imagem.

Agora que já fez tudinho, copie o código e cole em um widget.


É fácil, vá até "Layout", "Elementos de página",



"Adicionar um novo elemento de página"





e agora em HTML/Javascript.

Free Image Hosting at www.ImageShack.us




Cole aí o código abaixo fazendo as mudanças necessárias como o endereço do seu blog, o nome de seu blog e o endereço de sua imagem.

Pegar código



    <center><img src="AQUI O ENDEREÇO DE SUA IMAGEM"/>
    <form action="
    http://beta.blogger.com/add-widget" method="POST">
    <input value="FAVORITO" name="widget.title" type="hidden"/>
    <textarea style="display:none;" name="widget.content">
    <center><a href="AQUI O ENDEREÇO DE SEU BLOGGER"><img alt="AQUI O NOME DE SEU BLOG" src="AQUI O ENDEREÇO DE SUA IMAGEM"/></a></center>
    </textarea>
    <input
    value =
    http://buzz.blogger.com name="infoUrl" type="hidden"/>
    <input
    value = name="logoUrl"
    http://www.blogger.com/img/icon_logo32.gif type="hidden"/>
    <input value="Link-me" name="go" type="submit"/>
    </input
    value></input
    value></form></center>











Agora se prefere aquela forma tradicional de link, com a caixinha é só clicar AQUI no geraodor.

Cursores no Blogger

36 comentários:
Colocar cursores no Blogger, é mega fácil.


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 blog da Drica, ou ao blog do Tony , ou quem sabe ao Mouse Cursor, e escolha o cursor de sua preferência e copie o código.

Só funciona no Internet Explorer ;-[





 Copie o códigoe cole no HTML/Javascript.


Clique em adicionar Gadget





Vá até o HTML do seu blog e procure pela tag (código):

<head>


Cole abaixo o código do cursor salve.


Facinho d+



Este site oferece cursores que funcionam no Chrome e no Firefox


http://cursores.girlspt.com/

Uma pausa para refazer templates

Nenhum comentário:




Meu leitor fofinho, tudo bem com você ? Pois é, comigo tudo na santa paz de Deus. Vim comunicar a você que começarei a revisar "todos" os templates que fiz até hoje, recebi alguns emails e outros recadinhos dizendo-me que um ou outro não estavam bons, por isso, paciência é bom, pois deverei estar bastante ocupada.



Todas as dicas e tudo que faço uso aqui em meu blog, tem a dica, basta dar uma olhada no menu onde fica o chat, ali está linkado tudo, absolutamente tudo que faço uso aqui, incluindo o menu do chat, portanto, é só procurar e tr paciência, perseverança e ler.

Sim meus caros é necessário que se leia cada post, cada palavrinha que tem escrito neste blog, pois tenho notado que muita gente quer que eu lhes envie as dicas por email por simples e pura preguicinha de ler o que está escrito. Eu NÃO faço esse tipo de coisa, não envio email para ajuda, por favor, não insista !

Se quer alguma dica, deixe o ENDEREÇO do seu blog linkado, sim ? Há pessoas que me fazem pedidos mas não deixam o endereço, aí fica realmente impossível.





Quero dizer também que faço templates personalizados e claro, cobro por isso o valor de
R$ 30,oo só pelo código
ou
R$ 60,00 para lhe entregar o blog prontinho, com tudo que você quiser, meta tags, códigos, scripts, indexação nos principais sites de busca, etc, etc, etc...



Por enquanto é só, e até a próxima.

Post que se expande

3 comentários:
Vou ensinar como fazer este poste que se expande.

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.



Não fui que inventei isso não, eu estava por ai navegando quando me deparei com essa maneira de expandir o poste, gostei muito e enquanto não descobri como se faz não me dei por vencida.
Vai daqui, vai dali até que me deparei com o blog Consuming Experience e lá tinha a dica. Dai fiz umas modifiçações e deu no que deu.

Então vamos aprender ?


A primeira coisa que você deverá fazer, é copiar este código e colar depois da tag:

<head>

no HTML do seu Blogger. Clique em "Salvar"




<style type='text/css'>.texthidden {display:inline}.shown {display:block}</style><script type='text/javascript'>document.write(&#39;<style>.texthidden {display:none} </style>&#39;);</script><script type='text/Javascript'>function expandcollapse (postid) {whichpost = document.getElementById(postid);if (whichpost.className==&quot;shown&quot;) {whichpost.className=&quot;texthidden";}else {whichpost.className=&quot;shown&quot;;}}</script>





    Ah Elke, mas onde é que fica isso ?

    Ah ilustre visitante querido, fica no HTML do seu Blogger, não sabe ?

    Então clique na imagem para amplia-la.



    Clique em Modelo, depois em "Editar HTML"


    Clique-me

    Agora vá até "Configurações" e clique em "Formatação".

    Desça até o fim da página, você verá um espaço em branco.

    Cole aí este segundo código.

    *Onde está em verde é a cor da letra



    <a onclick="expandcollapse('NOME AQUI DO SEU POSTE')" href="javascript:void(0);"><span style="FONT-WEIGHT: bold; COLOR: rgb(153,0,0)"> Leia tudo...</span></a>
    <ul class="texthidden" id="NOME DO SEU POSTE DE NOVO" style="COLOR: rgb(0,0,0)"><code></code><p align="left">AQUI DENTRO SUA MENSAGEM QUE SE EXPANDE</p></ul>







    Pronto, agora vá em editar postagem, lá onde você escreve para ver uma coisa.

    Clique-me

    Clique-me

    Algumas considerações:

    Atenção:

    Sempre que você postar, modifique no local que está escrito:

    NOME AQUI DO SEU POSTE

    E

    NOME DO SEU POSTE DE NOVO

    Por uma palavra qualquer, a seu critério, mas tem que ser a mesma palavra nos dois locais ou seu poste não expandirá.

    Pode ser qualquer palavra, chuva, neve, vaca, cristo...

    Faça isso toda vez que postar algo.

    Ih, mas e quando eu não quiser que meu poste se expanda ?

    Sim terráqueo, basta você antes de escrever, apagar o que estiver no poste.








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