58

Colocar un botón para Tweetmeme

Me solicita Kenneth a través de un correo que explique como incluir un botón para Tweetmeme en el blog.

Tweetmeme es una especie de agregador de noticias de Twitter.
Este servicio rastrea y optiene la información de los tweets que comparten los usuarios de Twitter entre si (RT), en su web podemos ver una portada principal donde aparecen los tweets más destacados.

En Blogger podemos añadir un botón que permita a nuestros usuarios enviar la información a Tweetmeme de las entradas de nuestro blog, cuantos más usuarios envien la entrada, más posibilidad tendrá esta de posicionarse en Tweetmeme.


Vamos a ver como colocar el botón al lado derecho del título de nuestras entradas.

[1] Desde "Edición HTML" en nuestro panel y marcando la opción de "Expandir las plantillas de artilugios" localizamos el código que está en negrita y añadimos el que he resaltado en color rojo:

<b:if cond='data:post.title'>
<div id="tweetmeme" style="float: right;">
<script type="text/javascript">
tweetmeme_url = &#39;<data:post.url/>&#39;;
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
<h3 class='post-title entry-title'>

[2] Usamos vista previa y tendremos que ver nuestro botón a la derecha del título de la entrada:

Botón grande Tweetmeme

[3] Guardamos cambios.

Si en lugar de ese botón, queremos usar el otro modelo disponible de botón (más pequeño), el código (que colocaríamos en el mismo lugar) sería este:

<div id="tweetmeme" style="float: right;">
<script type="text/javascript">
tweetmeme_url = &#39;<data:post.url/>&#39;;tweetmeme_style = 'compact';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
Botón pequeño Tweetmeme


Podemos colocarlo también al final de las entradas, justo antes del comienzo de los comentarios, de esta manera solo será visible cuando entramos a una entrada concreta.
Para hacer esto tendríamos que incluir el código así:

<b:includable id='comments' var='post'>
<script type="text/javascript">
tweetmeme_url = &#39;<data:post.url/>&#39;;
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
<div class='comments' id='comments'>

Entradas Relacionadas:

58 comentarios:


kenneth978

GRACIAS ROSA...me has dejado boquiabierto por la rapidez...no sabia lo tweetmeme, lo habia visto en el codigo e incluso en las pruebas que hacia lo habia borrado creyendo que no era necesario....he colocado el botom pequeño y le he colocado algo de css para alinearlo...ya lo he probado y funciona de maravilla....si le puedes echar una evaluacion para ver que tal...de nuevo Gracias y Saludos...

Anónimo

Kenneth Gracias a ti! A través de los pedidos es como me llegan las ideas para las entradas casi siempre :D
Así es, ahora esos RT de tus entradas serán rastreados por Tweetmeme, aunque por lo que he visto en su web, pasa como en otras de ese tipo...en portada siempre están los mismos :S

Anónimo

Hola, buena entrada, pero noes por eso que estoy aqui, me pasaba para preguntarte una cosa, jajaja.
Mira, este es mi blog, y queria saber como se hace para colorear los elementos de la slide-bar como yo lo hice en el footer, y tambien como hacer para colorear las entradas igual. Espero tus respuestas y muchas gracias!!!

Anónimo

Ascesino96 Tendrías que añadir un background en el main y la sidebar, por ejemplo así (lo que está en negrita es lo que añades):

#main-wrapper {
background: #fff;
width: 500px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
background: #fff;
width: 300px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Pateador

Hola Rosa, yo coloqué ese botón hace un buen tiempo y he ido probando pero a veces o bien tarda en contar los clicks o bien no los cuenta. Lo he probado en varias paginas con el mismo botón y no siempre funciona tan bien. Me han dicho que puede ser porque el twitter tiene un sistema un poco complicado de contar y algunos twiteros tienen la opcion de privado, pero no fue mi caso al testear.

Saludos

Unknown

ROSI fui a mirar a lo de Kenneth!!!
Qué bellos te han quedado los íconos!!!...muy buen detalle!!!...besitos y buena semana :)

Anónimo

Pateador Si, ya lo he notado. El RT aparece en Twutter de forma inmediata, pero tarda en contabilizar el dato en el botón algunas veces :S

Anónimo

Graciela ¡Gracias! Me encantaron en cuanto los vis vi... la pena es que ando buscando algo así para el sobre de email y no encuentro :( a ver si tengo tiempo y me lo "fabrico" aunque sea de forma artesanal ja,ja.

Unknown

vamos Rosa que puedes :)...cuando aprenda ohhh hace falta tiempo!!!...están buenísimos...ando merodeando tu casa!!!

Bocha

Rosa tengo una duda, en mi blog coloque como tienes tu, una foto de fondo en el sector donde figura el nombre del autor de los comentarios. Y el problema es que hay una parte de la foto que se encuentra muy pegada a uno de los bordes, fijate. Yo quiero colocarla mas alejada del borde.

http://modelo-ac.blogspot.com/2009/06/pelota-del-mundial-2010.html#comments

Lss Rutas de Angelica

