Rei do Bloguinho: Scripts

Mostrando postagens com marcador Scripts. Mostrar todas as postagens

Colocando Papai Noel Voando no Blogger

O final de ano está chegando é o Natal também, então aproveite e inclemente script decorativo em seu Blog, e anime o seus visitantes chamando bastante atenção deles.

Bom o legal disso é que e bastante fácil de colocar, basta ir em "Modelo" e depois em e procure por;

</head>

Se não encontrar procure por essa aqui:

<head>

Em seguida insira esse código que está aqui abaixo logo antes de um dos códigos que você procurou;

 <script type="text/javascript" src="http://blogparts.giffy.me/0017/parts.js" /> 

É finalize clicando em "Salvar modelo" e pronto já está tudo feito.

► Post Completo

Frases aleatórias no Blogger

Faz tempo que andei procurando esse gadget, porque eu via em alguns blogs frases que mudavam ao troca de página no site, até que fim eu encontrei com Juliana do Dicas Blogger, então agora eu eu também estou repassando pra vocês. ( mais lembre-se que os créditos pertence a ela ) .

para colocar esse gadget, e muito simples, basta você entrar em "layout" e depois em "adicionar gadget" e escolha a opção "html/javascript" e cole o código abaixo:

<div style="border-left: 5px solid #ccc; padding:6px; font-style: italic; "> <script language="JavaScript"> citas = new Array(4) citas[0] = "FRASE 0 " citas[1] = "FRASE 1" citas[2] = "FRASE 2" citas[3] = "FRASE 3" citas[4] = "FRASE 4" aleatorio = Math.random() * (citas.length) aleatorio = Math.floor(aleatorio) document.write(citas[aleatorio]) </script></div>

E em seguida altere onde estar escritos as partes FRASE , se caso queira adicionar mais frases adicione mais um código desse abaixo dos outros: citas[0] = "FRASE 0 " e substitua o numero 0 pelo subsequente 5,6 e assim sucessivamente.

Também você pode adicionar bordas em torno do texto usando esse outro código:

<div style="border: 5px solid #ccc; padding:6px; font-style: italic; "> <script language="JavaScript"> citas = new Array(4) citas[0] = "FRASE 0 " citas[1] = "FRASE 1" citas[2] = "FRASE 2" citas[3] = "FRASE 3" citas[4] = "FRASE 4" aleatorio = Math.random() * (citas.length) aleatorio = Math.floor(aleatorio) document.write(citas[aleatorio]) </script></div>

E altere a parte que esta destaca de azul 5px que se refere a espessura da borda. A outra parte em vermelho #ccc e o código da cor que você pode mudar, por isso recomendo que veja essa minha outra postagem: ► Código das Cores, e depois e só clicar em salvar.

► Post Completo

PopUp do Facebook com Tempo Limitado no Blog

Acho que você já deve ter visto quando entramos em algum blog ou site, uma janela para o visitante curti no Facebook, bom esse recurso funciona com base no Script que foi criado por KaKiboh e Vanessa do Mundo Blogger foi quem adicionou o tempo limite para o recuro fechar automaticamente. (Devo todos os créditos a ela)

Veja o exemplo da imagem abaixo:

Veja aqui o Demo

Para instalar esse Script e bem simples; Acesse o painel do blogger vá em "layout" e clique em "adicionar um gadget" e escolha a opção "html/javascript" e cole o código abaixo:

<style> #fblikepop {background-color: #fff;display: none; position: fixed; top: 200px; _position: absolute; width: 450px; border: 10px solid #6F6F6F; z-index: 200;-moz-border-radius: 9px; -webkit-border-radius: 9px; margin: 0pt; padding: 0pt; color: #333333; text-align: left;font-family: arial,sans-serif; font-size: 13px;} #fblikepop body {background: #fff none repeat scroll 0%; line-height: 1; margin: 0pt; height: 100%;} .fbflush {cursor: pointer; font-size: 11px !important; color: #FFF !important; text-decoration: none !important; border: 0 !important;} #fblikebg {display: none; position: fixed;_position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: #000000; z-index: 100;} #fblikepop #closeable {color: #333;float: right; margin: 7px 0 0 0;} #fblikepop h1 { background: #6D84B4 none repeat scroll 0 0; border-top: 1px solid #3B5998; border-left: 1px solid #3B5998; border-right: 1px solid #3B5998; color: #FFFFFF !important; font-size: 14px !important; font-weight: normal !important; padding: 5px !important; margin: 0 !important;font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif !important;} #fblikepop #actionHolder { height: 60px; overflow: hidden;} #fblikepop #buttonArea { background: #F2F2F2; border-top: 1px solid #CCCCCC; padding: 10px; min-height: 50px;} #fblikepop #buttonArea a { color: #999999 !important; text-decoration: none !important; border: 0 !important; font-size: 10px !important;} #fblikepop #buttonArea a:hover { color: #333 !important; text-decoration: none !important; border: 0 !important;} #fblikepop #popupMessage {font-size: 12px !important;font-weight: normal !important; line-height: 22px; padding: 8px; background: #fff !important;} #fblikepop #counter-display {float: right; font-size: 11px !important;font-weight: normal !important; margin: 5px 0 0 0;text-align: right;line-height: 16px;}</style> <script src="http://www.google.com/jsapi"></script> <script>google.load("jquery", "1");</script> <script type="text/javascript" src="http://connect.facebook.net/pt_BR/all.js#xfbml=1"></script> <script type="text/javascript"> //<![CDATA[ kakinetworkdotcom01username="NOME-DA-SUA-PAGINA", kakinetworkdotcom01title="Encontre-nos no Facebook", kakinetworkdotcom01time="12", kakinetworkdotcom01wait="0", kakinetworkdotcom01lang="br" //]]> </script> <script type="text/javascript" src="http://mundoblogger.webs.com/scripts/popupFBlikebox.js"></script> <script type="text/javascript"> //<![CDATA[ $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });}); //]]> </script>

