.

sexta-feira

Mini PopUp Animada para curtir a Fan Page no Facebook

ACESSOS:
Deixe seu comentário


Cursos 24 Horas

Cursos Online 24 Horas
Neste post falarei aqui como você pode estar colocando em seu blog uma mini pop up, ou seja, uma caixinha, igual a essa na imagem abaixo, que ficará no canto inferior direito da sua tela. Esse Widget é fácil de carregar, tem efeito deslizante e atraente, e além disso, facilita os visitantes do seu blog visualizarem o botão "Curtir no Facebook", com isso você consegue mais público para o seu blog.
Você pode ver está caixinha também em nosso blog. Observe que, ao descer a página do Blog, a janela Pop-Up aparece com um efeito deslizante ao lado direito do blog próximo ao roda-pé, e na janela aparece o Botão Curtir. Muito legal né!!! 

Como colocar no blog


Acesse o painel de edição do seu blog 

A seguir vá na opção "Layout" e depois clique em "Adicionar um Gadget"

Depois clique na opção "HTML/JavaScripts" e cole o código abaixo:
<script type="text/javascript" src="https://sites.google.com/site/dicashotblogger/home/javascriptdicashot/DicasHot.js"></script> <script type="text/javascript">$(window).scroll(function(){if($(document).scrollTop()>=$(document).height()/4)$("#mbsocial").show("slow");else $("#mbsocial").hide("slow");});function closeMBsocial(){$('#mbsocial').remove();$.ajax({type:"POST",url:"/facebookpage.php"});}</script> 
<style> #mbsocial{background:#f3f3f3;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;-moz-box-shadow:inset 0 0 3px #333;-webkit-box-shadow:inset 0 0 3px #333;box-shadow:inner 0 0 3px #333;padding:12px 14px 12px 14px;width:300px;position:fixed;bottom:13px;right:2px;display:none;z-index:3;height:100px;} .getmore a{display: inline-block;font-weight: normal;text-decoration: none;font-size:9px;color:#333!important; float:right;} .getmore a:visited{ color:#ddd;}</style>  
 <div style="display: none;" id="mbsocial"> <a style="position:absolute;top:14px;right:10px;color:#555;font-size:10px;font-weight:bold;" href="javascript:void(0);" onclick="return closeMBsocial();">(X)</a>
<span style="font-family: Verdana; font-size: 15px; margin: 10px 0; text-shadow: 1px 1px 0 #FFFFFF;font-weight:bold;color:#555;">Curta nossa Fan Page!</span><br />
 <a>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FDicashot&amp;width=230&amp;height=62&amp;show_faces=false&amp;colorscheme=light&amp;stream=false&amp;border_color&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:230px; height:62px;" allowtransparency="true"></iframe>
</a>  
</div>
<div class='clear'></div>
Substitua o nome Dicashot destacado em vermelho no código pelo nome da sua página no facebook.
Feito isto está pronto!!! Salve e visualize.

Cursos 24 Horas

Cursos Online