Siempre hay un minuto para recordar a las personas que son importantes en nuestras vidas y que a pesar de las distancias u ocupaciones están presentes en nuestro corazón... Este minuto te lo dedico a ti. Bendiciones y un abrazo enorme.

Anónimo

Hola Rosa de nuevo yo, pero que bueno esta ese scrip pero yo no uso twinter pero me diste las claves para poder hacer lo que queria Gracias y muy buen post saludos

Yoyorz

A el de arriba soy yo ehh

X Miranda

Rosa!!

Necesito tu ayudaa!!
es urgente :S:S no se que le pasa a un nuevo blog que hize, supongo que es la plantilla
pero

NO DEJA QUE LAS PERSONAS POSTEEN COMENTARIOS!!

:S:S me podrias ayudar? ya trate de arreglarlo en "Configuracion" pero no funciona u.u

por favor ayudame si? contactame

ely.cervantes@hotmail.com
tinta_color@hotmail.com

La direccion del blog es este

http://tintacolor.blogspot.com

por favoor!! :L
Gracias de antemano

Ely Cervantes

Anónimo

Loco21 Yo no tengo una imagen ahí, solo es un color de fondo.

Trata de "jugar" con el padding en:
.comment-author {

No se exactamente que valores tendrías que poner, así que prueba tu mismo a ir cambiando...

Anónimo

Angélica Es bien cierto lo que dices cielo. Ahorita mismo me paso por tu casa...

Anónimo

Ely En el código fuente de tu blog, no noto que haya ningún problema...

En Edición - Entradas del blog - Editar ¿has marcado la opción para permitirlos?

Anónimo

.Alba. Pues supongo que hablas mirando el blog con IExplorer, porque con otros se ve en todas las páginas.

Se están dando ese tipo de problemas con ese gadget y el formulario de comentarios, pero solo en IE.

Unknown

Se los había visto a los chicos de Blogsconeñe pero no sabía como se ponía :D muchas gracias! :D

besotes ronroneados ^_^

Administrador

muy bueno gracias asi quedo el mio se ve genial

http://detodoparatuvida.blogspot.com/

Grieguis

siempre encuentro en este blog todo lo que necesito y con simpleza, asi puedo llevar a cabo los cambios que necesito y que no logro comprender en otros sitios
GRaciasssssssssssssssssssssssssssssss

C
Este comentario ha sido eliminado por el autor.
Anónimo

Chaantii No, es un servicio externo que proporcina la web y que no podemos controlar.

C
Este comentario ha sido eliminado por el autor.
C
Este comentario ha sido eliminado por el autor.
Anónimo

Chaantii Te referías en el código... lo siento, yo entendí que tu nick de Twitter saliera en el botón, en la imagen, no al direccionar a tweetmeme, ja,ja.

C
Este comentario ha sido eliminado por el autor.
Miguel Monar

Rosita ¿como se le cambia el color al cuadrito??

Anónimo

Miguel El código para eso no lo controla el usuario.

Noa

Hola guapa, lo he puesto, pero me queda muy pegado al texto, como muy bajo... No se, a ver si puedes verlo y opinas.
Un beso!

Anónimo

Noa Si te parece, prueba a subirlo algo más arriba, moviendo el código del botón en la plantilla y usando vista previa...

karlozlfc

Rosa, he colocado un link tuyo en mi blog, puedes poner uno mío en el tuyo a manera recíproca? Saludos!

www.DineroIdeas.blogspot.com

Anónimo

karlozlfc No hago intercambio de enlaces.

Anónimo

Explicas todo genial!!! Siempre me sale a la primera mil gracias Rosa!!!
:) Reina

Brandy

Te agradezco los consejos, porque me vienen genial!!!
Muchisimas gracias :)

Viviana

si, me molesta que diga @teewtmeme en vez de @mamasybebes

peor es nada!

Monica

Rosita: me ha surgido una duda con este botón, al principio funcionaba lo mas bien, pero ase poco a algunas de mis entradas se le a ido el color verde del botón, antes cuando pinchaba sobre el me llevaba atwiteer y podía subir lo que había publicado, ahora en los botones que se les fue el color verde no me lleva a ningún enlace, perdón Rosy espero que me aya esplicado bien,a ver si me ayudas a entender que sucede Besotes Rosyta AAAAAAAAAAAA mi blog cumplió su 1º añito me gustaría porfiiiii que pases, allí esta mi agradesimiento por tannnnta ayuda.... :O

Anónimo

Monica Pues no se que decirte a eso... supongo que será fallo del mismo servicio, ni idea :S
Si que me he pasado por el blog y no veo ningún botón sin color :o además parecen funcionar bien...

Monica

Gracias Rosy!!!!!!!! no sabes la sorpresa REREREagradable que me lleve al entrar a mi blog, saber que la profe me había pasado a visitar, me encanto y lo del botón ,si tu dises que ves todo perfecto, palabra de esperta, no se discute, Besotes Rosy hasta yaaaaa

Nike

Muchas gracias, me salió todo bien. Un beso.

Daniel Barrientos