Atenção: os trechos que você precisa mudar são;
kakinetworkdotcom01username="NOME-DA-SUA-PAGINA" que e o nome da sua pagina do Facebook.
kakinetworkdotcom01time="12" que corresponde o tempo que irá desaparecer, você só precisar mudar o número 12 .

► Post Completo

Mensagem de texto ao entrar no blog

Mensagem ao entrar no blog e muito bom, pois você pode alerta caso seu blog esteja em manutenção ou outra coisa desse tipo, num e muito recomendado não porque algumas pessoas não gostam, basta usar esse código;

<script>alert('texto do alerta');</script>

Primeiramente você altere o texto da mensagem ('texto do alerta') que erá q mensagem que ira aparecer, depois entre na pagina editar HTML e coloque esse código antes de </body> depois e só clicar em salvar, e pronto sua mensagem já esta pronta.

► Post Completo

Colocar Descrição em Textos e Imagens

O uso de descrição nas imagens e texto do blog melhora muito na organização de seu blog, que o faz de seu blog ficar mais profissional, este script faz aparecer um texto ao passar o mouse em cima da imagem ou texto aplicado o código, que facilita também nossas imagens aparecer nas pesquisas do GooGle.

Descrição sobre o link de texto:
<a href='http://reidobloguinho.blogspot.com/' title='Dicas e Tutoriais para blogs'>Rei do Bloguinho</a>

Veja o exemplo do texto: Rei do Bloguinho

Descrição sobre imagens:
<img src="endereço da imagem" alt="texto sobre a imagem" width="300" height="228" border="0" /><br />

Exemplo da imagem:

(passe o mouse sobre a imagem)

Bom e só isso, espero que gostem !

Fonte do código: Dicas Para Blogs

► Post Completo

Ícone na barra de endereço (favoritos)

Essa dúvida e frequente entre os blogueiro que e retirar o ícone do blog e trocar por uma imagem personalizada.E muito simples e fácil de colocar você só precisa hospedar a imagem eu recomendo que hospede no ImageShack.

Colocando o Ícone:
Entre na aba ► "Desing" ► "Editar HTML" e NÂO precisa marcar opção "Expandir modelos de Widgets" e procure por:

</head>

E cole o código a seguir antes dela:

<link href='Url da Imagem' rel='shortcut icon'/> <br />
<link href='Url da Imagem' rel='shortcut icon' type='image/png'/> <br />
<script type='text/javascript'>
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>

E altere onde esta escrito Url da Imagem pelo o endereço da sua imagem e salve !

Bom e só isso! fácil ne !

► Post Completo

Aprenda a Tirar Proveito Dos Plagiadores

(prepare uma armadilha para os plagiadores)

Hoje você vai aprender uma forma de proteger-se contra o plágio e Assinar os feeds do seu blog. Claro que isso também não vai impedir que plagiadores copiem o conteúdo do seu blog completamente.

► Como força os créditos no Blogger.

Vamos tentar combater dois tipos de plagiadores: os que roubam o conteúdo do feeds e os que copiam diretamente do blog.

01 - Combater os que copiam a parti dos feeds.
E bem simples basta você "Assinar o seu feed" e uma assinatura com o link do seu blog.
Para aprender o restante veja este tutorial criado pelo Usuário Compulsivo.
► Assine seu feed e proteja-se do plágio

02 - Combater os que copiam diretamente dos posts do seu blog.
Essa maneira em bem legal pois das teclas (Cthl + c e Cthl + c) as famosas teclas dos ladrões de conteúdo e essa o que eles chamam de "ferramenta" e uma maneira bem fácil de copiar e rápida que tal fornecer a "maneira mais difícil", o objetivo e o uso dessas teclas lhe dará os créditos das da sua postagem.

Vá em "design" ► "editar html" e marque a caixa "expandir modelos de widgets" e procure por: post-footer-line-1 , o código parecerá com isso (muda de acordo com o tema do seu template):

