Redes sociales (Social Bookmarking) en Blogger

Mayo 14th, 2007 | Publicado por Francisco en Blogger | 49 Comentarios

Me preguntan como poner el icono de redes sociales o social bookmarking en cada uno de nuestros post, de modo que sí alguno de nuestros usuarios utiliza uno de ellos, tenga el link para agregarlo a sus favoritos de forma rápida.

No hay necesidad de tener suscrito el blog a ninguno de estos servicios, más bien, los enlaces son precisamente para que el usuario lo suscriba y tenga a la mano tu link sí lo considera de utilidad.

Ahora vamos a ver como ponerlos:

Entra a la pestaña “Plantilla” o también llamada “Diseño” desde el escritorio y después a la opción “Edición de HTML” donde activamos la casilla “Expandir plantillas de artilugios”.

Buscamos el siguiente código:

   <p class='post-footer-line post-footer-line-3'/>

Sustituye esa linea con el siguiente código:

<p class='post-footer-line post-footer-line-3'>

<div class='rsociales'>
Agregar a marcadores favoritos:
<ul>
<li><a expr:href='"http://www.technorati.com/faves?add=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Technorati' class='rsociales-sobre' src='http://bp1.blogger.com/_Zuzii37VUO4/Rjl62eMBQ0I/AAAAAAAAAto/zkas68GmVFk/s1600/technorati.gif'/></a></li>
<li><a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Del.icio.us' class='rsociales-sobre' src='http://bp3.blogger.com/_Zuzii37VUO4/Rjl68-MBQ1I/AAAAAAAAAtw/Mftx1_Bi_oY/s1600/delicious.gif'/></a></li>
<li><a expr:href='"http://digg.com/submit?phase=2&amp;amp;url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a DiggIt!' class='rsociales-sobre' src='http://bp2.blogger.com/_Zuzii37VUO4/RjlY7uMBQrI/AAAAAAAAAsg/ov73dLSsrtA/s1600/digg.png'/></a></li>
<li><a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Yahoo!' class='rsociales-sobre' src='http://bp1.blogger.com/_Zuzii37VUO4/RjlZLeMBQtI/AAAAAAAAAsw/bNmkgSj_jj0/s1600/yahoo.png'/></a></li>
<li><a expr:href='"http://www.google.com/bookmarks/mark?op=edit&amp;output=popup&amp;bkmk=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Google' class='rsociales-sobre' src='http://bp3.blogger.com/_Zuzii37VUO4/Rjl6z-MBQzI/AAAAAAAAAtg/-13NieAS3J8/s1600/google.gif'/></a></li>
<li><a expr:href='"http://meneame.net/submit.php?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Meneame' class='rsociales-sobre' src='http://bp3.blogger.com/_Zuzii37VUO4/Rjlct-MBQyI/AAAAAAAAAtY/UtGxUlBA7mc/s1600/meneame.png'/></a></li>
<li><a expr:href='"http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Furl' class='rsociales-sobre' src='http://bp3.blogger.com/_Zuzii37VUO4/Rjlaa-MBQuI/AAAAAAAAAs4/7hoQkbJNkUw/s1600/furl.png'/></a></li>
<li><a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Reddit' class='rsociales-sobre' src='http://bp2.blogger.com/_Zuzii37VUO4/RjlbHuMBQvI/AAAAAAAAAtA/L0TsC3OUUyI/s1600/reddit.gif '/></a></li>
<li><a expr:href='"http://ma.gnolia.com/beta/bookmarklet/add?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Magnolia' class='rsociales-sobre' src='http://bp2.blogger.com/_Zuzii37VUO4/RjlbWuMBQwI/AAAAAAAAAtI/Vy_xjt3iY80/s1600/magnolia.gif'/></a></li>
<li><a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;Description=&amp;Url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Blinklist' class='rsociales-sobre' src='http://bp2.blogger.com/_Zuzii37VUO4/RjlbjuMBQxI/AAAAAAAAAtQ/WDlHSsaO_m4/s1600/blinklists.gif'/></a></li>
<li><a expr:href='"http://blogmarks.net/my/new.php?mini=1&amp;simple=1&amp;url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Blogmarks' class='rsociales-sobre' src='http://bp0.blogger.com/_Zuzii37VUO4/RjlQzOMBQoI/AAAAAAAAAsI/qt5x09fQvNo/s1600/blogmarks.gif'/></a></li>
</ul>
</div>

