Botões de compartilhamento ao pé do post

DEMO

Mais um modelo de botão social para que seus leitores espalhem por aí, sem dó nem piedade suas postagens. É assim mesmo, com todo mundo dando aquela compartilhada que os posts se espalham, seu blog vai ficando mais conhecido e assim sendo  melhor indexado pelos motores de busca.

Vá até o "Modelo de seu blog", clique em "Editar HTML"

  Hack para o template do Blogger, implementado em  abril de 2013.

 Agora vamos procurar por

 Agora que encontrou, clique na seta ao lado do código.

 Pronto. Veja, o código de seu template está todo dividido em partes. Mas para encontrar o código que queremos você precisará abrir a seguinte parte:


<b:includable id='post' var='post'>...</b:includable>

Procure por:

<div class='post-footer-line post-footer-line-1'>

Abaixo dele, cole o próximo código e depois salve.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#mintshare_mini, #mintshare_mini ul {padding:0; margin:0; list-style:none; width:100px; font-family:arial, sans-serif; background:#fff;}
#mintshare_mini {width:100px; height:35px;padding: 0 15px;
margin-top: 30px;
margin-bottom: 20px;}
#mintshare_mini a.sharetext {
display:block; width:110px; height:30px; text-align:center; line-height:35px; color:#000; text-decoration:none; font-size:13px; font-weight:bold;
background:#fff;
padding-left:5px;
cursor:pointer;}
#mintshare_mini a.sharetext img {
border: 0 none;
display: block;
margin-left: 10px;}
#mintshare_mini .flyout {
background: none repeat scroll 0 0 #AAAAAA;
height: 113px;
left: 40px;
position: relative;
top: -4px;
width: 0;
transition: width 1s ease-in-out;
-o-transition: width 1s ease-in-out;
-moz-transition: width 1s ease-in-out;
-webkit-transition: width 1s ease-in-out;}
#mintshare_mini .flyout ul {
background:#fff;
list-style:none;
position:absolute;
top:-27px;
width:420px;
height:35px;
border-left:0;
left:50px;
padding-right:10px;
z-index: 1;
overflow: hidden;
padding-left: 15px;
transition: 1s ease-in-out;
-o-transition: 1s ease-in-out;
-moz-transition: 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;}
#mintshare_mini .flyout ul li {float: left;}
#mintshare_mini .flyout ul li a{}
#mintshare_mini .flyout ul a img {}
#mintshare_mini .flyout ul li.drop-li {position:relative; width:35px; height:30px; float:left; z-index:100; margin-top: -2px;padding-left: 15px;}
#mintshare_mini .flyout ul li.drop-li a.drop-a {display:block; width:100px; float:left; text-decoration:none; line-height:16px;}
#mintshare_mini .flyout ul li.drop-li a.drop-a img {display:block; border:0; position:absolute; left:5px; top:5px; z-index:-1; opacity:1; filter: alpha(opacity=100);
transition: 0.4s ease-in-out;
-o-transition: 0.4s ease-in-out;
-moz-transition: 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;}
#mintshare_mini .flyout ul li.drop-li a b {background:lightBlue; padding:2px 0; font-family:arial, sans-serif; display:block; width:100px; margin-top:58px; text-align:center; cursor:pointer; color:#000; font-size:14px; opacity:0; filter: alpha(opacity=0);
transition: 0.4s ease-in-out;
-o-transition: 0.4s ease-in-out;
-moz-transition: 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
-o-border-radius:10px;}
#mintshare_mini .flyout ul li.drop-li:hover &gt; a img {opacity:0.5; filter: alpha(opacity=50);}
#mintshare_mini .flyout ul li.drop-li:hover &gt; a b {opacity:1; filter: alpha(opacity=100);}
#mintshare_mini .flyout ul li.drop-li a:hover img {filter: alpha(opacity=50);}
#mintshare_mini .flyout ul li.drop-li a:hover b {filter: alpha(opacity=100);}
#mintshare_mini .get_mintshare {
font-size: 10px;
margin-left: 5px;
position: relative;
top: 2px;}
.relbg h5{
color: #fafafa;
font-weight: normal;}
</style>

