Fantasticos iconos para compartir tus posts en Blogger

Ya puedes ponerte en tu Blogspot estos iconos tan guapos creados con CSS3 para que aparezcan en todas las entradas del blog.

Para añadirlos, vamos a la plantilla y marcamos 'expandir plantillas de artilugios'. Buscamos (apreta control+F) la linea <div class='post-footer-line post-footer-line-3'/> y justo debajo pegamos el siguiente codigo:

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<ul class="redeando-social" id="redeando-cssanime">
<li class="redeando-facebook">
<a expr:href="&quot;http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title " href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Share this on Facebook"><b>Facebook</b></a>
</li>
<li class="redeando-twitter">
<a expr:href="&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot; -- &quot; + data:post.url " href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Tweet This!"><b>Twitter</b></a>
</li>
<li class="redeando-googlebuzz">
<a expr:href="&quot;http://www.google.com/buzz/post?url=&quot; + data:post.url + &quot;&amp;imageurl=&quot;" href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Post on GoogleBuzz"><b>Google Buzz</b></a>
</li>
<li class="redeando-stumbleupon">
<a expr:href="&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title " href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Stumble upon something good? Share it on StumbleUpon"><b>StumbleUpon</b></a>
</li>
<li class="redeando-digg">
<a expr:href="&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title " href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Digg this!"><b>Digg</b></a>
</li>
<li class="redeando-delicious">
<a expr:href="&quot;http://delicious.com/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title " href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Share this on del.icio.us"><b>Delicious</b></a>
</li>
<li class="redeando-linkedin">
<a expr:href="&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;summary=&amp;source=&quot;" href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Share this on LinkedIn"><b>LinkedIn</b></a>
</li>
<li class="redeando-reddit">
<a expr:href="&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title " href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Share this on Reddit"><b>Reddit</b></a>
</li>
<li class="redeando-technorati">
<a expr:href="&quot;http://technorati.com/faves?add=&quot; + data:post.url " href="http://www.blogger.com/post-create.g?blogID=8544071767970846739" rel="nofollow" title="Share this on Technorati"><b>Technorati</b></a>
</li>
</ul>

</b:if>

Ahora buscamos en la plantilla ]]></b:skin> y justo antes añadimos el siguiente codigo CSS y guardamos todos los cambios.

 ul.redeando-social { list-style:none; margin:15px auto;display:inline-block; }
    ul.redeando-social li { display:inline; float:left; background-repeat:no-repeat; }
    ul.redeando-social li a { display:block; width:48px; height:48px; padding-right:10px; position:relative; text-decoration:none; }
    ul.redeando-social li a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}
    ul.redeando-social li.redeando-facebook { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglgSUX8mFnBHOeh8zjHW5nNSccGKnAEXLdU00EeZxOuWR8KHLWGq01c5MpKIlCSiJLGa4_fpgK2f_yjQhAccxOUViTSsIbnxEabt9FM3qkQhKVU7631bsWY0v4s_0BoiFDkDYB5rxNowDU/s1600/way2blogging-facebook.png"); }
    ul.redeando-social li.redeando-twitter { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDPkwHbZrjrYp1rYlM3NfBUXGqsOZ1IATFZ6KpGLm2sWOTGTriAaaVN8ACpEVwlLkgvEGcvAj8pnEfqjp2EbO7X_P2DbMRfjUF2wIyog3n-fNhmV9NqzyZgwAvsuvDRX-QhCzmp5LTwE3b/s1600/way2blogging-twitter.png"); }
    ul.redeando-social li.redeando-googlebuzz { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxRuJ31BK6eTHq0nOa3PjeSU6HEhyphenhyphenBYBMzU6RqJVfPyScmDtFJGINSCCjoTbzwwUcgy5cdXlilNP7Me6MXbIMMIaVGcj1UhXLUbNhJmhFkc4rFcXxKq3BCTarf-UFTg-0CU6yiOWFNF5Ph/s1600/way2blogging-googlebuzz.png"); }
    ul.redeando-social li.redeando-stumbleupon { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNX4FtcwbqHf8jm5CnQRpgyeWWTJadQG0uqGC0PoTOKXlGOhf3-u4q3iegl1WPo7iKXLb-GAhjrpWhPFt7qXB68IEyA2npoOBxCBWoNsvNlKeT2zJixoGo1WvrVEH3cIx1BWcKWHxM0vnh/s1600/way2blogging-stumbleupon.png"); }
    ul.redeando-social li.redeando-digg { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFHNLFWvAJ2fzXdU0Isni8lcQnqSENragm8lJWv9roZRRXbuJNEVEI4tWsrCL2Ubbe09kKxDTuPhsyB3IpLPp4X7piUxxlKwZ0VJO444t3ypkrJCMl2jcTwYlhxkeYBeAO0XwTZdzaTErD/s1600/way2blogging-digg.png"); }
    ul.redeando-social li.redeando-delicious { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyvnAT8SeLUWWkHpF33vokmDPXrUjAtwyjtmFT6BWr2ZHDXir5O3BwSOMFdpkRO8Z9yPrmM0czYm5iNa44EfpQZweSu80wnsNUuSRm8ods9gtBClx-gx7XaNpf2Lft-1IkwKpfczvS3FzO/s1600/way2blogging-delicious.png"); }
    ul.redeando-social li.redeando-linkedin { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS4nyrM5w8kFqSXCOsLV0nc9sXnLN508ugV34r10METZnj_zJvMqPcgl6raEIHhSpuu3LeIoRk6mqsxRPla53AEvzc7kGXyS93bJ7hFBh4SWHZgb3zl0eMvGgVf0PMDP6o8ccBVQ1B5VGn/s1600/way2blogging-linkedin.png"); }
    ul.redeando-social li.redeando-reddit { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsMuXPq7VpJOLiODaJyuM9JvuAg_KaVW8VetiIb_HTN4QCw8RuBriSPQNnvdAaBiNzTqjQe32xykMliETM_luk9PKNsIjYR_K1oWRurv7VyQYzjlHRJcGTR2OIViCBor2ui3Yi5Nqfvetj/s1600/way2blogging-reddit.png"); }
    ul.redeando-social li.redeando-technorati { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhYHf5MGi5xxUfS2_acXWNCg-c3MYSdCM7EicrrCVLvZ8AT6qqlesbJCOOiENw0OroVyandKHDF3zwtNEc9XrVSHzxg0WDT9TxjitQGy7AJpDQ9Q_zW22MUbJrWIjeG0jD5m9CvQfN9not/s1600/way2blogging-technorati.png"); }
    #redeando-cssanime:hover li { opacity:0.2; }
    #redeando-cssanime li { -webkit-transition-property: opacity; -webkit-transition-duration: 500ms;-moz-transition-property: opacity; -moz-transition-duration: 500ms; }
    #redeando-cssanime li a strong { opacity:0; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; }
    #redeando-cssanime li:hover { opacity:1; }
    #redeando-cssanime li:hover a strong { opacity:1; top:-10px; }

Y asi de majos apareceran los iconos debajo de tus entradas:

• 
  Facebook
  
• 
  Twitter
  
• 
  Google Buzz
  
• 
  StumbleUpon
  
• 
  Digg
  
• 
  Delicious
  
• 
  LinkedIn
  
• 
  Reddit
  
• 
  Technorati