Hola Rosa, estoy teniendo problema con mi blog desde hace tiempo y no puedo solucionarlo.

Este es mi blog:

http://elcomunicadordigital.blogspot.com/

El problema es el siguiente:

Cuando clickeo en el título de una entrada, en la URL individual no me aparece el post entero (es decir el texto), solamente el título y los comentarios.

Aquí está un ejemplo:

http://elcomunicadordigital.blogspot.com/2009/12/un-saludo-para-mi-viejo-amigo-el-subte.html

Qué podrá ser? Tendré que hacer algún cambio en el HTML seguro, no?

Bueno, eso es todo Rosa, espero puedas ayudarme, aunque sé que estás con muchos mails...

Muchas Gracias

Un beso

Anónimo

Daniel Barrientos No puedo ver todo lo que necesito a través de tu código fuente... pero veo código ahí añadido o para un leer más o para expandir/contraer las entradas y eso o está incompleto o está mal colocado... tienes que revisar eso...

Daniel Barrientos

Hola Rosa, no logro darme cuenta del error.. Si me podés ayudar te agradeceré. Te envié por mail un archivo con mi codigo HTML con los artilugios expandidos a ver si podés ver la falla.
Muchas Gracias

Rosa

Daniel Barrientos Email enviado... creo que con la solución, o eso espero...

Pazosca

deveras que tu blog me a ayudado un monton.

Cocina

Rosa solo con tus explicacion me animo a meter mano en mi plantilla,me ha quedado genial gracias!!

Vinicius Chargel

És muy bueno, jo voy usar en mi blog. Gracias! :D

Jhony

:) Funciono Perfecto, muchas gracias

Aliahnne

Muchísimas Gracias!

Me funciono perfectamente! ;)

Jorge Sanz

Hola Rosa,

He descubierto tu blog esta mañana y me ha sido de muchísima ayuda. Sin embargo, me gustaría cambiar una cosilla y no se muy bien cómo. He incluido el Tweetmeme tal y como describías, pero me gustaría que apareciera únicamente en la página de inicio. Tengo una página de contacto, y otra sobre mí, en las que me gustaría que no apareciera la opción citada. ¿Podrías por favor ayudarme?

Te agradezco de antemano tu tiempo y dedicación.
Saludos y enhorabuena de nuevo.

Jorge.-
www.hoopsandrhymes.com

Anónimo

Jorge Sanz En "contacto" y "sobre mi" supongo las entradas no tienen habilitada la posibilidad de dejar comentarios, lo digo porque si es así, lo más sencillo entonces es meter el código del botón entre:
<b:if cond='data:post.allowComments'>
Aqui el código
</b:if>

Esto lo que hará es que el botón no se vea en las entradas en las que no has habilitado los comentarios.

rolo ridder

Hola Rosa!
Te cuento que antes había probado con el gadget que te genera el Template Editing de TweetMeme, pèro debido a la estructura de los posts me descalabraba todo y no había forma de alinear el botón. Luego probé con el código que posteaste y bien... ahora me cortaba los titulos de los post y los videos. Lo único que pude hacer fue volver a TweetMeme y desde allí meter el gadget al final de las entradas- en ese sitio no descalabra nada.. Gracias por compartir tus conocimientos y brindar tanta ayuda!! Un beso Rolo

Anónimo

rolocine ¡Bien! A veces solo es cuestión de armarse de paciencia para dar con la opción adecuada. :D

Anónimo

CreatiBea Ni idea :O en estos casos yo me limito a informar como y donde colocar el código... el control del mismo ya no es cosa nuestra, sino del servicio que lo proporciona...

Unknown

Buenas que tal?

Tengo un curioso problema con el boton de Twittear, que tambien me ocurria con el de tweetmeme cuando pase a una plantilla del diseñador de plantillas, no se si tendra algo que ver, bueno te comento:

Si entras en el blog marketingonlinevalencia.org veras como todas las entradas marcan 1 RT, por el contrario si le das a la segunda pagina en el menu de paginacion todas salen con 0 RT, solo salen los RT correctos cuando entras en el post

¿Sabrias por que puede ser?

Por otra parte me gustaria tener el gadget integrado en el texto como he visto en algun blog y solo puedo puedo ponerlo arriba o abajo.

Bueno eso es todo, gracias por anticipado y felicidades por el blog, Excelente

Anónimo

Marketing Online Valencia Este tipo de códigos están casi todos preparados para leer solo en la página de cada entrada... es decir, solo si se pincha en ellos desde ahí envían el post.

Para colocarlo integrado con el texto, tendrías que colocar su código tal como indico aquí, pero en un lugar más abajo del sitio que indico.

Elizabeth G.

El mio NO FUNCIONAAAAAAAA!!
http://elamoreslafuerzamaspoderosa.blogspot.com/
Ese es el URL de mi Blog, si podrias ver porque puede ser, por favor, una amiga lo tiene, de hechomuchas de ellas, pero no el mío no funciona :((

Besitos

Elizabeth G.

@Miss Darcy
Lo he eliminado. Besitos ♥

Publicar un comentario

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S