Botões redes sociais

Yo galera, venho trazer mais um código de redes sociais. Ele é muito bom pois é fácil de se usar e o visual como sempre é muito bom. Espero que todos vocês gostem. Qualquer dúvida deixe um comentário.

Veja o exemplo abaixo:

Agora crie uma pagina Html/JavaScript e cole o código abaixo:

<a href=" LINK DO FACEBOOK" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihh5aU158rw63WFwMYjzk6oYrzi6NNOkJgnMFJSPi-cLqtLxaCFjaD4sIx8dEZaGhWDnIsW4Jp6WGjR65hGRJz0YOqJ3xMAgVqYzmmdtuo9t0stZIDzDRWu4gGnUlT2CaBQel4AXrucxg/s1600/facebook-30x43.png" /></a><a href=" LINK DO TWITTER" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPN0DubOPl06dgweFJxBRoPlU8oYEUzfrL3LhDxpkNYaQmiFkjqFNrK_TAgtImXT3uc4rYo0hZty7AuBJC8KIyXw9BUD82Zz_nWeVNbJl8Aw816CSqrapZsk1KCf4bLio-V3F63Q1Q_PE/s1600/twitter-30x43.png" /></a><a href=" LINK DO GOOGLE PLUS " imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjApi_nx99yk22ftgtyz9UWiS80F2LDI0QLrqitqnJgRVbA0EpaljEurS2q92bJJc2G2HVfaXRzoyVtg3ktPRt5O2uTF_I7kO8qKOtBI3DZhZQ4xF_6HWI0TyttZvxIR_3qGtNiYmdfE_E/s1600/googleplus-30x43.png" /></a><a href=" LINK DO SEU FEED" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoVlIO8qLssxyi-bJP9uyAbQ6KBsv9skViH3CiZFzj9vdmpGTROq75-0PbNbWKjQZYpNUEVp55sP1XevRCqhCfP8rhbHKk1VCx-vFmGeefAAXdHcJybX5wUy2X-Z3z-JQl9xNQwP8BcCo/s1600/rss-30x43.png" /></a>

Edita o facebook, Twitter, Google Plus e o Feed com os seus links.

Ícones de redes sociais com animação [2]

Yo galera, venho trazer o segundo código de botões de redes sociais com animação, para ver o primeiro clique aqui. Ele é muito bom pois é fácil de se usar e o visual como sempre é muito bom. Espero que todos vocês gostem. Qualquer dúvida deixe um comentário.

Veja o exemplo abaixo:

1º Vá em Editar HTML e dê Ctrl+F e procure por:

</head>

2º E acima dele cole o código abaixo:

<!-- Start Heart Bookmarking Gadget Code From http://www.spiceupyourblog.com/ --><script src='http://w.sharethis.com/gallery/shareegg/shareegg.js' type='text/javascript'/><script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/><script type='text/javascript'>stLight.options({publisher: "bea50586-2b9f-448d-947a-01385f28e305", onhover:false}); </script><link href='http://w.sharethis.com/gallery/shareegg/shareegg.css' media='screen' rel='stylesheet' type='text/css'/><!-- End Heart Bookmarking Gadget Code From http://www.spiceupyourblog.com/ -->

3º Agora procure por:

</body>

4º Logo antes dessa tag cole o código abaixo:

<!-- Start Heart Share Code From http://www.spiceupyourblog.com/ --><div style='position: fixed; bottom: 2%; left: 2%;'><div class='shareEgg' id='shareThisShareEgg'/></div><script type='text/javascript'>stlib.shareEgg.createEgg('shareThisShareEgg', ['facebook','twitter','googleplus','linkedin','blogger','stumbleupon','sharethis'], {title:' <data:blog.pageTitle/>',url:'<data:blog.url/>',theme:'shareegg'});</script><a href="http://www.spiceupyourblog.com/">Blogger Wordpress Gadgets</a><!-- End Heart Share Code From http://www.spiceupyourblog.com/ -->

Ícones de redes sociais com animação

Yo galera, venho trazer mais um código de botões de redes sociais com animação, para colocar em seu site. Ele é muito bom pois é fácil de se usar e o visual como sempre é muito bom. Espero que todos vocês gostem. Qualquer dúvida deixe um comentário.

Veja o exemplo abaixo:

Agora crie uma pagina Html/JavaScript e cole o código abaixo:

