MundoBlogger: Añadir marcadores sociales fijos en la esquina del blog

Pages

Añadir marcadores sociales fijos en la esquina del blog

añadir marcadores sociales fijo en la parte de abajo viernes, 8 de julio de 2011

Recientemente, con la creación delbotón de Google +1, me decidí a agregarlo al blog en dos lugares. El primer lugar es en cada página individual, lo cual lo explico en esta entrada:Agregar botón de Google +1. Pero también lo agregué junto al botón de Twitter y Facebook, en la esquina inferior derecha del sitio. De esta manera, si bajan en la entrada, a pesar de que ya no se ve el primer botón, el segundo sigue disponible, y de esta manera se podrán ganar más Google +1, Tweets y Me gusta, y por lo tanto, puede que se gane también un mayor reconocimiento entre los usuarios de la blogósfera y las redes sociales, y puede que también por parte de Google.

A continuación voy a explicar como agregarlos, por las dudas les dejo una captura de cómo son, puede que en este momento tal vez no estén disponibles, ya sea porque los haya quitado o porque surja algún error. Lamentablemente en la captura hay muy pocos clicks, pero pueden dejar algunos ustedes

Marcadores sociales fijos Añadir marcadores sociales fijos en la esquina del blog

Si utilizás Blogger:

En el caso de los blogs creados con Blogger, debemos seguir estos pasos.

[1] Vamos a Diseño > Edición de HTML, y buscamos la etiqueta </body>.

[2] Ahora vamos a pegar antes de esa etiqueta el siguiente código:

<div style="display:scroll;position:fixed;bottom:5px;right:0px;">
<div style="margin-top:-2px;margin-right: 5px;float:left;">
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang: 'es'}
</script><g:plusone size="tall"></g:plusone>  <a href="http://twitter.com/share" data-count="vertical" data-via="oliverelmenor" data-lang="es">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div>
<iframe src="http://www.facebook.com/plugins/like.php?app_id=159243740808073&href=" + data:post.url + "&send=false&layout=box_count&width=120&show_faces=true&action=recommend&colorscheme=light&font&height=65" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:65px;" allowTransparency="true"></iframe>
</div>

Si utilizás WordPress:

Si tu blog utiliza WordPress como CMS, puedes seguir estos pasos.

[1] Vamos a nuestro panel de WordPress y elegimos la opción Apariencia > Editor. Luego nos vamos al archivo footer.php, el cual refiere a todo lo que es el pie de página.

[2] Ahora vamos a pegar el siguiente código antes de la etiqueta </body>, la cual siempre cierra todo el cuerpo de página:

<div style="display:scroll;position:fixed;bottom:5px;right:0px;">
<div style="margin-top:-2px;margin-right: 5px;float:left;">
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang: 'es'}
</script><g:plusone size="tall"></g:plusone>  <a href="http://twitter.com/share" data-count="vertical" data-via="oliverelmenor" data-lang="es">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div>
<iframe src="http://www.facebook.com/plugins/like.php?app_id=159243740808073&href=<?php the_permalink(); ?>&send=false&layout=box_count&width=120&show_faces=true&action=recommend&colorscheme=light&font&height=65" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:65px;" allowTransparency="true"></iframe>
</div>

Obviamente les recomiendo cambiar lo que dice oliverelmenor por su propio usuario de Twitter, eso es para que cuando hagan un Tweet, la cuenta del blog o nuestra cuenta sean nombradas.