colocar menu fixo de curtir pagina no facebook

Olá galera,não estou passando muito bem e por isso vou fazer um rápido tutorial.
Criei um código pronto aqui e básico para vocês.
Bem,ela ficará assim:
Eu pontilhei em volta para vocês poderem achar mais facilmente mas não coloquei borda no "trocinho".

Então,vamos lá.
Aqui está o código (toda a parte dentro do quadradinho colorido),copie e cole em um bloco de notas:
<div style="display: block;" id="BOX">
 <a style="position:absolute;top:14px;right:10px;color:#555;font-size:10px;font-weight:bold;" href="javascript:void(0);" onclick="return closect();"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgNqhCCquIyETe5iDXZ_ht23pvNafHWjwPr6mAk3k8ePfFQkuKOc7IgBNC_ZllS0G5B7LpBal1S5rqwaiU70R8Tb6PogwFlgC2y8PRP7jJBf0vDQMtITgELNpV1yu1sRxSCBw-yHxccSA3/s1600/pixels__dp+(3).gif" /></a>

<span style=" font-size: 20px;  font-weight:bold; color: #FFF;font-family: arial; padding-right: 107px;">Curta a Página!</span> <br />
 <a>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fpages%2FBelos-Sonhos-Blog%2F611495805564218%3Fref%3Dhl&amp;width&amp;height=62&amp;colorscheme=light&amp;show_faces=false&amp;header=true&amp;stream=false&amp;show_border=true&amp;appId=254110221429714" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:62px;" allowtransparency="true"></iframe>
</a>

</div>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript">function closect(){$('#BOX').remove();$.ajax({type:"POST",url:"/facebookpage.php"});} </script>

<style>
#BOX {
background: url('http://i.imgur.com/LeHp1ML.png');
padding: 12px 14px 12px 14px;
width: 300px;
position: fixed;
bottom: 13px;
right: 2px;
display: none;
z-index: 3;
height: 100px;
}
</style>
Agora, vamos começar a dar algumas funções à ele, em <iframe> até </iframe> você vai apagar e vai colocar o código iframe da sua pagina...Para isso,vai em facebook developers e vai criar uma "like box" neste site.
É bem fácil de criar,só seguir as instruções e em "widget" e "height" você deixa em branco,após criar,clique em get code. Vai na guia iframe e copia o código e substitui neste código que eu lhe mandei.
Prontinho,sua caixinha está criada.
Caso querer trocar o nome "curta a page" é só trocar no código.
Flw.

Importante:
Ele é editável,fique à vontade para editar as imagens de fundos e tudo mais...

4 comentários:

Calriati disse...

São tutorias assim que estão em falta, simples e úteis. Fáceis de entender!
Sem dúvidas que esse tutorial me ajudou, vou colocar ele no meu blog também hihi!
E pena que tu não tá muito bem amore, espero que melhore!
Beijos!
www.gramatifiquei.com

dress disse...

Tati vc por aq...♥
vou melhorar sim,ainda bem...
que bom que lhe ajudou,adoro noticias boas :)

Garota com Lilás disse...

Mais em que lugar do editor HTML que eu vou colar esse código?

dress disse...

amanda,você pode colocar onde quiser... até adicionar um gadget html/javascript!

Postar um comentário

Obrigada por comentar, deixe seu blog no comentário para eu retribuir *-*