Tutorial: Adicione botões de redes sociais com contadores ao seu blog

  • Autor Autor nxovoix
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
N

nxovoix

Gamma
Redactor
No recomendado
Hola amigos les traigo estos botones elegantes con contador para sus blogs espero les guste.. son muy faciles de instalar:

solo vamos a donde queremos ponerlos y pegamos esto:

HTML:
<!-- 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>

captura Gracias a anferro:

9PYSuoK.png


y listo! :3 espro les sirva 😀
 
Última edição:
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Leva 30 segundos · você volta a este tópico ao terminar
Tema aprobado y agregado al listado de tutoriales.
 
muy buen aporte tienen este aspecto:
9PYSuoK.png
 
excelente andaba buscando esto.. :encouragement:
 
yo quiero esto pero y como lo coloco?? quisiera que aparezca al final de todas mis entradas.. como puedo configurar?
 
¿Alguien me puede ayudar en decirme donde poner este código si los quiero al final de las entradas? por favor.

- - - Actualizado - - -

Si aún no los has puesto [MENTION=113621]meregistro[/MENTION] va abajo de esta linea:
HTML:
<b:if cond='data:blog.pageType == &quot;item&quot;'>

Asi se verán abajo de cada entrada.
 
si quiero colocarlo en la parte su perior de cada entrada como hago amigo.
 
si quiero colocarlo en la parte su perior de cada entrada como hago amigo.

Hola capo ¿Todavía estas con esto? Mira, si lo querés poner arriba, lo que tenes que hacer es

1- Ir a tu página y clickear (derecho) en la parte que lo quieras agregar. Click en inspeccionar elemento.
2- Revisas la parte del código en la que está lo mencionado y sacas un fragmento importante.
3- Vas a editar plantilla en html y buscas ese codigo, lo pegas por debajo.

Avisame si te funciona. Por las dudas hacelo en un blog de prueba o descarga una copia antes de editar. Saludos
 
Perfecto me funciona de lujo :welcoming::encouragement:
 
Muy bueno!! Gracias :encouragement:
 
se me descuadra la home del blog, la barra lateral derecha se baja. ¿alguien sabe qué hacer?
 
gracias por compartir
 
muy bueno, botones bastante pro
 
muy bonito, pero los scripts hacen mucha carga

<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'/>
 
no me gusta tanto ese aspecto prefiero los otros botoncitos pero buen aporte
 
Alguien sabe como hacerlos mas grandes? es que me aparecen muy pequeños, ojalá me pudieron ayudar.:watermelon:
 
¿Dónde coloco eso? :topsy_turvy:
 
gracias compañero, a seguir adelante! :encouragement:
 
Voltar
Topo