E agora coloque ANTES de <div esse código;

<b:if cond='data:blog.url == data:post.url'>
<div id='creditos'>
<h3>Copie essa postagem para o seu blog!</h3>
<center><textarea onclick='this.select();' style='overflow:hidden;width:200px; height:40px;'>
<data:post.body/><br/>
<p style='font-size:80%'>Fonte: <a expr:href='data:post.url'><data:post.title/></a> - <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p>
</b:if>
Obs:
- O texto em vermelho faz com que o código apareça apenas nas páginas de postagens.
- O texto em Azul e o titulo que você tem que dar para o seu "widget"
- A segunda linha define um ID para o DIV, se você entende um pouco de CSS, poderá customizar os elementos usando o #creditos.

Agora salve as alterações.

A armadilha já vai estar pronta para os plagiadores fazendo com que eles ter beneficiarem.

Fonte: Sem Nome

► Post Completo

Script Aumentar Diminuir Letra do Texto no Post

Este script permite que o leitor aumente ou diminua a letra conforme ele queira e muito bom e util para leitos que tem problema de visão ou a tela seu monitor seja um pouco pequena.
Boa este script foi desenvolvido por Clau, dona do Gothic Darkness e com uma colaboração de Matheus Serafim, portanto todos os créditos desse script são para eles.

1° Passo - Instalando o script
Para instalar o script basta ir em "design" (antigo "layout"), clique em "editar HTML", e não precisa clicar "expandir modelos de widgets" e procure pela tag </head>
Copie o código abaixo e cole ANTES dela sem alterar nada:


<script type='text/javascript'>
//<![CDATA[
function fontMais(){
var obj = document.getElementById("textoFonte");
if (obj.style.fontSize==""){obj.style.fontSize="12px"};
if (obj.style.fontSize=="10px"){obj.style.fontSize = "12px";}
else if (obj.style.fontSize=="12px"){obj.style.fontSize = "15px";}
else if (obj.style.fontSize=="15px"){obj.style.fontSize = "17px";}
else if (obj.style.fontSize=="17px"){obj.style.fontSize = "19px";}
else if (obj.style.fontSize=="19px"){obj.style.fontSize = "21px";}
}
function fontMenos(){
var obj = document.getElementById("textoFonte");
if (obj.style.fontSize==""){obj.style.fontSize="12px"};
if (obj.style.fontSize=="21px"){obj.style.fontSize = "19px";}
else if (obj.style.fontSize=="19px"){obj.style.fontSize = "17px";}
else if (obj.style.fontSize=="17px"){obj.style.fontSize = "15px";}
else if (obj.style.fontSize=="15px"){obj.style.fontSize = "12px";}
else if (obj.style.fontSize=="12px"){obj.style.fontSize = "10px";}
}
//]]>
</script>


E salve as alterações !

2° Passo - Colocando ícones clicaveis para aplicar o efeito
Volte na aba "design", clique em "editar HTML", marque a opção em "expandir modelos de widgets" e procure pela tag:

<div class='post-header-line-1'>

Logo ABAIXO dela, cole o seguinte código:

<b:if cond='data:blog.pageType == "item"'>
<a alt='Aumentar fonte' href='javascript:fontMais()'><img src='http://img405.imageshack.us/img405/2006/fontmais.gif'/></a>
<a alt='Diminuir fonte' href='javascript:fontMenos()'><img src='http://img707.imageshack.us/img707/359/fontmenos.gif'/></a></b:if>

Salve !

Caso você queira substituir a imagem e só trocar o endereço da imagem no código acima, pelo o link da sua imagem.

ATENÇÃO: Se o código estiver assim: <div class='post-header-line-1'/>, com a barra no final, substitua-o por:

<div class='post-header-line-1'><---código dos ícones aqui--->
</div>

3° Passo aplicando o efeito em todas postagens
Foi nesta parte agora que Matheus Serafim ajudou fazendo aplicar o script a todos os postos de uma vez
Volte em "design", clique em "editar HTML", marque a opção em "expandir modelos de widgets" e procure pelo seguinte código:

<div class='post-body entry-content'><data:post.body/>
<div style='clear: both;'/>
</div>

Substitua TODO o código acima por este:

<div class='post-body entry-content'><div id="textoFonte"><data:post.body/>
<div style='clear: both;'/> </div></div>

Agora visualize e salve !

Pronto e só isso espero que gostem !

Fonte: Gothic Darkness

► Post Completo

Tradutor com bandeirinhas redondas

Tradutores no blog e um recurso que você não pode deixar de usar pois e sempre bom ter por que nunca vamos saber quando alguém de outro país vai acessar o seu blog.

Criei esse novo esse novo modelo muito bom e util para você, bom para colocar o Gadget no seu blog vá em layout, adicionar gadget, e escolha a opção html/javascript e insira o código abaixo, o bom de tudo e que você não precisa fazer nenhuma alteração basta colocar e salvar.

