Com este recurso você pode colocar mensagens no seu blog de forma a deixa-las flutuando na página, também é possível inserir uma caixa de assinatura de Feed. Tornando o acesso ao seu blog mais interativo e interessante para o leitor que o acessa, veja um demo.Veja como trazer está solução para o seu blog.
1) Acesse o painel do Blogger(blogger.com)
2) Vá em Layout-> Editar HTML
3) Procure pelo seguinte código utilizando as teclas CTRL e F:
</head> Antes do código acima insira o seguinte:
<script src='http://www.google.com/jsapi'/>
<script type='text/javascript'>
// Carrega jQuery
google.load("jquery", "1.3");
google.setOnLoadCallback(function() {
$(document).ready(function()
{
//primeiro slide para baixo e pisca a caixa de mensagem
$("#caixa").animate({
bottom: "-1px"
}, 2500
).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100);
//Fechar a caixa de mensagem quando a imagem da cruz é clicada
$("#fechar_mensagem").click(function()
{
$("#caixa").fadeOut("slow");
});
});
});
</script> 4) Agora procure pelo seguinte:
<body> Abaixo do código anterior insira o seguinte:
<div class='mensagem' id='caixa'>
<img id='fechar_mensagem' src=’http://arquivos.noticiaeblog.com/fecha.png' style='float:right;cursor:pointer'/>
<b>Minha Mensagem</b> <p>Teste da caixa de mensagem flutuante para Blogger</p>
</div>
Obs: Mude os trechos em vermelho pela mensagem que deseja que apareça já com a formatação em HTML. Pra saber mais sobre HTML veja a nossa serie Aprenda Códigos HTML e Ganhe Mais Visitas, partes: 1,2,3.
5) Procure pelo seguinte trecho:
]]></b:skin> Antes do trecho acima insira:
.mensagem{
border:1px solid #CCCCCC;
position:fixed;
width:150px;
border:1px solid #c93;
background:#ffc;
padding:5px;
right:2px;
bottom:25px;
} Obs.: Você mudar as cores da caixa utilizando cores alfanuméricas. Para ver cores clique aqui.
6) Salve as alterações
---------------------------------------------------------------------------------------------------------------------------
Obs. Gerais: Para transformar a caixa em um local para assinatura de Feed/RSS, basta substituir o trecho em vermelho do passo 4 pelo seguinte:
<b>Assine o Feed</b>
<p>Fique informado da novidades do blog por e-mail</p>
<p><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=Noticiaeblog', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' style='border:1px solid #ccc;padding:3px;text-align:center;' target='popupwindow'><p>Digite seu e-mail:</p><p><input name='email' style='width:140px' type='text'/></p><input name='uri' type='hidden' value='Noticiaeblog'/><input name='loc' type='hidden' value='pt_BR'/><input type='submit' value='Assinar'/></form></p> Atenção altere o trecho em vermelho pelo seu nome de Feed, se não sabe veja o exemplo a seguir.
Nosso endereço de Feed: http://feeds.feedburner.com/Noticiaeblog
Nosso nome de Feed: Noticiaeblog
Aproveite e assine o nosso Feed para concorrer a um dominio para o seu blog.
Fonte: Blogger Widgets
9 Comentários
Olá fernando, estou aqui para te convidar a participar da campanha I ♥ Firefox, onde vamos juntar uma comunidade de blogueiro para mostrar para o mundo que o melhor mesmo é o firefox!
http://www.jethot.com.br/2010/05/campanha-i-firefox.html
E quanto ao post eu tentei e não funcionou!
@Jc Denton, olha posso dar meu apoio mais eu ainda prefiro o Google Chrome, mas acho que isso é uma opinião pessoal cabe a cada um definir.
Olha a respeito do post tente fazer de novo pois testei várias vezes e funcionou, veja se você já possui o jquery pois pode haver um conflito entre os dois, ai basta você retirar o que você já tem e colocar este que coloquei.
Ola amigo, gostei do post, só que não estou conseguindo implementar no meu blog. Deve ser por causa do jquery. Mas como retirar o antigo? Outra perguntinha: Como colocar a página do feed (http://feeds.feedburner.com/Noticiaeblog) toda em portugues? Desde já agradeço a sua atenção, obrigado!
Muuto bom mesmo, obrigado!
Este recurso é muito interessante para atrair novos leitores...
Gostaria de Saber, Meu amigo como ativar assinaturas por e-mail do feeds?
Desde já Obrigado!
QUERIA SABER COMO PONHO UMA IMAGEM NO LUGAR DO TEXTO
Tentei também e não funcionou!
Verifica o código para que possamos adiciona-los em nossos blogs/sites!
Procurando parceria? Eu também, passa lá e siga-me, farei isso também!
bloguedorenato.blogspot.com
Até mais
Postar um comentário
Deixe seu comentário aqui
Para exibir sua foto, escreva o seu comentário e clique em "Visualizar" e em seguida clique em "Adicionar Foto de Perfil"(Só é exibido quando o comentário é publicado como Conta do Google). Para editar seu perfil Clique aqui.