</p>

Estas son, a mi parecer, las redes sociales más populares.

Ahora busca el código:

]]></b:skin>

Y justo arriba pega lo siguiente:

.rsociales ul {
display:inline;
margin:0pt !important;
padding:0pt !important;
}
.rsociales li {
background:transparent none repeat scroll 0%;
display:inline;
list-style-type:none;
margin:0pt;
padding:2px;
}
.rsociales img {
border:0pt none;
float:none;
margin:0pt;
padding:0pt;
}
.rsociales-sobre {
opacity:0.4;
}
.rsociales-sobre:hover {
opacity:1;
}

Estos son los estilos aplicados a los iconos de cada servicio, puedes modificarlos a como mejor se adapte a tu blog. Los últimos dos estilos dan un efecto de transparencia que funciona bien firefox, opera, safari e IE7.

Ahora gurdamos y listo.

Respuestas

Feed | Dirección de Trackback

blastto:

Mayo 15th, 2007 a las 4:37 pm (#)

Gracias por el tutorial, buscaba justamente esto

saludos!
Francisco:

Mayo 15th, 2007 a las 10:53 pm (#)

Que bueno, ojala que te sirva!

Saludos!!
Ignacio Pan:

Mayo 16th, 2007 a las 4:17 am (#)

Es lo que venia esperando hace tiempo y funciono de maravilla!!!
Mil gracias
Rober:

Mayo 25th, 2007 a las 11:29 am (#)

No encuentro este esos códigos en mi plantilla. Estoy utilizando TIC TAC BLUE.
De todas formas, muchas gracias ya que he encontrado cantidad de ayuda en esta página
Rober:

Mayo 25th, 2007 a las 12:06 pm (#)

ya lo tengo, perfecto.

MIL GRACIAS
cartografia:

Mayo 29th, 2007 a las 3:37 pm (#)

funciona, gracias
Laura:

Junio 1st, 2007 a las 2:59 am (#)

Hola hola!!
Me gustaría alinear las redes sociales a la derecha de mi blog… me podrías ayudar?

Te agradezco
Francisco:

Junio 1st, 2007 a las 6:23 am (#)

Hola Laura!

Al código del paso 4 agrega:

.rsociales ul {
text-align:right;
}

Saludos!
Laura:

Junio 3rd, 2007 a las 4:22 am (#)

Gracias. Becho :-X
Pizca:

Junio 6th, 2007 a las 8:55 pm (#)

Ya lo hice y todo bien ….excepto que mi blog es negro y el fondo de los íconos es blanco asi que se ve un poco mal, los dejaré como están por si quieres verlos.

pero espero que puedas ayudarme o decirme sinceramente que no se puede hacer nada

gracias
Kay:

Agosto 3rd, 2007 a las 7:22 pm (#)

Hola!

Me salen los iconos, pero me queda horrible porque me salen en vertical y no queda nada bien ¿Hay alguna forma de ponerlos en horizontal?

Gracias
Francisco:

Agosto 4th, 2007 a las 2:11 am (#)

Hola!

Pizca, es posible, pero tendrías que eliminar el fondo con photoshop o buscar en la web otros que no lo tengan.

Kay, verifica si has hecho bien el paso 4, pues es el código que se encarga de que los iconos se visualicen correctamente.

Un abrazo!
esteNo:

Agosto 11th, 2007 a las 8:28 pm (#)

no consigo que se vean con estilo transparente,puse todo tal cual como explicas,tengo que editar algun valor?

(escribi algo en otra plantilla por si me puedes ayudar tambien en eso )
santi_monse:

Agosto 11th, 2007 a las 8:57 pm (#)

A mí me gustaría ponerlo debajo de “posteado por.. comentarios..”. ¿Me podrías ayudar con la edición del HTML?

Si no tenés tiempo, no te preocupes, ya demasiado me has ayudado.

¡Saludos!
santi_monse:

Agosto 11th, 2007 a las 8:57 pm (#)

¿O los códigos que pusiste son justamente para ponerlos ahí?
Francisco:

Agosto 12th, 2007 a las 8:22 pm (#)

Hola!

esteNo, como se indica arriba, la transparencia solo es visible en firefox o en IE7 (menores del 7 no puede mostrar transparencias).

santi_monse, esta para aparecer así
santi_monse:

Agosto 13th, 2007 a las 3:14 pm (#)

Perfecto, ¡¡muchas gracias!!
santi_monse:

Agosto 13th, 2007 a las 3:40 pm (#)

¿Se puede mostrar al abrir una entrada, pero no en la página principal? Por ahora dejé el código instalado pero con “display:none”, porque me pareció que quedaba molesto que sea de dos líneas el “post-footer”.

¡Saludos!
Moises:

Agosto 15th, 2007 a las 3:00 pm (#)

Francisco puedes ayudarme xfa yo tengo la platilla Blogy Curved y cuando agrego el código se ve mal nose si podrias ayudarme lo que pasa es que los iconos nuevos que aparecen se ponen encima del titulo de la notica anterior y cuando es la ultima notica de la pagina se me cruza con el boton “Entradas anteriores, recientes, pagina princpal”
santi_monse:

Agosto 16th, 2007 a las 3:48 pm (#)

Otra página que tiene la misma función es:

http://www.addthis.com/

(todavía no la probé, pero parece buena)

¡Saludos!
Francisco:

Agosto 17th, 2007 a las 10:43 pm (#)

Holaa!

santi, se puede hacer con el uso de condicionales, mira al final de esta página de ayuda de blogger. Y la propuesta que mencionas es equivalente, decide entre las que más te agrede

Moises, prueba colocando en otra linea, por ejemplo, en el paso dos, en lugar de la linea post-footer-line-3, intenta con la 2 o la 1.
Moises:

Agosto 18th, 2007 a las 9:16 am (#)

Me saliooooo lo reemplza por y ahora todo se ve normal sos grande Francisco eres el mejorrrrrrrrrrr graciassss, los demas blgo son fuchi comparados con el tuyo =P
Íñigo:

Agosto 20th, 2007 a las 9:29 am (#)

Hola, me preguntaba si sabías los códigos para hacer esto mismo pero en Wordpress. Gracias de antemano.
Francisco:

Agosto 25th, 2007 a las 12:58 am (#)

Que bueno te resulto Moises

iñigo, el código varia, pero en wordpress hay muchos plugins que te ayudan en esto, puedes ver el artículo “50 plugins para la administración de Wordpress” donde encontraras varias opciones.
Diego:

Agosto 31st, 2007 a las 9:56 pm (#)

hola!!
antes que nada te felicito por tu blog!! ha sido una gran ayuda para los que como yo recién comenzamos en esto. mi pregunta es la siguiente: he usado la plantilla .xml “Blogy-Minyx” en http://www.eliseo-salazar.blogspot.com, pero no encuentro los códigos de referencia q das; pero vi el archivo .txt de la misma plantilla y sí los tiene, cómo puedo hacer para poner los íconos de las redes sociales (u otras modificaciones) sin tener que cambiar toda la plantilla de .xml a .txt??? muchos saludos!!
Diego:

Agosto 31st, 2007 a las 10:12 pm (#)

OOOOOHHH!!!!
lo siento, había que activar el casillero expandir artilugios (ahora me creen que soy nuevo en esto??) mil disculpas, saludos!!
Fede:

Septiembre 9th, 2007 a las 10:35 am (#)

Gracias, muchas gracias.
Nu:

Septiembre 22nd, 2007 a las 7:28 am (#)

Hola Francisco, ante todo decirte muy buena página!! felicitarte por ello!

Bueno, tengo un problemilla, he hecho todo lo que has puesto, copiado el código, y puesto en mi blog, pero me da este error:

No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The element type “HEAD” must be terminated by the matching end-tag “”.

Te juro que el head esta cerrado, (a no ser que sea otra cosa) pero bueno, así que… no sé que ha podido pasar.Gracias por adelantado
Francisco:

Septiembre 22nd, 2007 a las 1:18 pm (#)

Hola Nu, gracias por tus comentarios, bueno, es raro lo que te pasa pues no se toda el header, pero tal vez hallas cometido un error al pegar los estilos, deben ir antes de ]]>.

Un saludo!
Mía:

Octubre 1st, 2007 a las 4:11 pm (#)

He utilizado tu tutorial para obtener algún codigo de llegada. Muchas gracias.
Te quiero comentar que en mi caso, no me resultó necesario realizar todos los pasos que señalas y me funciona perfectamente. No sé si será porque yo trabajo directamente con el editor de Blogger, pero he utilizado un camino mas simple. Te lo paso por si le sirve a alguien:

Para poner un botón en las entradas (posts) de tu blog en Blogger, ir a Plantilla –> Edición de HTML –> marcar en Expandir plantillas de Artilugios –> localizar el siguiente código en la plantilla de tu blog:

–> INSERTAR ACÁ EL CÓDIGO

o por ejemplo después de este otro código (depende de dónde quieras que aparezcan los botones):

,

–> INSERTAR ACÁ EL CÓDIGO

————————————-
El código a insertar es el siguiente:

Bueno, eso es todo. A mí me funciona perfecto.
Para comprobarlo, mi blog es
Eva:

Octubre 16th, 2007 a las 7:04 pm (#)

Muchísimas gracias por ***toda*** tu ayuda.
Cono novata (empecé hace menos de 10 días) tengo una duda: me funciona perfectamente tu código para las redes sociales. Tengo otros iconos que me gustaría poner, pero no se como. Me explico el href tiene una dirección concreta de cada icono. ¿cómo hago para poner los que yo tengo? Otra vez, muchas gracias por todo. Saludos
Francisco:

Octubre 17th, 2007 a las 12:53 am (#)

Hola Eva,

No es nada, que bueno inicias en esto. Respondiendo a tu pregunta, puedes seguir la misma estructura:

<li><a expr:href='direccion del enlace' target='_blank'><img class='rsociales-sobre' src='dirección-de-tu-icono.gif'/></a></li>
Ángel Puente:

Octubre 21st, 2007 a las 3:44 am (#)

Muy buen tutorial.

Sólo que quiero añadir el Mister Wong y no lo consigo.
Por fa…
¡¡¡Quedaría completo!!!

Muchas gracias.

Ángel
Ricard Bou:

Noviembre 5th, 2007 a las 8:54 pm (#)

ESPECTACULAR ! GENIAL !

Muchas gracias !!
Javier:

Noviembre 16th, 2007 a las 3:56 pm (#)

gracias, esto si me funciono, pero el sharethis no, mil gracias otra vez
Aleix:

Noviembre 18th, 2007 a las 7:03 pm (#)

Gracias por la detallada explicación. Me has resuelto una gran duda y funciona!
rolocine:

Diciembre 17th, 2007 a las 10:15 pm (#)

Muchísimas gracias Francisco. Muy simple y efectivo!
eddie:

Enero 1st, 2008 a las 6:14 pm (#)

Exactamente andaba en busca de este tip

Gracias por la información, ya lo estoy ocupando en mi blog
vromo:

Enero 22nd, 2008 a las 9:46 pm (#)

Gracias…..por el tutorial,
Rafael Monge:

Marzo 21st, 2008 a las 2:44 am (#)

He intentado varias veces y no lo consigo.

en lugar del

He probado de muchas maneras y no me guarda los cambios en la plantilla porque me da error.

Quedo pendiente, un saludo.
Rafael Monge:

Marzo 21st, 2008 a las 1:56 pm (#)

He quitado los delimitadres en este comment porque en el anteriro no los agarro. Te deica, en lugar de esto:

p class=’post-footer-line post-footer-line-3′

en mi plantilla sale esto:

div class=’post-footer-line post-footer-line-3′

y no consigo hacer calar el codigo para que aparezcan.

Saludos
valenciayche:

Abril 30th, 2008 a las 8:15 am (#)

Gracias por el tutorial, llevaba tiempo buscandolo.
Mira que guapo ha quedado en mi blog
Valencia y che
valenciayche.blogspot.com
julian:

Mayo 18th, 2008 a las 5:59 pm (#)

Hola, mi consulta es porque tengo wordpress y no se realmente como hacer para que me aparezcan los iconos de las redes sociales debajo de cada post, ya que no me deja cambiar intriducir cambios en la plantilla.

Bueno espero alguna respuesta pronto.
Un abrazo.
Julian.
alejandro:

Julio 23rd, 2008 a las 7:46 pm (#)

gracias por la ayuda una pregunta sabes como puedo poner una barra de comentarios así como esta? saludos
Reyna:

Julio 31st, 2008 a las 7:36 pm (#)

Gracias por este tema, muy útil… nada más que el listado me sale vertical, ya repeti los pasos 3 veces, además de quitarle unos cuantos li, para ver si dependia del ancho… pero sigue igual vertical.
Graxias!!!
Wendy Pepper:

Agosto 14th, 2008 a las 1:28 pm (#)

Muy interesante. He usado este codigo con éxito. Saqué la mayoria de los marcadores y agregue otro.

Muy buena entrada la presente

Saludos
juan:

Agosto 15th, 2008 a las 8:03 pm (#)

gracias
JOtaCT:

Septiembre 22nd, 2008 a las 4:01 pm (#)

no encuentro el codigo , por ningun lado, ni con el famoso Ctrl+f, no se si depende que mi plantilla no es predeterminada, porque mi plantilla la baje de http://www.btemplates.com, si me pudieras ayudar seria muy amable de tu parte.
JOtaCT:

Septiembre 22nd, 2008 a las 4:25 pm (#)

lo unico que encontre es esto
y despues esto

Copyright © 2008 <a expr:href=’data:blog.homepageUrl’

pero el codigo que tu das nada de nada. habra solucion?

Deja tu comentario

¡Gracias por dejar tu opinión! Por favor procura que tus comentarios no estén fuera tema, no sean promocionales (spam), ilegales u ofensivos, de otro modo, serán eliminados. Recuerda que puedes usar nuestro foro para otros temas y preguntas.

blastto:

Mayo 15th, 2007 a las 4:37 pm (#)

Gracias por el tutorial, buscaba justamente esto

saludos!

Francisco:

Mayo 15th, 2007 a las 10:53 pm (#)

Que bueno, ojala que te sirva!

Saludos!!

Ignacio Pan:

Mayo 16th, 2007 a las 4:17 am (#)

Es lo que venia esperando hace tiempo y funciono de maravilla!!!
Mil gracias

Rober:

Mayo 25th, 2007 a las 11:29 am (#)

No encuentro este esos códigos en mi plantilla. Estoy utilizando TIC TAC BLUE.
De todas formas, muchas gracias ya que he encontrado cantidad de ayuda en esta página

Mayo 25th, 2007 a las 12:06 pm (#)

ya lo tengo, perfecto.

MIL GRACIAS

cartografia:

Mayo 29th, 2007 a las 3:37 pm (#)

funciona, gracias

Laura:

Junio 1st, 2007 a las 2:59 am (#)

Hola hola!!
Me gustaría alinear las redes sociales a la derecha de mi blog… me podrías ayudar?

Te agradezco

Junio 1st, 2007 a las 6:23 am (#)

Hola Laura!

Al código del paso 4 agrega:

.rsociales ul {
text-align:right;
}

Saludos!

Junio 3rd, 2007 a las 4:22 am (#)

Gracias. Becho :-X

Pizca:

Junio 6th, 2007 a las 8:55 pm (#)

Ya lo hice y todo bien ….excepto que mi blog es negro y el fondo de los íconos es blanco asi que se ve un poco mal, los dejaré como están por si quieres verlos.

pero espero que puedas ayudarme o decirme sinceramente que no se puede hacer nada

gracias

Kay:

Agosto 3rd, 2007 a las 7:22 pm (#)

Hola!

Me salen los iconos, pero me queda horrible porque me salen en vertical y no queda nada bien ¿Hay alguna forma de ponerlos en horizontal?

Gracias

Agosto 4th, 2007 a las 2:11 am (#)

Pizca, es posible, pero tendrías que eliminar el fondo con photoshop o buscar en la web otros que no lo tengan.

Kay, verifica si has hecho bien el paso 4, pues es el código que se encarga de que los iconos se visualicen correctamente.

Un abrazo!

esteNo:

Agosto 11th, 2007 a las 8:28 pm (#)

no consigo que se vean con estilo transparente,puse todo tal cual como explicas,tengo que editar algun valor?

(escribi algo en otra plantilla por si me puedes ayudar tambien en eso )

santi_monse:

Agosto 11th, 2007 a las 8:57 pm (#)

A mí me gustaría ponerlo debajo de “posteado por.. comentarios..”. ¿Me podrías ayudar con la edición del HTML?

Si no tenés tiempo, no te preocupes, ya demasiado me has ayudado.

¡Saludos!

¿O los códigos que pusiste son justamente para ponerlos ahí?

Agosto 12th, 2007 a las 8:22 pm (#)

esteNo, como se indica arriba, la transparencia solo es visible en firefox o en IE7 (menores del 7 no puede mostrar transparencias).

santi_monse, esta para aparecer así

Agosto 13th, 2007 a las 3:14 pm (#)

Perfecto, ¡¡muchas gracias!!

Agosto 13th, 2007 a las 3:40 pm (#)

¿Se puede mostrar al abrir una entrada, pero no en la página principal? Por ahora dejé el código instalado pero con “display:none”, porque me pareció que quedaba molesto que sea de dos líneas el “post-footer”.

Moises:

Agosto 15th, 2007 a las 3:00 pm (#)

Francisco puedes ayudarme xfa yo tengo la platilla Blogy Curved y cuando agrego el código se ve mal nose si podrias ayudarme lo que pasa es que los iconos nuevos que aparecen se ponen encima del titulo de la notica anterior y cuando es la ultima notica de la pagina se me cruza con el boton “Entradas anteriores, recientes, pagina princpal”

Agosto 16th, 2007 a las 3:48 pm (#)

Otra página que tiene la misma función es:

http://www.addthis.com/

(todavía no la probé, pero parece buena)

Agosto 17th, 2007 a las 10:43 pm (#)

Holaa!

santi, se puede hacer con el uso de condicionales, mira al final de esta página de ayuda de blogger. Y la propuesta que mencionas es equivalente, decide entre las que más te agrede

Moises, prueba colocando en otra linea, por ejemplo, en el paso dos, en lugar de la linea post-footer-line-3, intenta con la 2 o la 1.

Agosto 18th, 2007 a las 9:16 am (#)

Me saliooooo lo reemplza por y ahora todo se ve normal sos grande Francisco eres el mejorrrrrrrrrrr graciassss, los demas blgo son fuchi comparados con el tuyo =P

Íñigo:

Agosto 20th, 2007 a las 9:29 am (#)

Hola, me preguntaba si sabías los códigos para hacer esto mismo pero en Wordpress. Gracias de antemano.

Agosto 25th, 2007 a las 12:58 am (#)

Que bueno te resulto Moises

iñigo, el código varia, pero en wordpress hay muchos plugins que te ayudan en esto, puedes ver el artículo “50 plugins para la administración de Wordpress” donde encontraras varias opciones.

Diego:

Agosto 31st, 2007 a las 9:56 pm (#)

hola!!
antes que nada te felicito por tu blog!! ha sido una gran ayuda para los que como yo recién comenzamos en esto. mi pregunta es la siguiente: he usado la plantilla .xml “Blogy-Minyx” en http://www.eliseo-salazar.blogspot.com, pero no encuentro los códigos de referencia q das; pero vi el archivo .txt de la misma plantilla y sí los tiene, cómo puedo hacer para poner los íconos de las redes sociales (u otras modificaciones) sin tener que cambiar toda la plantilla de .xml a .txt??? muchos saludos!!

Agosto 31st, 2007 a las 10:12 pm (#)

OOOOOHHH!!!!
lo siento, había que activar el casillero expandir artilugios (ahora me creen que soy nuevo en esto??) mil disculpas, saludos!!

Fede:

Septiembre 9th, 2007 a las 10:35 am (#)

Gracias, muchas gracias.

Nu:

Septiembre 22nd, 2007 a las 7:28 am (#)

Hola Francisco, ante todo decirte muy buena página!! felicitarte por ello!

Bueno, tengo un problemilla, he hecho todo lo que has puesto, copiado el código, y puesto en mi blog, pero me da este error:

No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The element type “HEAD” must be terminated by the matching end-tag “”.

Te juro que el head esta cerrado, (a no ser que sea otra cosa) pero bueno, así que… no sé que ha podido pasar.Gracias por adelantado

Septiembre 22nd, 2007 a las 1:18 pm (#)

Hola Nu, gracias por tus comentarios, bueno, es raro lo que te pasa pues no se toda el header, pero tal vez hallas cometido un error al pegar los estilos, deben ir antes de ]]>.

Un saludo!

Mía:

Octubre 1st, 2007 a las 4:11 pm (#)

He utilizado tu tutorial para obtener algún codigo de llegada. Muchas gracias.
Te quiero comentar que en mi caso, no me resultó necesario realizar todos los pasos que señalas y me funciona perfectamente. No sé si será porque yo trabajo directamente con el editor de Blogger, pero he utilizado un camino mas simple. Te lo paso por si le sirve a alguien:

Para poner un botón en las entradas (posts) de tu blog en Blogger, ir a Plantilla –> Edición de HTML –> marcar en Expandir plantillas de Artilugios –> localizar el siguiente código en la plantilla de tu blog:

–> INSERTAR ACÁ EL CÓDIGO

o por ejemplo después de este otro código (depende de dónde quieras que aparezcan los botones):

————————————-
El código a insertar es el siguiente:

Bueno, eso es todo. A mí me funciona perfecto.
Para comprobarlo, mi blog es

Eva:

Octubre 16th, 2007 a las 7:04 pm (#)

Muchísimas gracias por ***toda*** tu ayuda.
Cono novata (empecé hace menos de 10 días) tengo una duda: me funciona perfectamente tu código para las redes sociales. Tengo otros iconos que me gustaría poner, pero no se como. Me explico el href tiene una dirección concreta de cada icono. ¿cómo hago para poner los que yo tengo? Otra vez, muchas gracias por todo. Saludos

Octubre 17th, 2007 a las 12:53 am (#)

Hola Eva,

No es nada, que bueno inicias en esto. Respondiendo a tu pregunta, puedes seguir la misma estructura:

Ángel Puente:

Octubre 21st, 2007 a las 3:44 am (#)

Muy buen tutorial.

Sólo que quiero añadir el Mister Wong y no lo consigo.
Por fa…
¡¡¡Quedaría completo!!!

Muchas gracias.

Ángel

Ricard Bou:

Noviembre 5th, 2007 a las 8:54 pm (#)

ESPECTACULAR ! GENIAL !

Muchas gracias !!

Javier:

Noviembre 16th, 2007 a las 3:56 pm (#)

gracias, esto si me funciono, pero el sharethis no, mil gracias otra vez

Aleix:

Noviembre 18th, 2007 a las 7:03 pm (#)

Gracias por la detallada explicación. Me has resuelto una gran duda y funciona!

rolocine:

Diciembre 17th, 2007 a las 10:15 pm (#)

Muchísimas gracias Francisco. Muy simple y efectivo!

eddie:

Enero 1st, 2008 a las 6:14 pm (#)

Exactamente andaba en busca de este tip

Gracias por la información, ya lo estoy ocupando en mi blog

vromo:

Enero 22nd, 2008 a las 9:46 pm (#)

Gracias…..por el tutorial,

Rafael Monge:

Marzo 21st, 2008 a las 2:44 am (#)

He intentado varias veces y no lo consigo.

en lugar del

He probado de muchas maneras y no me guarda los cambios en la plantilla porque me da error.

Quedo pendiente, un saludo.

Marzo 21st, 2008 a las 1:56 pm (#)

He quitado los delimitadres en este comment porque en el anteriro no los agarro. Te deica, en lugar de esto:

p class=’post-footer-line post-footer-line-3′

en mi plantilla sale esto:

div class=’post-footer-line post-footer-line-3′

y no consigo hacer calar el codigo para que aparezcan.

Saludos

valenciayche:

Abril 30th, 2008 a las 8:15 am (#)

Gracias por el tutorial, llevaba tiempo buscandolo.
Mira que guapo ha quedado en mi blog
Valencia y che
valenciayche.blogspot.com

julian:

Mayo 18th, 2008 a las 5:59 pm (#)

Hola, mi consulta es porque tengo wordpress y no se realmente como hacer para que me aparezcan los iconos de las redes sociales debajo de cada post, ya que no me deja cambiar intriducir cambios en la plantilla.

Bueno espero alguna respuesta pronto.
Un abrazo.
Julian.

alejandro:

Julio 23rd, 2008 a las 7:46 pm (#)

gracias por la ayuda una pregunta sabes como puedo poner una barra de comentarios así como esta? saludos

Reyna:

Julio 31st, 2008 a las 7:36 pm (#)

Gracias por este tema, muy útil… nada más que el listado me sale vertical, ya repeti los pasos 3 veces, además de quitarle unos cuantos li, para ver si dependia del ancho… pero sigue igual vertical.
Graxias!!!

Wendy Pepper:

Agosto 14th, 2008 a las 1:28 pm (#)

Muy interesante. He usado este codigo con éxito. Saqué la mayoria de los marcadores y agregue otro.

Muy buena entrada la presente

juan:

Agosto 15th, 2008 a las 8:03 pm (#)

JOtaCT:

Septiembre 22nd, 2008 a las 4:01 pm (#)

no encuentro el codigo , por ningun lado, ni con el famoso Ctrl+f, no se si depende que mi plantilla no es predeterminada, porque mi plantilla la baje de http://www.btemplates.com, si me pudieras ayudar seria muy amable de tu parte.

Septiembre 22nd, 2008 a las 4:25 pm (#)

lo unico que encontre es esto
y despues esto

pero el codigo que tu das nada de nada. habra solucion?