Marcadores Sociales estilo Windows 8 para Blogger

Con el reciente lanzamiento de Windows 8, las cosas con ese estilo se han puesto de moda y Blogger no es la excepción, teniendo en cuenta el estilo de este sistema operativo me decidi hacer unos marcadores para Blogger que tuvieran un ligero estilo de Windows 8 y este ha sido el resultado.


Puedes ver los marcadores funcionando en el siguiente blog de pruebas.

Para añadir este truco a tu blog, primero debes ir a la Edición HTML de tu blog y buscar con los artilugos expandidos, lo siguiente:
 <div class='post-footer-line post-footer-line-3'>

Debajo de la anterior linea pega lo siguiente:
<div class='separator' style='clear: both; text-align: right;'>
<img border='0' src='http://4.bp.blogspot.com/-LfPK79XnTLI/UK6Zh_vRDkI/AAAAAAAAB3k/XXt0BUzCVHM/s1600/Compartir.png'/></div>
<br/>
    <a class='twitter' expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot;: &quot; + data:post.url' rel='nofollow' target='_blank' title='Twittear'><img src='https://lh5.googleusercontent.com/-Vt4GahsWqaA/UK6OjizECOI/AAAAAAAAB2w/4Zi-VupkNgA/s86/twitter.png'/></a>


<a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url+ &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Compartir en Facebook'><img src='https://lh6.googleusercontent.com/-beM2bOCQrTY/UK6PglfJvyI/AAAAAAAAB3U/ad8X9Eq3jIA/s108/facebook.png'/></a>

<a class='googleplus' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url+ &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Compartir en Google Plus'><img src='https://lh3.googleusercontent.com/-jg9JctagFsg/UK6PD3FZvbI/AAAAAAAAB3E/npzWkMhfNr8/s97/google%252B.png'/></a>

<a class='pinterest' expr:href='&quot;https://pinterest.com/login/?next=/pin/create/bookmarklet/%3Fmedia%3Dhttp%253A%252F%252F&quot; + data:post.url+ &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Compartir en Pinterest'><img src='https://lh6.googleusercontent.com/-I5-ZAnBPJ9w/UK6PHxGgaDI/AAAAAAAAB3M/rENy_tUUpHU/s100/pinterest.png'/></a>

Ahora solo resta guardar los cambio y listo. En el pack vienen los iconos de Twitter, Facebook, Google + y Pinterest.

Este es un pequeño truco, que espero sea de su agrado.

Previous
Next Post »

12 comentarios

Click here for comentarios
Anónimo
22 de noviembre de 2012, 19:26 ×

Genial están fabulosos :)

Responder
avatar
admin
23 de noviembre de 2012, 7:16 ×

Excelente, muito obrigado por compartilhar conosco.;)

Responder
avatar
admin
23 de noviembre de 2012, 19:56 ×

estos son los iconos del plugin Juiz social post sharer de wordpress,no? lo que hicistes fue capturar en imagen el boton y hacerlo estatico. el original no es como este.

Responder
avatar
admin
25 de noviembre de 2012, 1:58 ×

Si, lo son, y están muy bien.

Responder
avatar
admin
27 de noviembre de 2012, 18:14 ×

Muchas gracias por vuestro comentario :P

Responder
avatar
admin
27 de noviembre de 2012, 18:20 ×

Muito obrigado a você,

Saudações,Eu também falo Português :D

Responder
avatar
admin
27 de noviembre de 2012, 18:22 ×

Osman tienes razon amigo, pero debes reconocer que les di un toque personal y quedaron muy bien :P

David, cierto que quedaron muy bien? :twisted:

Responder
avatar
admin
28 de enero de 2013, 21:58 ×

[ma]Hola Juvinao me quedo excelente en mi blog, pero le di un toque a las imagenes.[/ma]

[img]http://1.bp.blogspot.com/-rMdu1qJQUC4/UQdkb3L-QqI/AAAAAAAABrs/ZTcs2qMH8sg/s1600/Compartir_win8.PNG[/img]

Responder
avatar
admin
18 de abril de 2013, 7:38 ×

y si no me aparece el footer codigo ese con el numero 3 solo hasta el numero dos

Responder
avatar
admin
18 de abril de 2013, 8:44 ×

Puedes ponerlo en el footer 1 o el data post body también servirá allí.

Saludos

Responder
avatar
admin
25 de abril de 2013, 14:20 ×

Como hago para que estos iconos, no parezcan en el inicio del blog?., lo que necesito es que estos iconos parezcan cuando entro a un post!.

Responder
avatar
admin
26 de abril de 2013, 6:06 ×

Vale para hacer lo que ti quieres metete en este Post: http://ciudadblogger.com/2010/03/condicionales-de-blogger.html.

Una vez ahi tienes que isertar el codigo que te aparece en: "Mostrar /ejecutar un elemento sólo en las entradas individuales".

Una vez puesto solo te saldran en las entradas individuales.

Un saludo y cualquier cosa aqui estamos :)

Responder
avatar
admin

Comenta y exprésate, Tu opinión es importante
Reglas para Comentar Mostrar el conversorOcultar conversor Mostrar EmoticonesOcultar Emoticones

Thanks for your comment