SpamLoco

  • Noticias
  • Seguridad
  • Arduino
  • Videos
  • Foro

Botón de Retweet en Blogger (Topsy)

Ayer me encontré en el blog de @elquique con un botón muy simpático para hacer RT de los post, él lo agregó con un plugin de WordPress pero yo en Blogger utilicé el siguiente código.

El botón es un servicio ofrecido por Topsy y en su página se pueden encontrar todos los parámetros para configurarlo, el código a utilizar es el siguiente:

<div style=’float: right;’>
<script type=’text/javascript’>
var topsy_nick = ‘tu_usuario_de_twitter‘;
var topsy_style = ‘small’;
var topsy_url = ‘<data:post.url/>’;
var topsy_title = ‘<data:post.title/>’;
var topsy_theme = ‘brick-red’;
</script><script src=’http://cdn.topsy.com/button.js’ type=’text/javascript’/></div>

Simplemente se trata de un script dentro de un div para posicionarlo sobre la derecha de los post. El código lo agregue después de post-footer-line post-footer-line-1 para que quedara en la parte inferior de los post.

Charlando con JMiur descubrí un problema, con este código el script se cargará varias veces en la página principal, según la cantidad de post. Esto no es lo ideal, lo ideal sería tener variables globales dentro del <head> para no repetir los scripts, sin embargo estuve realizando pruebas y no logré hacerlo funcionar.

La solución a esto es aplicar las condicionales de Blogger para ocultar el código en la Home y mostrarlo sólo en las páginas individuales. Es lo que estoy aplicando en estos momentos.

El código final quedaría así, el botón sólo aparece en los post individuales:

<b:if cond=’data:blog.pageType == «item»‘>
<div style=’float: right;’>
<script type=’text/javascript’>
var topsy_nick = ‘tu_usuario_de_twitter‘;
var topsy_style = ‘small’;
var topsy_url = ‘<data:post.url/>’;
var topsy_title = ‘<data:post.title/>’;
var topsy_theme = ‘brick-red’;
</script><script src=’http://cdn.topsy.com/button.js’ type=’text/javascript’/></div>
</b:if>

Hay más colores disponibles y variables, en la página de Topsy podrás encontrar más información. Por ejemplo, si se cambia «small» por «big» se muestra un botón más grande.

Por último mencionar que si deseas agregar otros botones sociales a Blogger, Gem@ tiene un post muy bueno al respecto. Siguiendo sus consejos agregué los botones de Facebook y Twitter que se ven aquí abajo.


1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (¿Te ha servido el artículo?)
Comparte en FacebookComparte en Twitter
Publicado por Alejandro Eguía el 12 abril, 2010
Actualizado el 16 febrero, 2019 Archivado en: Trucos-Blogs


Comentar con Facebook


  1. aliCarreon

    :D cierto hehe
    muchas gracias por la ayuda
    un saludo y que estes muy bien

    Responder
  2. SpamLoco

    Hola aliCarreon, yo si lo veo, en la parte inferior derecha pero sólo cuando entras a los post individuales.

    Eso sucede por las condicionales, las líneas que aparecen de color naranja en el post.

    Responder
  3. aliCarreon

    hey que tal
    yo aun no puedo lograr ponerlo :S
    espero puedan ayudarme mi blog es este

    http://alicarreonnlss.blogspot.com/

    simplemente no puedo hacer que aparezca y pues no se mucho acerca de HTML y no se en donde este mal o me equivoque

    lo tengo asi:

    http://i838.photobucket.com/albums/zz301/aliCarreon/Capturadepantalla2010-06-25alas1454.png

    gracias de antemano por su ayuda y su tiempo :)

    Responder
  4. Oloman

    Este me gusta más que el de Tweetmeme, porque aquel presenta para IE un fondo blanco en el botón inevitable. Bueno, sí es evitable ¡no usando IE! :)

    Responder
  5. NO IDENTIDAD

    ¡Ok! ¡Muchas gracias! ¡Estamos en contacto!
    ¡Buena página amigo! Ya sabré donde puedo recurrir!
    ¡Éxito!
    ¡Saludos desde México!

    Responder
  6. SpamLoco

    Hola, estuve viendo el código de tu blog y parece que ese no es el problema, no noté nada extraño.

    Pero parece que falla cuando el botón se muestra en la página principal del sitio, en los post individuales lo veo bien, es decir, no muestra 4 twitts siempre.

    Yo lo cambiaría para mostrarlo sólo en los post individuales del blog, para eso hay que usar el segundo código publicado aquí. Se usan las condicionales, para saber cuando se está en un post o no. Así que simplemente deberías agregar las siguientes líneas:

    <b:if cond='data:blog.pageType == "item"'>

    …Codigo Topsy…

    </b:if>

    Responder
  7. NO IDENTIDAD

    ¡Hey! ¡Hola! Leí el tuturial y me sirvió bastante, sin embargo hay una parte del código que quiero modificar pero simplemente no puedo. La verdad se muy poco de html. Me guío en los ejemplos que encuentro en la red

    Lo que busco con el botón Topsy es que el conteó sea llevado por cada post, no de manera global (todos los post tienen 4 retweets, cuando en realidad cada post ha tenido distinto número de publicaciones en Twitter), ¿Como logro hacerlo de manera individual?

    Además, ¿Se puede cambiar el proveedor de servicio de shorting URL?

    Ya llevo varios días con ello, pero no encuentro soluciones (además que mi nivel html es muy pobre…)

    ¿Podrías ayudarme?

    De antemano, ¡Gracias!

    PD. Te paso el link de mi blog:
    http://rompekraneoz.blogspot.com

    Responder
  8. SpamLoco

    Se puede, pero el código button.js se va a repetir. Si logro hacerlo funcionar como global lo publicaré, yo también quiero que salga en la principal :)

    Responder
  9. Anónimo

    Muy bueno, en la principal no quedarian mal, ojala se pueda.

    Saludos.

    Responder

Responder a Oloman Cancelar respuesta

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

Buscador

Suscripción al blog

Feed

Recibe los nuevos artículos del blog en tu correo suscribiéndote gratis:

Redes Sociales

facebook twitter spamloco-youtube google-plus-spamloco

Sobre SpamLoco

Este es un blog dedicado al mundo de la tecnología, internet y la seguridad informática. No te confundas con el nombre, sólo es un juego de palabras, no tiene nada que ver como el ''spam'' sino todo lo contrario.

Si necesitas ayuda puedes pasar por el Foro o contactarme.

Subir

Copyright © 2006 - 2018 SpamLoco.net | Términos del sitio | Cambiar opciones de privacidad | RSS | Contacto