Colocando PopUp Facebook no Blogger

Visitando alguns blogs percebi que tem um novo Widget PopUp Do Facebook, que está sendo muito utilizado e

uma ótima ferramenta para divulgar seu blog para os leitores, incentivando a seguir seu blog e ficar por dentro de todo conteúdo via Facebook. Resolvi postar aqui no blog como fazer esse Popup do Facebook quando abre a pagina do blog.

A instalação é bem simples.

Acesse o painel do blogger, vá até o menu “layout”, clique em “adicionar um gadget”, escolha o tipo “html/javascript” e cole o seguinte código:

<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 aos trechos que você precisa alterar:

kakinetworkdotcom01username="NOME-DA-SUA-PAGINA",
kakinetworkdotcom01time="10", onde "10" corresponde ao tempo em segundo que o popup do Facebook vai ficar aberto.

Pronto!!

Espero que esse tutorial seja útil!  Expresse sua opinião, comente e tire suas duvidas...