Agregar botón Twitter y Me gusta en blog de Blogger

[José Jiménez]

Hola compañeros, hace unos dias acabo de integrar los botones de twitter y facebook (me gusta) para mi blog en blogger, por si algunos no tenian el codigo aqui lo comparto, aclaro que el botón de twitter es el oficial y el el defacebook es megusta con contador, me estuve quebrando un poco la cabeza ya que si se agregan los botones a la pagina principal y haces un tweet o clic en megusta lo que estas compartiendo es solo la portada de tu blog ejemplo Portada - Home | Web Design, SEO, Hosting, Domains, Logos, Xtarting, Xmail.im @ Portada.com, de esta manera nos evitaremos este problema y se compartira el post, en el caso de el boton megusta va a aparecer en el perfil de quien de clic el enlace al post y otro hacia la portada de tu pagina. Dejo aqui los codigos y una preview.

Twitter

<a class='twitter-share-button' data-count='vertical' data-lang='es' expr:href='&quot;http://twitter.com/share?text=&quot; + data:post.title + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;via=tucuenta&amp;related=turecomendacion&quot;'/><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>

Facebook:

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=box_count&amp;show_faces=false&amp;width=73&amp;height=61&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:73px; height:61px'/>

Imagen:

Enlace eliminado

El codigo ya esta ajustado para que salga tal y como se muestra en la imagen, bien alineados, ya solo seria jugar con el estilo de la posicion dependiendo de nuestros gustos. Saludos :biggrin:

Mas abajo figura el codigo para Wordpress:biggrin:

 

[Carlos Arreola]

Muy bueno pues no había visto como ponerlo en blogger.

 

[Franyer Rivas]

execelente aporte gracias nunca he usado blogger como CMS pero podria servir para mis clientes xD
saludos ¡

 

[blogs]

y para ponerlo en wordpress

cual es el codigo que hay que poner y donde ponerno ?

 

[José Jiménez]

y para ponerlo en wordpress

cual es el codigo que hay que poner y donde ponerno ?

Amigo aqui esta para wordpress, son exactamente los mismos.

Twitter

<a href="http://twitter.com/share" class="twitter-share-button" data-url="<?php the_permalink(); ?>" data-count="vertical" data-via="Borest" data-lang="es">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

Faecbook

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink(); ?>&amp;layout=box_count&amp;show_faces=true&amp;width=73&amp;action=like&amp;font=arial&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:73px; height:61px"></iframe>

Saludos!

 

[ulises]

la idea esta genial, sin embargo no se en donde pegar el codigo, jeje. disculpa mi ignorancia, pero en que parte del codigo html debo de pegar el codigo?? gracias por tu ayuda y tambien a todos los colaboradores de foro beta =)

El Psicoasesor
Abriendo los horizontes de la psicologia

 

[Alexander]

Buen aporte y muy interesante Borest, pero en Blogger en que parte de la plantilla lo debo poner.

Saludos.

 

[LizardisFm]

pero en que parte coloco los codes ?

 

[José Jiménez]

pero en que parte coloco los codes ?

Depende en que parte los quieras amigo, debajo del titulo, al final del post, etc. Un saludo.

Buen aporte y muy interesante Borest, pero en Blogger en que parte de la plantilla lo debo poner.

Saludos.

Como ya lo mencione, es donde uno guste, por ejemplo si lo queremos debajo del post habria que pegarlo debajo de este codigo:

    <div class='post-body entry-content'>

Un saludo.

 

[jesus1227]

Me gusta esos botones para CONTADORES y si quiero ubicarlos debajo de cada entrada antes o despues de que codigo debo pegarlo :santaclaus:

 

[bochito]

Para colocarlos en tu blog entra en Diseño > Edición de HTML, marca la casilla Expandir plantillas de artilugios y busca esta etiqueta:

    dijo:

    <b:if cond='data:post.title'>



Y justo debajo de ella pega esto:

    dijo:

    <!-- boton tweetmeme --> <div style='float: right;'> <ul style='list-style:none;'><li> <script type='text/javascript'> tweetmeme_url = '<data:post.url/>'; </script> <script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/></li> <br/> <!-- boton facebook --> <li><script>var fbShare = { url: '<data:post.url/>', }</script> <script src='http://widgets.fbshare.me/files/fbshare.js'/></li></ul> </div>

Asi queda mas o menos:

Leido primero en: Trucos blogger (Actualizados 4/12/10) - Taringa!

 

[José Jiménez]

Para colocarlos en tu blog entra en Diseño > Edición de HTML, marca la casilla Expandir plantillas de artilugios y busca esta etiqueta:

    dijo:

    <b:if cond='data:post.title'>



Y justo debajo de ella pega esto:

    dijo:

    <!-- boton tweetmeme --> <div style='float: right;'> <ul style='list-style:none;'><li> <script type='text/javascript'> tweetmeme_url = '<data:post.url/>'; </script> <script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/></li> <br/> <!-- boton facebook --> <li><script>var fbShare = { url: '<data:post.url/>', }</script> <script src='http://widgets.fbshare.me/files/fbshare.js'/></li></ul> </div>

Asi queda mas o menos:

Leido primero en: Trucos blogger (Actualizados 4/12/10) - Taringa!

Los botones de arriba han tenido ya muchos problemas ya que no son los oficiales, yo recomiendo usar los que menciono para evitar problemas, saludos.

 

[bochito]

Los botones de arriba han tenido ya muchos problemas ya que no son los oficiales, yo recomiendo usar los que menciono para evitar problemas, saludos.