<!-- Start Shareaholic Sassy Bookmarks HTML --><br /> <div class='shr_ss shr_publisher'> </div> <!-- End Shareaholic Sassy Bookmarks HTML --><br /> <!-- Start Shareaholic Sassy Bookmarks settings --><br /> <script type='text/javascript'> var SHRSS_Settings = {"shr_ss":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}}; </script><br /> <!-- End Shareaholic Sassy Bookmarks settings --><br /> <script src='http://dl.dropbox.com/u/103852546/Bookmarks.js'></script> <br /> <!-- Start Shareaholic Sassy Bookmarks script --><br /> <script type='text/javascript'> (function() { var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true; sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s); })(); </script><br /> <!-- End Shareaholic Sassy Bookmarks script -->

Botão De Seguidores Do Twitter No Blog

Yo galera, venho trazer mais um código de botão do Twitter para colocar no seu site.  Ele é muito bom pois é fácil de se usar e o visual como sempre é muito bom. Espero que todos vocês gostem. Qualquer dúvida deixe um comentário.

Veja o exemplo abaixo:

Follow @DesignerProjec1

Crie uma pagina Html/JavaScript e cole o código abaixo:

<a class="twitter-follow-button" data-lang="pt" href="https://twitter.com/SEU NOME NO TWITTER">Follow @SEU NOME NO TWITTE</a> <script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script></code>

Caixa de seguidores do Twitter

Yo, trago esse tutorial para deixar a caixa de seguidores do Twitter mais legal. ^^

Primeiro passo:

Bom, no blogger, vá em Design, adicionar um gadget, HTML/JavaScript. E cole o código logo abaixo mas lembrando em editar as devidas partes em vermelho.

<div class="textwidget">

<script type="text/javascript" src="http://s.moopz.com/fanbox_init.js"></script>

<div id="twitterfanbox">

<script type="text/javascript">fanbox_init("NOME NO TWITTER");</script>

</div>

</div>

<style>

.FB_SERVER_IFRAME {

height: 250px !important;

width: 290px !important;

</style>

Espero que tenha gostado. ^^

Adicionando facebook na lateral

Yo, trago o tutorial de como colocar o facebook na lateral da tela. Espero que gostem.

Vamos lá

1º - Vá no Painel de Controle de seu Blog e clique na Guia Modelo.

2º - Clique no Botão Editar HTML.

3º - Agora pressione as teclas CTRL+F e procure por:

</ head>

 4º - E ACIMA dele cole o seguinte código:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/

jquery.min.js" type="text/javascript"></script>

5º - Clique em Salvar Modelo.


Agora vamos adicionar essa Box em seu blog, então faça o seguinte:
Clique na Guia Layout →  Adicionar um Gadget e selecione a opção "HTML/JavaScript". (Não adicione título no gadget). Na caixa do Gadget cole o código abaixo:

<script type="text/javascript">

//<!--

$(document).ready(function() {$(".box-curtir-flutuante").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});

//-->

</script>

<style type="text/css">

.box-curtir-flutuante{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhksEQMG-20HK0ymIgU591SUFDwoAaQrBeW_N3Mml4-vMwmgE4X9B0AFSepdv-WOuv8KtwMvEU3FkjPfzpEwOa2aC-o2q-mLUjZeT77o2KsqVzJjzmrTS5n_f3VZVf2pGHOYdKUnnJ3dJs/s1600/floatingfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}

.box-curtir-flutuante div{border:none;position:relative;display:block;}

.box-curtir-flutuante span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}

.box-curtir-flutuante span a{color: #808080;text-decoration:none;}

.box-curtir-flutuante span a:hover{text-decoration:underline;}

</style><div class="box-curtir-flutuante" style=""><div><iframe src="//www.facebook.com/plugins/likebox.php?href=COLOQUE-O-URL-DA-SUA-PÁGINA-DO-FACEBOOK&amp;width=251&amp;height=270&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23cccccc&amp;stream=false&amp;header=false&amp;appId=159468740772399" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#fff;" allowtransparency="true"></iframe></div></div>

6º - Feita as alterações, clique em Salvar.

Pássaro do twitter voando

Yo, traga do esse tutorial bem bacana, um pássaro do twitter voando na tela, então o código está logo abaixo, pra adicionar você deve:

Crie um Gadget sem título de HTML/JavaScript em qualquer lugar do blog e cole o script abaixo:

<script src='http://oloblogger.googlecode.com/files/tripleflap.js' type='text/javascript'></script>

<script type='text/javascript'> 

var birdSprite="http://img827.imageshack.us/img827/7393/birdsprite.png";

var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");

var twitterAccount = "ENDEREÇO NO TWITTER";

var tweetThisText = "Leyendo: WWW.CREATE SOUL.BLOGSPOT.COM";

tripleflapInit();

</script>     

É isso,espero que tenha ajudado. Valeu.