<div align="center"><table border="0" cellspacing="0" cellpadding="0" width="262"><tbody><tr><td>

<table border="0" cellspacing="0" cellpadding="0" width="260"><tbody> <tr> <td align="center" valign="top"><a href="http://www.blogger.com/rearrange?blogID=5272967381127903624&action=editWidget&sectionId=footer2&widgetType=null&widgetId=HTML6#" onclick="window.open('http://translate.google.com.br/translate?hl=pt-BR&sl=pt&tl=de&u='+window.location.href)"><img style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="Traduzir para Alemão" border="0" src="http://public.bay.livefilestore.com/y1pEXyZCQvumrcV_gWcZYyYbwsWdLpAtBhhXbBoahfkmRcOWLUXkH8dbXrRJ6hVp0m5BbpAc34xI71qi6LeVAIyNA/flag-German1.jpg" width="38" height="38" /></a><span style="font-family:Microsoft Sans Serif;font-size:78%;">

Alemão</span></td> <td align="center" valign="top"><a href="http://www.blogger.com/rearrange?blogID=5272967381127903624&action=editWidget&sectionId=footer2&widgetType=null&widgetId=HTML6#" onclick="window.open('http://translate.google.com.br/translate?hl=pt-BR&sl=pt&tl=zh-CN&u='+window.location.href)"><img style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="Traduzir para Chinês Simplificado" border="0" src="http://public.bay.livefilestore.com/y1prKsFkJoTbZ2BVctXUXnaeWDXtWROW6x0SMN7nezjTThx-aBgVhCpEYBL9vgdeCSucLuWs43l0NcrmEo_NMr57Q/flag-Chinese.jpg" width="38" height="38" /></a>

<span style="font-family:Microsoft Sans Serif;font-size:78%;">Chinês</span></td> <td align="center" valign="top"><a href="http://www.blogger.com/rearrange?blogID=5272967381127903624&action=editWidget&sectionId=footer2&widgetType=null&widgetId=HTML6#" onclick="window.open('http://translate.google.com.br/translate?hl=pt-BR&sl=pt&tl=es&u='+window.location.href)"><img style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="Traduzir para Espanhol" border="0" src="http://public.bay.livefilestore.com/y1pEXyZCQvumrfgvCp7KlnCeyR8L-yf0tU-DCUIBIwSegMv7otuJxSZkqqtRQdtw7f9XQEhHqBa-gCUIaVrV2pwgA/flag-Spanish.jpg" width="38" height="38" /></a><span style="font-family:Microsoft Sans Serif;font-size:78%;">Espanhol</span></td> <td align="center" valign="top"><a href="http://www.blogger.com/rearrange?blogID=5272967381127903624&action=editWidget&sectionId=footer2&widgetType=null&widgetId=HTML6#" onclick="window.open('http://translate.google.com.br/translate?hl=pt-BR&sl=pt&tl=en&u='+window.location.href)"><img style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="Traduzir para Inglês" border="0" src="http://public.bay.livefilestore.com/y1pEXyZCQvumrco74eK-6FDBxz3aT-0uoBbVlWFqgqbUaWNiMikvY30PdecHGl6NJFW-fl7EjV0me8BTsNgHSrSzQ/flag-English.jpg" width="38" height="38" /></a><span style="font-family:Microsoft Sans Serif;font-size:78%;"><br />

Inglês</span></td> </tr> </tbody></table></td></tr></tbody></table></div><div style="text-align: center;"><a href="http://reidobloguinho.blogspot.com/2010/05/tradutor-com-bandeirinhas-redondas.html" target="_blank">Widget Custom By Rei do Bloguinho</a></div>

Feito isso e só clicar em salvar !

►Se você não gostou desse modelo veja aqui alguns modelos:
tradutor bandeirinhas animadas

► Post Completo

Widget de exibir a Data e o Dia da Semana

Este Widget e bem legal pois ele exibi a data e o dia da semana em texto um script bem simples e no seguinte formato:Quinta-Feira, 05/05/2010, muito util quando queremos exibir data na sidebar ou até mesmo no título do blog, além de deixar o leito informado tipo um blog de jornal ae você uma este Widget.

1° Para instalar basta acessar sua conta no blogger, ir em layout escolher o local do Widget e clicar em adicionar gadget e escolha a opção html/javascript e coloque este código abaixo lá e salve:

<script type="text/javascript" src="http://sites.google.com/site/reidobloguinho/datascript/widgetbyreidobloguinho.js"></script>

► Post Completo

Colocar emoticons nos Comentários do Blogger

Existe um "hacker" que permite colocar emoticons parecidos como os do msn, colocar nas postagens do blog, para isso você tem que incorporar abaixo das postagens, vá em configurações > comentários
procure por Posição do formulário de comentários e escolha a opção: Postagem abaixo incorporada.

1° layout, editar html clique em "expandir modelos de widgets" e localize a seguinte linha:

<p><data:blogCommentMessage/></p>

