Iconos Sociales con efecto Zoom

Para agregar estos iconos a tu blog, para que vincules tus perfiles sociales con efecto zoom.



Ir a Diseño en "Añadir un gadget", seleccionar 'Html Javascript' y pegar el código que dejo abajo, solo hay que reemplazar lo que esta en en rojo por la URL correspondiente y guárdalo.

Este es el código:

<style>
.social-connect-widget img{
-webkit-transform:scale(0.9);
-moz-transform:scale(0.9);
-o-transform:scale(0.9);
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
}
.social-connect-widget img:hover{
-webkit-transform:scale(1.2);
-moz-transform:scale(1.2);
-o-transform:scale(1.2);
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
}
.social-connect-widget{text-align:right;margin:20px 20px ;}
.social-connect-widget img{vertical-align:middle} </style>
<div class="social-connect-widget">
<a href="TU PAGINA DE GOOGLE+" target="_blank"><img alt="Google+" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3-mkk5dT7g7cWmEqo9ALk3k9HpeaY_rINaUQvSyz1mJ6VM44unbIWx8WIMOd7W4I6DSEKuIv_AvGAeTGofOvKqXi4bm9zwCxVbgsqefvu4ef7lg8RjUL7WKns3mIo2IshGQV9ynKK-UE/s32/googleplus.png" title="Sigueme en Google+" /></a>
<a href="TU NOMBRE DE TWITTER" target="_blank"><img alt="Twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEHmTgE03MWMSG89qYERMgkBZmxH2evZny6963xCHoO2ESW0UWjJZ2rBaW2DRRUwuJAyUaNZ19T9BJInOBg9dpbnCUbLu1O8ewBMaZjh2kaXIfbYoaIbsDpVC8kz19it-YzG7nNjNbW10/s32/twitter.png" title="Sigueme en Twitter" /></a>
<a href="TU ID DE FACEBOOK" target="_blank"><img alt="Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizYkayC69PyRFjdCWdha1KInTK_-EMWhH4W4AkCnIN9VtfIngi5FcWsvGcxxUcV5V8w5h51lgxlb8vnimTBXIjbFvGTEzhx_8BH_NyueFSJuPXn7wAOADhykb7m2yyIhX4VlFNKNheP2Y/s32/facebook.png" title="Sigueme en Facebook" /></a>
<a href="TU ID YOUTUBE" target="_blank"><img alt="YouTube" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeCf14zoGxnm31ZsSJONvPhvTsicIkvAO7P3xFBnYGSYE3-Ip32i6ofEIcC3vElK-D8j8dveAKjtOtwLiDo3pfa77iM8QZ3WZpPikoTOIM7283EmVQJLWFeZYiIXVhBv3hbdz21nWESy4/s32/youtube.png" title="Sigueme en YouTube" /></a>
<a href="LA DIRECCION DE TU FEED RSS" target="_blank"><img alt="feed rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs8m3svP6OaS6jVeR-wfBbai2vsGE6HGnowtpa3g4vsOVPV1A50-QZt_ScPZg3ERsb9ZIbq1wvR7iwz778vjhLWNQq2uAsQG1XbA5Zu4uFUQTT2PBJUxbvt-tU3995E-rNphkHoE7Jj8Q/s32/rss.png" title="Suscribete por Email" /></a>
</div>

Leer más

Poner botones compartir debajo del titulo del post

Para poner los botones de compartir debajo del titulo del post o entrada

Buscar

<div class='post-share-buttons goog-inline-block'>

nos mostrara

<div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>

borramos todo el codigo y buscamos

<div class='post-header-line-1'/>

Nota → Existen 2 lineas con el mismo código, prueba en ambas ya que para algunos resulta bajo la primera y en otros bajo la segunda.

después de esta linea pegar

<div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>

↑Es el predefinido por Blogger. 

o puedes poner ↓

<table border='0' cellpadding='0' style='float:left;'><tbody>
<tr><td><a class='twitter-share-button' data-count='horizontal' data-lang='es' expr:data-url='data:post.canonicalUrl' href='http://twitter.com/share' expr:data-text='data:post.title'></a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></td><td><g:plusone expr:href='data:post.url' size='medium'/></td>
<td><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?locale=es_ES&amp;href=&quot; + data:post.url+ &quot;&amp;layout=button_count&amp;show_faces=true&amp;share=true&amp;width=120&amp;height=21&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; height:21px'/>
</td>
</tr>
</tbody>
</table>

Leer más