Han sido varios los que me han preguntado como agregar íconos de redes sociales a su blog. Hoy vamos a ver cómo hacerlo y más adelante veremos como darle algunos "efectos" (pushbutton, transparencia,etc.)
Para colocar los íconos haremos lo siguiente:
♠ Vamos a Diseño - Edición de HTML y Expandir plantilla de artilugios.
♠ Con ayuda de CTRL+F buscaremos lo siguiente:
<p class='post-footer-line post-footer-line-3'/>
♠ Antes del código anterior, pegaremos lo siguiente:
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Del.icio.us' src='http://img30.imageshack.us/img30/1893/delicious24x24s.png'/></a>
<a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a DiggIt!' src='http://img30.imageshack.us/img30/8708/digg24x24.png'/></a>
<a expr:href='"http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Google' src='http://img17.imageshack.us/img17/6836/google24x24.png'/></a>
<a expr:href='"http://www.technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Technorati' src='http://img2.imageshack.us/img2/1722/technorati24x24.png'/></a>
<a expr:href='"http://ma.gnolia.com/beta/bookmarklet/add?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Magnolia' src='http://img30.imageshack.us/img30/3479/magnolia24x24.png'/></a>
<a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Reddit' src='http://img30.imageshack.us/img30/7517/reddit24x24.png '/></a>
<a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&Description=&Url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Blinklist' src='http://img14.imageshack.us/img14/5392/blinklist24x24.png'/></a>
Damos click a guardar y eso sería todo. Si queremos podemos agregar más redes sociales o cambiar los íconos que les proporcione por otros.
Por cierto si desean alojar directamente los íconos, aquí les dejo el link de la colección de íconos que usé » Descargar
► Iconos vía Fasticon
8 opinaron:
Es lo que buscaba, genial!
Es lo que iba a preguntar; gracias por compartir con todos tus conocimientos :)
Muy buenos
Me quedaron preciosos, hoy mismo los puse :D. Si, se que pregunto mucho :), pero,
tengo que estar registrado en cada una de estas páginas para que funcionen?
Tanto para enviar webs, como para que otros envien la mia?
Saludos y te doy 100 puntos por este articulo.
:D Jesi muy bueno tu blog, vengo siguiendo tus entradas...saludos
» squirrel: me alegra :)
» G: gracias a ti por la visita
» juan carlos: gracias :)
» Josué: sí, los vi en tu blog y quedaron muy bien.
En cuanto a tu pregunta, pues no es necesario que tú te suscribas a cada una de las páginas para que funcione el código, pero para que alguien envíe tus entradas o post si tiene que estar suscrito e iniciar sesión cuando quiera recomendar tus post.
» Graciela: me alegra que sigas el blog :) te visitaré pronto
S@lu2
:) MUCHAS GRACIAS ME FUNCIONO PERFECTO.. SOLO QUIERO SABER COMO AGREGO EL DE FACEBOOK Y TWITTER ;)
» jhyrlecrystal:
Para Twitter agrega lo siguiente:
<a expr:href='"http://twitter.com/home/?status=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img src='AQUÍ-URL-IMAGEN-BOTÓN' style='border:0px; padding:2px' valign='bottom'/></a>
Para Facebook:
<a expr:href='"http://facebook.com/share.php?u=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img src='AQUÍ-URL-IMAGEN-BOTÓN' style='border:0px; padding:2px' valign='bottom'/></a>
Reemplazas AQUÍ-URL-IMAGEN-BOTÓN por los botones que tengas para twitter y facebook.
S@lu2
Por favor, trata de tener habilitado tu perfil (has click en "Comenta con el antiguo editor" para iniciar sesión) o deja un enlace a tu blog escogiendo la opción "Nombre/URL", procura no dejar comentarios Anónimos.
Nota: Si es que se presenta algún problema con el formulario de comentarios, sólo has click en "Comenta con el antiguo editor"
Gracias por participar en el blog.