2° e cole o seguinte código logo ABAIXO dela:

<div style=' width: 370px; text-align: left; border: 2px solid #0084ce; background: #FEF9EA; padding: 10px; color:#0084ce; font-weight:bold; '>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2s57d7tPvwhoT59FSzJy57BiTt6VIz0S1BprjwUUD1-yD7bdw_8CM4eZ-k3VOI3EexmxiClhrPqNV2TrSpZpaFQjyQeCeciFLXlgYUWOLHlOA4Z6VRKA3PxjrDvgLaBGr-wOn0BuR5OE/s800/emoticon-0100-smile.gif'/> :a

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHHHkXw2wyKeqDDe-MBw0nIROvo-duy3cI0ZnBUwP8hvzqUuWu8htkfFE6SJbXPS6ohs1jJZxzAbd13fyJ3KO0YmVxjW3CKKZcoh2D9N8gEhoHPCV8_PXBSJu0yuv1M7URxUHEqVN1J6c/s800/emoticon-0101-sadsmile.gif'/> :b

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnx8FXUPCL64qXfoo4418ByPCGKAh3VQShBeCNxsuVqfqUPJ4YLJ8HQQhMEed_vaGVOdF43ruVzr8f-LJec3Be6Ue161Futfj2IjuHkuMsnz8XTcUADJsM57vRhH3eRcNV9VWpiEbhwYQ/s800/emoticon-0102-bigsmile.gif'/> :c

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnJ8sa4MMLallQ5RoD2o2ZHYsK6zWYChgfly2WZ_Yl13JnlU7LWSJGHkNNMyCEw82ZoyKM9lDbOYzrQvGu2H2SxiE1LyYD9cYmgE_f3IoU4RB9R1M-tRpBkxs4LA5u3w7cMm2XrhVNEa4/s800/emoticon-0105-wink.gif'/> :d

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYeerMemTzYPEUM0pB-in4V7pOCd7KlqViDGzMR0CXtmTKseQwnGoqshZvRZqT0fdpJkzyirSit0Hj_HoraDa-eEdXR9CBw8No4YEnXFkNCcw5pthWlD9ksJis5DjbyrOJJXFGXzhXq70/s800/emoticon-0104-surprised.gif'/> :e

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDuvFdjk2mh97qwQ7B262qFtHAeIDanIGiOYxC3eFeOwDfAzxA5Ob190vfRjl5EaZLraO3Oq8EDBJuZWukURGoNI7x0dByEL6_TFfk_-YskDj87aoP4Ml40S1sH2kcndCkv2RljePN1LE/s800/emoticon-0106-crying.gif'/> :f

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmYKO4sKq44-mKXWZ_nnDroNzaCc0QmEk6QFBWjAH20IzEXvkas3JkEYqI_kIZKXa4LocbGs_97gFaNo9VMGyVZSZ83L8Ju5wTow_kUFK9q8uVBNgijVkpzjB0obu_CShMm5ZQyG8XmBc/s800/emoticon-0109-kiss.gif'/> :g

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJyaFBy2FKPnt3eQ2Ml7y_7b5XtFOR6MCGpp_dwAH-J4twEtnUQhCR8604CrxuhDpmCBB8OoD73vtB8BhoNfpHv6DSQH1jGZBcTzZVdWt25juHqIh0ggsXyEGTHO_z06cuXrk4DcTZYCs/s800/emoticon-0111-blush.gif'/> :h

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxUcSg52-Ue9EEaifcB6UScExV3Sk-4PVIXio7gM72u-a506h2CbCB58KwVw5xP_yBEmi6OzF-UgQqMe62w2FklK2oyDJ7c0iI8_rSFSRnpV_yXN34Z28ZHP8po_sY2EIXuIQtHVpa2go/s800/emoticon-0110-tongueout.gif'/> :i

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihq4XssRZI9DWkLOdXyGmZerE401ZRR_FgI5Kbq-HqfMiZZsL6IHQQpgAnWo_0VH00GVab4DatijbOzhaA5QXORPkLl8hLVZyDJ-_LpB04L0FNn2UTSF2TWpnNgKxRK_wqQ8-1hvqczMs/s800/emoticon-0126-nerd.gif'/> :j

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYxgw1GiAx7qpTNI86JTdjdw-X9uzGfXnQBpPePz3xbvEnNER76mUu2DmDxUbTwaw5vSUBgzjA5igswOTyuvVUAtjW6rnczfDLxx6DNIpe-kBP6FOFWSCUd5ZcpsP6KSQ1Q7Q5PKid944/s800/emoticon-0103-cool.gif'/> :k

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGM6SEMSKrxGCAgKXrn553qDxRd_uX8IYiqGhV_wx0Zv2eBs26Bwpls0IgKGwWNYeXAiL_PMfl-F52sgXo10r-SiFYv6CXtkvgX8KC6luPRrg-TFnQg1oi5ft3UE862TdOTRB-_le456k/s800/emoticon-0130-devil.gif'/> :l

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8DfMNTbFvxnwOSepqEUg7YAQddamwOlfKQ8YCEZuyJubHAORJ538gMpEdbwf6KtSsJS3uANpbW0CSKwplELP-4IEg3l0BnwQ4_3FFVR-TVaiIuGPeytbaxMziuXei1t2mAr_sk64je1g/s800/emoticon-0133-wait.gif'/> :m

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLoKo0yr1mmd3NZvOz-tmC_96PkmE5oCBx6xj0FNI9peHE7TjrNHWA1LHzDRw7I1DiO_D5TV7sELIEAFFEa5VNYVRhhnAvIga3lR7hBFk11wuZyUPIATbENzt4vOCUtl-BhjESkQQY9T4/s800/emoticon-0137-clapping.gif'/> :n

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjh4QHMoo_GWfkQdTUKCqqXRExOCDC53YOUiNrGzC-Upp-lZPUBHVNB6YGPj2mVvDsqIFXLZcUuSlkre0DHAg6Jmw9jdXaKItBtjaSguUKv1U7NfxIylK1biEW8QFa8aQXTR2OCCSQC9O0/s800/emoticon-0136-giggle.gif'/> :o

