Como poner un botón de Pinterest sobre cada imagen en tu blog

Hola, maestr@s. En otras ocasiones he hablado sobre Pinterest y la importancia que tiene no solo para aprender y encontrar recursos, sino también para promocionar nuestros blogs o trabajos en general.
En esta ocasión traigo un tip que nos va a permitir colocar un botón sobre cada imagen de nuestro blog al pasar el mouse sobre ella, para que nuestros visitantes puedan pinear lo que les gusta. Este efecto solamente es para Blogger.

Mira el ejemplo en la siguiente imagen:

Es muy sencillo:

1. Entrar al escritorio de Blogger/Plantilla/Edición de HTML

2. Llevar la barra de desplazamiento hasta el final:

3. Ir subiendo la barra de desplazamiento hasta encontrar la etiqueta </body>

4. Poner el cursor antes de la etiqueta y pegar el siguiente código:

<script> //<![CDATA[ var bs_pinButtonURL = "http://3.bp.blogspot.com/-y3xzTGiGzH0/UK4XOaUpdaI/AAAAAAAADw8/Z1MH4Jr4Efo/s1600/pinterestx1_72.png"; var bs_pinButtonPos = "center"; //]]> </script> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/> <script src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'/> <!-- please do not alter or remove the following code --> <div id='bs_pinOnHover'><a href="http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html">Pin It button on image hover</a></div>

5. Guardas los cambios y listo. En este caso el botón va a quedar en el centro de la imagen. A mi no me gusta pues si la imagen tiene un enlace se puede confundir con el acto de pinear. Entonces lo que debes hacer es que después de colocar el código buscas donde dice "center" y lo sustituyes por "bottomright". Así el botón quedará como en la imagen que mostré anteriormente.

Espero que te sirva este tip y me dejes ver cómo quedó en tu blog. Cualquier duda puedes preguntar en los comentarios.

Fuente: http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html