<!-- MintShare Mini -->
<div id='mintshare_mini'>
<a class='sharetext'><b>Compartilhe-me</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<div class='flyout'>
<ul class='icons'>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc-il0py6hcXIU4k8feSTsvGsvIvla1H_kTgIkAwTu5e2MPaLDUg5CIXad1Q1rjNNvE0yFeN5mKOOSxU5x2Zx_ShvQgs6p10xdAT0-A-uEr9jhqX92Hd03WE-V82R3DtLvuaKMqJscA3NX/s0/facebook_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEF4bO5_FQWnYI3eug59BuELcQp3uJbNxxgxGHwYSqh0d9OZbYrVwsPSJSpIuu1Cqlt_l3dWOqo7wT455iwi3eR_jgJqCG_E10B37Jeo3gqBKOpORjk5MxXCVcTvNIDbSBo9_l7SO_5We4/s0/twitter_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://www.stumbleupon.com/refer.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4yBMC8bcW0DsA66BUp7askSDUmbOpJNqGxyE4Ji5QH2oQQKrSIsFIFlPMpnPGEskNsyrTCmQ6BdQpFRAtOcLtwqNj6N0fYM9nSIdc8z-tjBI57Ivc8xN-99BzpMvOlYR5_r-2utQJ0XK_/s0/stumbleupon_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBxsfXB93vcEDCmLlmZozUQM6fzecLLMvksVEe4Y62uUkqu2TzT9nRomqfPbNkad9zYqZDhPFzhJQizj-g19KcA1yka3nF0JZHyYacrqQnUzfDkfmUdjT3CTV_sVeDycDMa4pMZ1Qs5x3G/s0/digg_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://www.technorati.com/faves?add=&quot; + data:post.url'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT6GHE6s9BrIIMVBUjRl-NH902-LWVFeSKAjEcF3k_pHVkTYAuwie8ZJx9dvF-HQUco4o7QNhSBTO95M-0xHaC2Qgx_ddxQWVJDyWJaI3b0UHzhjx7oohs9oj8pO9_CY1wxHR5VpDAjo1h/s0/technorati_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1X0hyphenhyphenD0_o1cW9fvUbGJsz4ZhI6wtKbCuQH6VpOELUJAhS89KcY6Ic73NnvJnPp_ChPbqDGgCmLfATUEGyKuDEkvGb3myk5mOVfdd5ZknsqJzBpqfeQp-rKHze3r_rGWss0QpfQoGKqrHN/s0/reddit_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://myweb2.search.yahoo.com/myresults/bookmarklet?t=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-AlfXIVTW2vyhGM_Y8byK8zdZMsWnQx6qaz6GbMVUZuqeSPtRyoW9dtTUCSFQ_Sn3nRBeY6lrw9MrIpj9B-QiTWfCQrWQdh3cPdkGbst1Fe4PNSc6Om_XCKentQfC5hdIXumptRRHPPCy/s0/yahoo_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li class='drop-li'><a class='drop-a' expr:href='&quot;http://delicious.com/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjClaId54uQ3qgV1aoXDHEQLU_7i9VfLqv6wqVi7pIfoJ-QlGarV6xxurWajP_omnmgqTS_03TwGduVLmwBRQW5qAlw8SKhymiot7IJgOFzGOPwr8ntvMQ4tDeUR5KvOEU8cWvpSLNQ4TvT/s0/delicious_small.png'/><!--[if gte IE 7]><!--></a><!--<![endif]--></li>
</ul>
</div>
</div>
<!-- MintShare Mini End--></b:if>

»»Leia mais...

Gadget do Google Plus no Blogger

É possível um blog sobreviver sem as redes sociais ? Não sei ao certo, mas a verdade é, um blog bem indexado, com widgets e gadgets de redes sociais incorporados ao blog ajudam e muito. Pode ser alguém navegando a esmo, um paraquedista ou uma pessoa com indisposição ou impossibilidade de ler seu blog naquele momento, mas tendo ali qualquer gadget onde ela possa curtir seu blog, com certeza ela o fará, e isso ajudará sem dúvidas a divulgar seu blog.

Vá até o Layout de seu blog

Clique em Adicionar um Gadget

Ao abrir clique em "Selo do Google +"

Clique agora em "ID de perfil do Google +"

Você será direcionado a uma outra página como essa abaixo. Copie então o código e cole no HTML/Javascript em seu blog.

»»Leia mais...

Menu com botões sociais flutuante na lateral do Blogger

Depois de muito procurar por este menu para compartilhar seu blog e postagens nas principais redes sociais como Twitter, Facebook e Google Plus, acabei encontrando o código certo e mais fácil de instalar no blog Internovinet. Esse é colocado no HTML/Javascript. Facinho demais.

  Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo. Essa dica é para o template Simple, do novo Blogger, implementado em julho de 2011

Vá até Layout

Clique em Adicionar um Gadget

Ao abrir, clique em  HTML/Javascript

Cole então o código abaixo e salve.
(se quiser que flutue a esquerda, troque o código que está em vermelho pela palavra left)

<!-- Começo código -->
<style type='text/css'>
.dvin{
     border-style:solid;
      border-width: 3px;
     border-color:#e3e3e3;
     padding-top:10px;
     padding-bottom:50px;
     padding-right:2px;
     padding-left:2px;
     border-radius: 6px;
     -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
 }
  .plus {
     text-align: center;  
     margin-top: 5px;
     margin-left: 1px;
 }
 .tweet {
      text-align: center;
      margin-top: 3px;
 }
 .face {
      text-align: center;
      margin-top: 4px;
 }
</style>

<div style='position: fixed; top: 40%; right: 3px'>
<div class='dvin'>
<!-- Google +1 -->
<div class='plus'>
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'>{lang: 'pt-BR'};}</script>
<g:plusone size='tall'/>
</g:plusone>
</div>
<!-- Tweet -->  
<div class='tweet'>
 <a class='twitter-share-button' data-count='vertical' data-via='Internovinet' href='http://twitter.com/share' rel='nofollow'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>
</div>
<!-- Facebook -->
<div class='face'>
<a href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Share</a>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'></script>
</div>
</div>
</div>

»»Leia mais...