<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg1ChL1OtuaeRpY9PCsMnpGJBEo2Z_ofB00zhN9WkWwX9SwbUAQTEMj7_O0a8b6MDFQCw7P_nlVn8aLLJ3NwoukBU3prCAe4DwcjDwTyNFKKqFYQaH4hEorO1T4j-LL_-WUb78B5RONdQ/s800/emoticon-0141-whew.gif'/> :p
</div>

E salve as modificações.

Agora temos que incluir os scripts para permitir os emoticons nos comentários do blog

3° entre na pagina layout, editar html e não precisa clicar em expandir modelos de widgets, copie o código abaixo e cole-o antes de </body>

<script type='text/javascript'>

//<![CDATA[
a = document.getElementById('comments');
if(a) {
b = a.getElementsByTagName("DD");
for(i=0; i < b.length; i++) {
if (b.item(i).getAttribute('CLASS') == 'Author-comment-body' , 'comment-body') {
_str = b.item(i).innerHTML.replace(/:j/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihq4XssRZI9DWkLOdXyGmZerE401ZRR_FgI5Kbq-HqfMiZZsL6IHQQpgAnWo_0VH00GVab4DatijbOzhaA5QXORPkLl8hLVZyDJ-_LpB04L0FNn2UTSF2TWpnNgKxRK_wqQ8-1hvqczMs/s800/emoticon-0126-nerd.gif' alt='' class='smiley'/>");
_str = _str.replace(/:k/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYxgw1GiAx7qpTNI86JTdjdw-X9uzGfXnQBpPePz3xbvEnNER76mUu2DmDxUbTwaw5vSUBgzjA5igswOTyuvVUAtjW6rnczfDLxx6DNIpe-kBP6FOFWSCUd5ZcpsP6KSQ1Q7Q5PKid944/s800/emoticon-0103-cool.gif' alt='' class='smiley'/>");
_str = _str.replace(/:l/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGM6SEMSKrxGCAgKXrn553qDxRd_uX8IYiqGhV_wx0Zv2eBs26Bwpls0IgKGwWNYeXAiL_PMfl-F52sgXo10r-SiFYv6CXtkvgX8KC6luPRrg-TFnQg1oi5ft3UE862TdOTRB-_le456k/s800/emoticon-0130-devil.gif' alt='' class='smiley'/>");
_str = _str.replace(/:m/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8DfMNTbFvxnwOSepqEUg7YAQddamwOlfKQ8YCEZuyJubHAORJ538gMpEdbwf6KtSsJS3uANpbW0CSKwplELP-4IEg3l0BnwQ4_3FFVR-TVaiIuGPeytbaxMziuXei1t2mAr_sk64je1g/s800/emoticon-0133-wait.gif' alt='' class='smiley'/>");
_str = _str.replace(/:n/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLoKo0yr1mmd3NZvOz-tmC_96PkmE5oCBx6xj0FNI9peHE7TjrNHWA1LHzDRw7I1DiO_D5TV7sELIEAFFEa5VNYVRhhnAvIga3lR7hBFk11wuZyUPIATbENzt4vOCUtl-BhjESkQQY9T4/s800/emoticon-0137-clapping.gif' alt='' class='smiley'/>");
_str = _str.replace(/:o/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjh4QHMoo_GWfkQdTUKCqqXRExOCDC53YOUiNrGzC-Upp-lZPUBHVNB6YGPj2mVvDsqIFXLZcUuSlkre0DHAg6Jmw9jdXaKItBtjaSguUKv1U7NfxIylK1biEW8QFa8aQXTR2OCCSQC9O0/s800/emoticon-0136-giggle.gif' alt='' class='smiley'/>");
_str = _str.replace(/:p/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg1ChL1OtuaeRpY9PCsMnpGJBEo2Z_ofB00zhN9WkWwX9SwbUAQTEMj7_O0a8b6MDFQCw7P_nlVn8aLLJ3NwoukBU3prCAe4DwcjDwTyNFKKqFYQaH4hEorO1T4j-LL_-WUb78B5RONdQ/s800/emoticon-0141-whew.gif' alt='' class='smiley'/>");
_str = _str.replace(/:a/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2s57d7tPvwhoT59FSzJy57BiTt6VIz0S1BprjwUUD1-yD7bdw_8CM4eZ-k3VOI3EexmxiClhrPqNV2TrSpZpaFQjyQeCeciFLXlgYUWOLHlOA4Z6VRKA3PxjrDvgLaBGr-wOn0BuR5OE/s800/emoticon-0100-smile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:b/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHHHkXw2wyKeqDDe-MBw0nIROvo-duy3cI0ZnBUwP8hvzqUuWu8htkfFE6SJbXPS6ohs1jJZxzAbd13fyJ3KO0YmVxjW3CKKZcoh2D9N8gEhoHPCV8_PXBSJu0yuv1M7URxUHEqVN1J6c/s800/emoticon-0101-sadsmile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:c/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnx8FXUPCL64qXfoo4418ByPCGKAh3VQShBeCNxsuVqfqUPJ4YLJ8HQQhMEed_vaGVOdF43ruVzr8f-LJec3Be6Ue161Futfj2IjuHkuMsnz8XTcUADJsM57vRhH3eRcNV9VWpiEbhwYQ/s800/emoticon-0102-bigsmile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:d/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnJ8sa4MMLallQ5RoD2o2ZHYsK6zWYChgfly2WZ_Yl13JnlU7LWSJGHkNNMyCEw82ZoyKM9lDbOYzrQvGu2H2SxiE1LyYD9cYmgE_f3IoU4RB9R1M-tRpBkxs4LA5u3w7cMm2XrhVNEa4/s800/emoticon-0105-wink.gif' alt='' class='smiley'/>");
_str = _str.replace(/:e/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYeerMemTzYPEUM0pB-in4V7pOCd7KlqViDGzMR0CXtmTKseQwnGoqshZvRZqT0fdpJkzyirSit0Hj_HoraDa-eEdXR9CBw8No4YEnXFkNCcw5pthWlD9ksJis5DjbyrOJJXFGXzhXq70/s800/emoticon-0104-surprised.gif' alt='' class='smiley'/>");
_str = _str.replace(/:f/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDuvFdjk2mh97qwQ7B262qFtHAeIDanIGiOYxC3eFeOwDfAzxA5Ob190vfRjl5EaZLraO3Oq8EDBJuZWukURGoNI7x0dByEL6_TFfk_-YskDj87aoP4Ml40S1sH2kcndCkv2RljePN1LE/s800/emoticon-0106-crying.gif' alt='' class='smiley'/>");
_str = _str.replace(/:g/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmYKO4sKq44-mKXWZ_nnDroNzaCc0QmEk6QFBWjAH20IzEXvkas3JkEYqI_kIZKXa4LocbGs_97gFaNo9VMGyVZSZ83L8Ju5wTow_kUFK9q8uVBNgijVkpzjB0obu_CShMm5ZQyG8XmBc/s800/emoticon-0109-kiss.gif' alt='' class='smiley'/>");
_str = _str.replace(/:h/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJyaFBy2FKPnt3eQ2Ml7y_7b5XtFOR6MCGpp_dwAH-J4twEtnUQhCR8604CrxuhDpmCBB8OoD73vtB8BhoNfpHv6DSQH1jGZBcTzZVdWt25juHqIh0ggsXyEGTHO_z06cuXrk4DcTZYCs/s800/emoticon-0111-blush.gif' alt='' class='smiley'/>");
_str = _str.replace(/:i/ig,"<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxUcSg52-Ue9EEaifcB6UScExV3Sk-4PVIXio7gM72u-a506h2CbCB58KwVw5xP_yBEmi6OzF-UgQqMe62w2FklK2oyDJ7c0iI8_rSFSRnpV_yXN34Z28ZHP8po_sY2EIXuIQtHVpa2go/s800/emoticon-0110-tongueout.gif' alt='' class='smiley'/>")
b.item(i).innerHTML = _str;
}
}
}

//]]>

</script>

4° clique em salvar !

► Post Completo

Janela de boas vindas e feed no blog

Criei este widget que permite mostrar uma mensagem de saudação no estilo (estilo pop up) que fica rolando na tela conforme você abaixa a tela e sobe com o botão fecha:

Esse código e bem simples e fácil de adicionar vá em layout, adicionar gadgets e escolha a opção html/javascript e copie e cole o código abaixo:

<style type="text/css">

</style>
<div id="popjan"><a style="float:right" href="#" onclick="document.getElementById('popjan').style.display='none';">[Fechar]</a>
<div style="clear:both"></div><div style="width:300px; text-align:center; margin:auto"><table style="text-align: left;"><tbody>
<tr><td><img height="65" src="http://i40.tinypic.com/21e5hcj.jpg" style="padding-bottom: 10px; padding-left: 5px; padding-right: 10px; padding-top: 5px;" width="65" /></td><td><span class="Apple-style-span" style="font-size: small;">Bem vindo, visitante! Se você é novo por aqui, </span><a href="URL DO SEU FEED" style="color: #999999; text-decoration: none;"><b><span class="Apple-style-span" style="font-size: small;">Subscreva nosso RSS Feed</span></b></a><span class="Apple-style-span" style="font-size: small;"> e acompanhe nossas novidades.</span></td></tr>
</tbody></table></div><div style="clear:both"></div><br />
<a style="font-size:80%" href="http://reidobloguinho.blogspot.com/2010/04/janela-de-boas-vindas-e-feed-no-blog.html" target="_blank">Widget Rei do Bloguinho</a></div>

E altere onde esta URL DO SEU FEED pelo endereço do seu feed e depois clique em salvar.

► Post Completo

Lista de postagens relacionadas

Este código mostra uma lista de postagens relacionadas ou seja postagens recentes do meu blog, postagens sorteadas aleatoriamente.E o melhor essas dicas são automaticamente trocadas cada vez que eu posto algum novo no blog ai ele atualizará automaticamente no seu blog sem precisar fazer nada.

1°Para colocar no seu blog basta ir em layout, adicionar gadget e escolher a opção html/javascript e copie esse código abaixo e cole dentro e depois clique em salvar.

<div id="random-posts"><script type="text/javascript">
quantidade = 7;
</script>
<script src="http://sites.google.com/site/reidobloguinho/listadepostagens/listadepostagens.js" type="text/javascript"></script>
<script src="http://reidobloguinho.blogspot.com/feeds/posts/summary?alt=json-in-script&callback=getRandomPosts&max-results=999" type="text/javascript"></script></div>

► Post Completo

box de pesquisa flutuante no blog

Que tal um caixa de pesquisa no seu blog dentro de um box flutuante,que funciona como uma janela Pop Up que se abre assim que o leitor entra em seu blog .

Criei um script através da ajuda de outros scripts que oferece este recurso e bem simples e util para seu blog pois quando o leitor for procurar o artigo e só digitar e pesquisar.

Para colocar este script basta você seguir as instruções abaixo:

1° para adicionar basta ir em layout, adicionar gadget, e escolher a opção html/javascript e copie o código abaixo e cole de depois clique me salvar:

<style type="text/css">
#topbar
{
padding: 5px 5px 5px 5px;
visibility: hidden;
border: black 1px solid;
width: 340px;
font-family: Tahoma;
position: absolute;
background-color: white
}
</style>
<script type="text/javascript">
var persistclose = 0
var startX = 5
var startY = 5
var verticalpos = "frombottom"

function iecompattest()
{
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function get_cookie(Name)
{
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0)
{
offset = document.cookie.indexOf(search)
if (offset != -1)
{
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function closebar()
{
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}

function staticbar()
{
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id)
{
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.right=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else
{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}

window.stayTopLeft=function()
{
if (verticalpos=="fromtop")
{
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else
{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}

if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<div id="topbar">
<a href="javascript:closebar();"><img border="0" style="float: right;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW0OlW6uj_KQ1iI99bigR8JNMMuIEAFv92hyphenhyphenjzrlU2sei0v7hIZ1GmQHmW0cauuOGWqxrdYNL6rxQQNNBckMijHjs7vJVJ1M6TmKSFPgyNIgRfm45kIWw9nl-ZRVhNDxnma9pADa6N-L7U/" rel="nofollow" title="Fechar janela" /></a>
<a target="_blank" href=""><img border="0" vspace="4" align="left" title="" height="48" src="http://cconsolo.files.wordpress.com/2009/10/lupa.jpg" hspace="4" width="48" /></a>
<center><font color="#000000"><b>pesquisar dentro do blog! <br />digite sua pesquisa agora,para procurar o artigo.</b> </font><form id="searchthis" action="/search" style="margin:0;padding:0;display:inline;" method="get"><input onclick="clickclear(this, 'Pesquisar no blog')" value="Pesquisar no blog" type="text" id="search-box" onblur="clickrecall(this,'Pesquisar no blog')" style="color: #999;" size="20" name="q" /> <input id="search-btn" value="Ok" type="submit" />
</form><span class="Apple-style-span" style="font-size: -webkit-xxx-large;">
</span>
</center><span style='font-size: 65%;font color: #000;text-align: right'>Widget by Rei do Bloguinho<a target='_blank' href='http://reidobloguinho.blogspot.com/2010/04/box-de-pesquisa-flutuante-no-blog.html'><font color="#000000"> Instale este widget</font></a></span></div>
<div class='clear'></div>

não retire os créditos: respeite os créditos do autor do script

► Post Completo