Es decir entonces, que cada vez que cree una entrada, debo colocar el codio en ella, en la edicion html de la entrada? y no a la plantialla de mi blog?

Edit:

Despues de meterle mano a la plantilla de mi blog y de dejarla inservible, decidi restaurarla y me he topado con que la plantilla ya trae ahora por default el boton de twitter entre otros

 

[MarketingOnlineValencia]

Si no quereis complicaros la vida con este tema acudid a AddThis - The #1 Bookmarking & Sharing Service tienes varias opciones de poner este tipo de botones, una de lleva el boton con contador de Twitter y Facebook y ademas uno con el total de marcadores, agregadores y redes sociales que se le han dado de alta, hay mas de 300 tipos

 

[elNettO]

no encontre esta linea :/

    <div class='post-body entry-content'>

 

[Alexander]

Depende en que parte los quieras amigo, debajo del titulo, al final del post, etc. Un saludo.



Como ya lo mencione, es donde uno guste, por ejemplo si lo queremos debajo del post habria que pegarlo debajo de este codigo:

    <div class='post-body entry-content'>

Un saludo.

Gracias Borest, ya los coloque y quedaron bien.

Se agredece mucho el aporte.

no encontre esta linea :/

    <div class='post-body entry-content'>

Debes Expandir plantillas de artilugios para buscar esa linea de codigo.

 

[Acertijo]

Estoy intentándolos poner en el típico gadget de tipo HTML/Javascript, pero el de Facebook no me funciona. Lo primero que me di cuenta es de que blogspot me añadía por su cuenta un cierre del iframe extra, así que adapté el código pero sigue fallando. Así es como lo tengo ahora mismo y solo me sale el de twiter:

<iframe allowtransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=box_count&amp;show_faces=false&amp;width=73&amp;height=61&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:73px; height:61px'></iframe>

<a class='twitter-share-button' data-count='vertical' data-lang='es' expr:href='&quot;http://twitter.com/share?text=&quot; + data:post.title + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;via=tucuenta&amp;related=turecomendacion&quot;'/><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></script></a>

¿Alguna idea?

Estoy intentándolos poner en el típico gadget de tipo HTML/Javascript, pero el de Facebook no me funciona. Lo primero que me di cuenta es de que blogspot me añadía por su cuenta un cierre del iframe extra, así que adapté el código pero sigue fallando. Así es como lo tengo ahora mismo y solo me sale el de twiter:

<iframe allowtransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=box_count&amp;show_faces=false&amp;width=73&amp;height=61&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:73px; height:61px'></iframe>

<a rel='nofollow' class='twitter-share-button' data-count='vertical' data-lang='es' expr:href='&quot;http://twitter.com/share?text=&quot; + data:post.title + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;via=tucuenta&amp;related=turecomendacion&quot;'/><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></script></a>

¿Alguna idea?

He estado toqueteando otro rato pero no he conseguido que me funcionen los botones dentro del gadget HTML/Javascript de blogger. La causa principal es que el texto " data😛ost.url" solo se cambia correctamente por la URL si lo colocamos dentro de la plantilla, no como un gadget. En este caso aparece directamente ese texto en el HTML final. ¿Sabeis alguna forma de solucionar esto? ¿Cómo podría hacer referencia al nombre de la url desde el propio gadget?

 

[José Jiménez]

Estoy intentándolos poner en el típico gadget de tipo HTML/Javascript, pero el de Facebook no me funciona. Lo primero que me di cuenta es de que blogspot me añadía por su cuenta un cierre del iframe extra, así que adapté el código pero sigue fallando. Así es como lo tengo ahora mismo y solo me sale el de twiter:

<iframe allowtransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=box_count&amp;show_faces=false&amp;width=73&amp;height=61&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:73px; height:61px'></iframe>

<a rel='nofollow' class='twitter-share-button' data-count='vertical' data-lang='es' expr:href='&quot;http://twitter.com/share?text=&quot; + data:post.title + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;via=tucuenta&amp;related=turecomendacion&quot;'/><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></script></a>

¿Alguna idea?




He estado toqueteando otro rato pero no he conseguido que me funcionen los botones dentro del gadget HTML/Javascript de blogger. La causa principal es que el texto " data😛ost.url" solo se cambia correctamente por la URL si lo colocamos dentro de la plantilla, no como un gadget. En este caso aparece directamente ese texto en el HTML final. ¿Sabeis alguna forma de solucionar esto? ¿Cómo podría hacer referencia al nombre de la url desde el propio gadget?

Si lo pones en un gadget deberas cambiar las url por la de tu blog, o también quieres que se comprat el post pero desde el sidebar? Un saludo.

 

[Acertijo]

Si lo pones en un gadget deberas cambiar las url por la de tu blog, o también quieres que se comprat el post pero desde el sidebar? Un saludo.

Al final llegué a esa conclusión, para usar el ejemplo en el sidebar tenía que poner una dirección fija, por lo que no conseguí meter la del post, si no que solo pude la del blog. Así que al final he dejado los botones de AdThis que tenía, aunque me gustaría poner los tuyos encima por ser más visibles. ¿Hay/sabeis alguna forma de poner la URL del post en un gadget de tipo HTML/Javascrip en el sidebar?

 

[José Jiménez]

Ahora que lo pienso, deberia de ser la misma forma, data.post.url, pero me imagino que solo funcionaría en la entrada individual, talves armes algo viendo esto Condicionales de Blogger | Ciudad Blogger - Trucos y tutoriales para tu blog un saludo!