Muchos sabemos lo importante que es agregar botones de redes sociales en un blog, pues por medio de ellos los lectores de nuestros blogs pueden compartir los artículos que publicamos en sus respectivos perfiles de sus redes sociales. Esta comprobado que los marcadores sociales aumentan considerablemente el numero de visitas de una web, eso si hay que saberlos ubicar y tener un diseño de botones elegante y no sobredimensionado.

En el día de hoy voy a compartir un espectacular pack de marcadores sociales para que los agregues en tu blog, son sencillamente espectaculares, además vienen con contador en el que se muestran la cantidad de veces que ha sido compartido el post.

Los botones se ven de la siguiente manera:

Para agregar estos botones, pega el siguiente código donde quieras (una buena opción puede ser el footer del blog).

<!-- BOTONES SOCIALES GETSHARES -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='buttons'/>
<script src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js' type='text/javascript'/>
<script src='http://cdn.getshar.es/lib/0.8.0.min.js' type='text/javascript'/>
<link href='http://cdn.getshar.es/lib/0.8.0.min.css' rel='stylesheet' type='text/css'/>
<style>#buttons{text-align:center; margin:10px auto;font-weight:normal;}</style>
<script type='text/javascript'>
(function(){
var settings;
settings = {
root: $(&quot;#buttons&quot;),
counter: {
position: &quot;inside&quot;
},
share: {
url: &quot;<data:post.canonicalUrl/>&quot;,
imageUrl: &quot;<data:post.firstImageUrl/>&quot;,
message: &quot;<data:post.title/>&quot; + &quot; <data:post.canonicalUrl/> Vía: @oloman&quot;
}
};
new GetShare($.extend(settings, {network: &quot;googleplus&quot;}));
new GetShare($.extend(settings, {network: &quot;twitter&quot;}));
new GetShare($.extend(settings, {network: &quot;facebook&quot;}));
new GetShare($.extend(settings, {network: &quot;linkedin&quot;}));
new GetShare($.extend(settings, {network: &quot;pinterest&quot;}));
new GetShare($.extend(settings, {network: &quot;pocket&quot;}));
//Más redes en http://getshar.es/
}).call(this);
</script>
</b:if>

Ahora solo debes guardar los cambios. Espero que este tutorial haya sido del agrado de todos ustedes y no olviden compartirlo en las redes sociales.

Hasta la próxima amigos.


5 comentarios

Ana Victoria Lagos · enero 8, 2015 a las 12:09 pm

a que le llamas footer? a donde se ponen los widgets o a la plantilla?

José Daniel Figuera · enero 9, 2015 a las 7:46 pm

Donde se ubica el «Fooster»?

Jonathan · enero 14, 2015 a las 2:20 am

Hola amigo, una pregunta tienes el código de la botonera que tienes actualmente?

Miguel · enero 24, 2016 a las 8:33 pm

Hola. ¿es posible aumentar el tamaño de los marcadores?

Deja una respuesta

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *