SLIDER

¡Hola!

Mónica Lemos
¡Hola! Soy Mónicay quiero que empieces a crear tu blog o tu canal de youtube sin complicaciones. Aquí descubrirás cómo.
CONSEGUIR LO QUE QUIERES

NUNCA FUÉ TAN FÁCIL

Si quieres conseguir ciertos cambios en tu blog, renovar el diseño, arreglar algún problema, instalar alguna plantilla que te crea problemas...¡Puedo ayudarte! Envíame un e-mail a [email protected] y hablemos.

Suscríbete

¿Quieres asegurarte de que tus posts estén perfectos antes de ser publicados?
Te regalo una Check-List que te ayudará en esto.


Tutorial Blogger: Instala botón Pinterest personalizado

Instalar Botón Pin it en Blogger


La semana pasada os he comentado en Facebok que los botones de Pin It personalizados ya no funcionan, y es que el código Java Script que se usaba estaba alojado en Google Code, que cerró el 25 de enero de 2016. Con lo cual ya no funciona. 

Este código de Java Script ha sido creado por bloggersentral.com y han avisado del cambio, actualizando el post. Lo que pasa es que la mayoría de nosotras/os hemos llevado a cabo el tutorial desde algún blog español y estos no lo han actualizado. 

Resulta que me he dado cuenta porque no funcionaban mis botones en este blog, ya que en el otro no uso este tipo de botón. Así que procedo a compartiros la actualización con el vídeo - tutorial de cómo instalarlo y cómo modificarlo si es que ya lo teníais instalado.

En primer lugar quiero comentaros que esto suele pasar a menudo, ya que los códigos que usan Java Script suelen venir alojados en "algún lugar" y se "lee" (o decodifica) a través de un enlace donde está alojado. Cuando este servidor en el que se aloja, cierra, ya no se decodifica, porque no existe código, se ha eliminado el archivo .js .

  OJO CON ESTO   Os recomiendo que no os fiéis de todos estos enlaces (archivos) con Java Script alojado, ya que si no revisamos el código (copiando el código de enlace en la barra de navegación) , entendiendo un poco de código, puede que estemos instalando cosas perjudiciales para nuestro blog. En este caso podéis estar tranquilas/os, pero si os deja de funcionar ya sabéis cual es el motivo, cambio de alojamiento del Java Script.

  FREEBIES botón PIN IT   Si no tienes un botón personalizado ya sabes que puedes diseñarlo tú misma/o porque te he dejado un post para ayudarte un poco con esto. Pero si no te regalo unos botones para ti :) Recuerda ajustar la medida de las imágenes de forma optimizada para tu blog. No aumentes el tamaño, solo redúcelo si lo necesitas, porque si no perderán calidad.

dowload boton pin it descarga

DESCARGAR



   ACTUALIZACIÓN:    ha vuelto a pasar, y aunque en bloggersentral lo han vuelto a actualizar, he creado junto a ZCREATIONS esta actualización para que no vuelvas a tener problemas. Él ha desarrollado el código. Así que modifico el post y creo otro vídeo para este tutorial.

Aunque con el código de Blogger Sentral tampoco tendrás problemas, así que comparto ambas formas de hacerlo.


INSTALAR EL BOTÓN PIN IT DE PINTEREST DESDE CERO POR BLOGGER SENTRAL 


Esto es muy sencillo si seguís paso a paso el tutorial.

Copia el siguiente código en un documento de Word o Writer o bien block de notas.



<script>
//<![CDATA[
var bs_pinButtonURL = "URL de tu imagen Pin It ";
var bs_pinButtonPos = "Posición de la imagen Pin It en tus imágenes";
var bs_pinPrefix = "";
var bs_pinSuffix = "";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
<script id='bs_pinOnHover' type='text/javascript'>
//<![CDATA[
var _0xa776=["\x3C\x69\x6D\x67\x20\x73\x74\x79\x6C\x65\x3D\x22\x76\x69\x73\x69\x62\x69\x6C\x69\x74\x79\x3A\x68\x69\x64\x64\x65\x6E\x3B\x22\x20\x63\x6C\x61\x73\x73\x3D\x22\x70\x69\x6E\x69\x6D\x67\x6C\x6F\x61\x64\x22\x20\x73\x72\x63\x3D\x22","\x22\x20\x3E","\x61\x70\x70\x65\x6E\x64","\x62\x6F\x64\x79","\x68\x69\x64\x65","\x23\x62\x73\x5F\x70\x69\x6E\x4F\x6E\x48\x6F\x76\x65\x72","\x6F\x75\x74\x65\x72\x57\x69\x64\x74\x68","\x2E\x70\x69\x6E\x69\x6D\x67\x6C\x6F\x61\x64","\x6F\x75\x74\x65\x72\x48\x65\x69\x67\x68\x74","\x72\x65\x6D\x6F\x76\x65","\x6C\x6F\x61\x64","\x62\x6C\x6F\x67\x67\x65\x72\x73\x65\x6E\x74\x72\x61\x6C\x2E\x63\x6F\x6D","\x69\x6E\x64\x65\x78\x4F\x66","\x68\x74\x6D\x6C","\x76\x69\x73\x69\x62\x69\x6C\x69\x74\x79","\x68\x69\x64\x64\x65\x6E","\x63\x73\x73","\x2E\x70\x69\x6E\x69\x74\x2D\x77\x72\x61\x70\x70\x65\x72","\x6D\x61\x72\x67\x69\x6E\x2D\x74\x6F\x70","\x6D\x61\x72\x67\x69\x6E\x2D\x6C\x65\x66\x74","\x74\x6F\x70","\x70\x6F\x73\x69\x74\x69\x6F\x6E","\x6C\x65\x66\x74","\x63\x65\x6E\x74\x65\x72","\x74\x6F\x70\x72\x69\x67\x68\x74","\x74\x6F\x70\x6C\x65\x66\x74","\x62\x6F\x74\x74\x6F\x6D\x72\x69\x67\x68\x74","\x62\x6F\x74\x74\x6F\x6D\x6C\x65\x66\x74","\x73\x72\x63","\x70\x72\x6F\x70","\x2E\x70\x6F\x73\x74\x2D\x74\x69\x74\x6C\x65\x2C\x2E\x65\x6E\x74\x72\x79\x2D\x74\x69\x74\x6C\x65\x2C\x2E\x65\x6E\x74\x72\x79\x2D\x68\x65\x61\x64\x65\x72","\x66\x69\x6E\x64","\x2E\x70\x6F\x73\x74\x2C\x2E\x68\x65\x6E\x74\x72\x79\x2C\x2E\x65\x6E\x74\x72\x79","\x63\x6C\x6F\x73\x65\x73\x74","\x74\x65\x78\x74","\x75\x6E\x64\x65\x66\x69\x6E\x65\x64","","\x6C\x65\x6E\x67\x74\x68","\x61","\x72\x65\x70\x6C\x61\x63\x65","\x68\x72\x65\x66","\x61\x74\x74\x72","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x70\x69\x6E\x69\x74\x2D\x77\x72\x61\x70\x70\x65\x72\x22\x20\x73\x74\x79\x6C\x65\x3D\x22\x64\x69\x73\x70\x6C\x61\x79\x3A\x6E\x6F\x6E\x65\x3B\x70\x6F\x73\x69\x74\x69\x6F\x6E\x3A\x20\x61\x62\x73\x6F\x6C\x75\x74\x65\x3B\x7A\x2D\x69\x6E\x64\x65\x78\x3A\x20\x39\x39\x39\x39\x3B\x20\x63\x75\x72\x73\x6F\x72\x3A\x20\x70\x6F\x69\x6E\x74\x65\x72\x3B\x22\x20\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x70\x69\x6E\x74\x65\x72\x65\x73\x74\x2E\x63\x6F\x6D\x2F\x70\x69\x6E\x2F\x63\x72\x65\x61\x74\x65\x2F\x62\x75\x74\x74\x6F\x6E\x2F\x3F\x75\x72\x6C\x3D","\x26\x6D\x65\x64\x69\x61\x3D","\x26\x64\x65\x73\x63\x72\x69\x70\x74\x69\x6F\x6E\x3D","\x22\x20\x73\x74\x79\x6C\x65\x3D\x22\x64\x69\x73\x70\x6C\x61\x79\x3A\x62\x6C\x6F\x63\x6B\x3B\x6F\x75\x74\x6C\x69\x6E\x65\x3A\x6E\x6F\x6E\x65\x3B\x22\x20\x74\x61\x72\x67\x65\x74\x3D\x22\x5F\x62\x6C\x61\x6E\x6B\x22\x3E\x3C\x69\x6D\x67\x20\x63\x6C\x61\x73\x73\x3D\x22\x70\x69\x6E\x69\x6D\x67\x22\x20\x73\x74\x79\x6C\x65\x3D\x22\x2D\x6D\x6F\x7A\x2D\x62\x6F\x78\x2D\x73\x68\x61\x64\x6F\x77\x3A\x6E\x6F\x6E\x65\x3B\x2D\x77\x65\x62\x6B\x69\x74\x2D\x62\x6F\x78\x2D\x73\x68\x61\x64\x6F\x77\x3A\x6E\x6F\x6E\x65\x3B\x2D\x6F\x2D\x62\x6F\x78\x2D\x73\x68\x61\x64\x6F\x77\x3A\x6E\x6F\x6E\x65\x3B\x62\x6F\x78\x2D\x73\x68\x61\x64\x6F\x77\x3A\x6E\x6F\x6E\x65\x3B\x62\x61\x63\x6B\x67\x72\x6F\x75\x6E\x64\x3A\x74\x72\x61\x6E\x73\x70\x61\x72\x65\x6E\x74\x3B\x6D\x61\x72\x67\x69\x6E\x3A\x20\x30\x3B\x70\x61\x64\x64\x69\x6E\x67\x3A\x20\x30\x3B\x62\x6F\x72\x64\x65\x72\x3A\x30\x3B\x22\x20\x73\x72\x63\x3D\x22","\x22\x20\x74\x69\x74\x6C\x65\x3D\x22\x50\x69\x6E\x20\x6F\x6E\x20\x50\x69\x6E\x74\x65\x72\x65\x73\x74\x22\x20\x3E\x3C\x2F\x61\x3E\x3C\x2F\x64\x69\x76\x3E","\x69\x73","\x70\x61\x72\x65\x6E\x74","\x70\x69\x6E\x69\x74\x2D\x77\x72\x61\x70\x70\x65\x72","\x68\x61\x73\x43\x6C\x61\x73\x73","\x6E\x65\x78\x74","\x61\x66\x74\x65\x72","\x6F\x6E\x6D\x6F\x75\x73\x65\x6F\x76\x65\x72","\x74\x68\x69\x73\x2E\x73\x74\x79\x6C\x65\x2E\x6F\x70\x61\x63\x69\x74\x79\x3D\x31\x3B\x74\x68\x69\x73\x2E\x73\x74\x79\x6C\x65\x2E\x76\x69\x73\x69\x62\x69\x6C\x69\x74\x79\x3D\x27\x76\x69\x73\x69\x62\x6C\x65\x27","\x74\x68\x69\x73\x2E\x73\x74\x79\x6C\x65\x2E\x6F\x70\x61\x63\x69\x74\x79\x3D\x31\x3B\x74\x68\x69\x73\x2E\x73\x74\x79\x6C\x65\x2E\x76\x69\x73\x69\x62\x69\x6C\x69\x74\x79\x3D\x27\x76\x69\x73\x69\x62\x6C\x65\x27\x3B\x63\x6C\x65\x61\x72\x54\x69\x6D\x65\x6F\x75\x74\x28\x62\x73\x42\x75\x74\x74\x6F\x6E\x48\x6F\x76\x65\x72\x29","\x76\x69\x73\x69\x62\x6C\x65","\x73\x68\x6F\x77","\x66\x61\x64\x65\x54\x6F","\x73\x74\x6F\x70","\x6D\x6F\x75\x73\x65\x65\x6E\x74\x65\x72","\x2E\x6E\x6F\x70\x69\x6E\x2C\x2E\x6E\x6F\x70\x69\x6E\x20\x69\x6D\x67","\x6E\x6F\x74","\x2E\x65\x6E\x74\x72\x79\x2D\x63\x6F\x6E\x74\x65\x6E\x74\x20\x69\x6D\x67\x2C\x2E\x70\x6F\x73\x74\x2D\x62\x6F\x64\x79\x20\x69\x6D\x67\x2C\x2E\x65\x6E\x74\x72\x79\x2D\x73\x75\x6D\x6D\x61\x72\x79\x20\x69\x6D\x67","\x6D\x6F\x75\x73\x65\x6C\x65\x61\x76\x65","\x6D\x73\x69\x65","\x62\x72\x6F\x77\x73\x65\x72","\x6F\x6E","\x72\x65\x61\x64\x79"];jQuery(document)[_0xa776[68]](function(_0x8b11x1){_0x8b11x1(_0xa776[3])[_0xa776[2]](_0xa776[0]+ bs_pinButtonURL+ _0xa776[1]);_0x8b11x1(_0xa776[5])[_0xa776[4]]();var _0x8b11x2;var _0x8b11x3;var _0x8b11x4;_0x8b11x1(_0xa776[7])[_0xa776[10]](function(){_0x8b11x3= _0x8b11x1(_0xa776[7])[_0xa776[6]](true);_0x8b11x4= _0x8b11x1(_0xa776[7])[_0xa776[8]](true);_0x8b11x1(_0xa776[7])[_0xa776[9]]()});var _0x8b11x5=_0x8b11x1(_0xa776[5])[_0xa776[13]]()[_0xa776[12]](_0xa776[11]);_0x8b11x5!= -1&& _0x8b11x6();function _0x8b11x6(){_0x8b11x1(_0xa776[63])[_0xa776[62]](_0xa776[61])[_0xa776[60]](function(){_0x8b11x1(_0xa776[17])[_0xa776[16]](_0xa776[14],_0xa776[15]);clearTimeout(_0x8b11x2);var _0x8b11x7=_0x8b11x1(this);var _0x8b11x8=parseInt(_0x8b11x7[_0xa776[16]](_0xa776[18]));var _0x8b11x9=parseInt(_0x8b11x7[_0xa776[16]](_0xa776[19]));var _0x8b11xa;var _0x8b11xb;switch(bs_pinButtonPos){case _0xa776[23]:_0x8b11xa= _0x8b11x7[_0xa776[21]]()[_0xa776[20]]+ _0x8b11x7[_0xa776[8]](true)/ 2- _0x8b11x4/ 2;_0x8b11xb= _0x8b11x7[_0xa776[21]]()[_0xa776[22]]+ _0x8b11x7[_0xa776[6]](true)/ 2- _0x8b11x3/ 2;break;case _0xa776[24]:_0x8b11xa= _0x8b11x7[_0xa776[21]]()[_0xa776[20]]+ _0x8b11x8+ 5;_0x8b11xb= _0x8b11x7[_0xa776[21]]()[_0xa776[22]]+ _0x8b11x9+ _0x8b11x7[_0xa776[6]]()- _0x8b11x3- 5;break;case _0xa776[25]:_0x8b11xa= _0x8b11x7[_0xa776[21]]()[_0xa776[20]]+ _0x8b11x8+ 5;_0x8b11xb= _0x8b11x7[_0xa776[21]]()[_0xa776[22]]+ _0x8b11x9+ 5;break;case _0xa776[26]:_0x8b11xa= _0x8b11x7[_0xa776[21]]()[_0xa776[20]]+ _0x8b11x8+ _0x8b11x7[_0xa776[8]]()- _0x8b11x4- 5;_0x8b11xb= _0x8b11x7[_0xa776[21]]()[_0xa776[22]]+ _0x8b11x9+ _0x8b11x7[_0xa776[6]]()- _0x8b11x3- 5;break;case _0xa776[27]:_0x8b11xa= _0x8b11x7[_0xa776[21]]()[_0xa776[20]]+ _0x8b11x8+ _0x8b11x7[_0xa776[8]]()- _0x8b11x4- 5;_0x8b11xb= _0x8b11x7[_0xa776[21]]()[_0xa776[22]]+ _0x8b11x9+ 5;break};var _0x8b11xc=_0x8b11x7[_0xa776[29]](_0xa776[28]);var _0x8b11xd=_0x8b11x7[_0xa776[33]](_0xa776[32])[_0xa776[31]](_0xa776[30]);var _0x8b11xe=_0x8b11xd[_0xa776[34]]();if( typeof bs_pinPrefix=== _0xa776[35]){bs_pinPrefix= _0xa776[36]};if( typeof bs_pinSuffix=== _0xa776[35]){bs_pinSuffix= _0xa776[36]};if(_0x8b11xd[_0xa776[31]](_0xa776[38])[_0xa776[37]]){pinitURL= _0x8b11xd[_0xa776[31]](_0xa776[38])[_0xa776[41]](_0xa776[40])[_0xa776[39]](/\#.+\b/gi,_0xa776[36])}else {pinitURL= _0x8b11x1(location)[_0xa776[41]](_0xa776[40])[_0xa776[39]](/\#.+\b/gi,_0xa776[36])};var _0x8b11xf=_0xa776[42]+ pinitURL+ _0xa776[43]+ _0x8b11xc+ _0xa776[44]+ bs_pinPrefix+ _0x8b11xe+ bs_pinSuffix+ _0xa776[45]+ bs_pinButtonURL+ _0xa776[46];var _0x8b11x10=_0x8b11x7[_0xa776[48]]()[_0xa776[47]](_0xa776[38])?_0x8b11x7[_0xa776[48]]():_0x8b11x7;if(!_0x8b11x10[_0xa776[51]]()[_0xa776[50]](_0xa776[49])){_0x8b11x10[_0xa776[52]](_0x8b11xf);if( typeof _0x8b11x2=== _0xa776[35]){_0x8b11x10[_0xa776[51]](_0xa776[17])[_0xa776[41]](_0xa776[53],_0xa776[54])}else {_0x8b11x10[_0xa776[51]](_0xa776[17])[_0xa776[41]](_0xa776[53],_0xa776[55])}};var _0x8b11x11=_0x8b11x10[_0xa776[51]](_0xa776[17]);_0x8b11x11[_0xa776[16]]({"\x74\x6F\x70":_0x8b11xa,"\x6C\x65\x66\x74":_0x8b11xb});_0x8b11x11[_0xa776[16]](_0xa776[14],_0xa776[56]);_0x8b11x11[_0xa776[59]]()[_0xa776[58]](300,1.0,function(){_0x8b11x1(this)[_0xa776[57]]()})});_0x8b11x1(_0xa776[63])[_0xa776[67]](_0xa776[64],function(){if(_0x8b11x1[_0xa776[66]][_0xa776[65]]){var _0x8b11x12=_0x8b11x1(this)[_0xa776[51]](_0xa776[17]);var _0x8b11x13=_0x8b11x1(this)[_0xa776[48]](_0xa776[38])[_0xa776[51]](_0xa776[17]);_0x8b11x2= setTimeout(function(){_0x8b11x12[_0xa776[59]]()[_0xa776[16]](_0xa776[14],_0xa776[15]);_0x8b11x13[_0xa776[59]]()[_0xa776[16]](_0xa776[14],_0xa776[15])},3000)}else {_0x8b11x1(_0xa776[17])[_0xa776[59]]()[_0xa776[58]](0,0.0)}})}})
//Este Pinterest Hover Button está desarrollado por bloggersentral.com.
//Visita http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html para más detalles
//Porfavor no borres esta atribución
//]]>
</script>

Modifica lo que está en amarillo, sin tocar las comillas, según tus intereses:


  URL de tu imagen Pin Itcomo siempre os digo, la imagen debe estar alojada en internet para poder copiar el enlace de la imagen, yo uso una entrada del blog que nunca se publicará para estas cosas. Solo tienes que hacer click derecho sobre la imagen dentro de la entrada donde tienes tus fotos, y elegir "Copiar dirección de imagen" (fíjate en no copiar "Copiar dirección de enlace")

  Posición de la imagen Pin It en tus imágenes   Aquí podéis elegir si queréis que quede en el centro, en la parte superior derecha o izquierda, o abajo, poniendo alguno de los siguientes códigos 

topleft     arriba a la izquierda
topright    arriba a la derecha
bottomleft  abajo a la izquierda
bottomright abajo a la derecha 
center      en el centro


- Una vez modificados estos pasos nos vamos a nuestro blog y seguimos los siguientes pasos:

1 Vamos a Plantilla

2 Crear copia de Seguridad

3 Editar HTML

4 Buscar dentro de la plantilla (con CTRL + F , si no sábes cómo te dejo el vídeo) :


buscamos el siguiente código:

</body>

y ántes de ese código que hemos buscado, pegamos el que tenemos modificado en nuestro bloc de notas, word o write, que antes comentamos.

5 Guardamos plantilla y Listo


INSTALAR EL BOTÓN PIN IT DE PINTERESt DESDE CERO por zcreations 



Esto es muy sencillo si seguís paso a paso el tutorial.

- Copia el siguiente código en un documento de Word o Writer o bien block de notas.



<!--////*Codigo boton pinterest////*-->
<script type='text/javascript'>
//<![CDATA[
(function(b){b.fn.imgPin=function(e){e=b.extend({},{pinImg:"https://assets.pinterest.com/images/pidgets/pin_it_button.png",position:1},e);var g=encodeURIComponent(document.URL),f=e.pinImg,c="";switch(e.position){case 1:c="top left";break;case 2:c="top right";break;case 3:c="bottom right";break;case 4:c="bottom left";break;case 5:c="center"}this.each(function(){var a=b(this).attr("src"),d=new Image;d.src=a;d=encodeURIComponent(document.title);a=encodeURIComponent(a);a="https://www.pinterest.com/pin/create/button/?url="+
g+("&media="+a);a+="&description="+d;b(this).wrap('<div class="img-pint">').after('<a href="'+a+'" class="pin '+c+'"><img src="'+f+'" alt="Pin"></a>');5==e.position&&(d=new Image,d.onload=function(){var a=this.width;h=this.height;b(".img-pint .pin.center").css("margin-left",-a/2).css("margin-top",-h/2)},d.src=f);b(".img-pint .pin").click(function(){var a=screen.width/2-350,b=screen.height/2-200;window.open(this.href,"imgPngWindow","toolbar=no, location=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=700, height=400").moveTo(a,b);return!1})})}})(jQuery);//]]></script>
<script type='text/javascript'>
//<![CDATA[
$('.post-body img').imgPin({
pinImg : 'URL DE LA IMAGEN DE TU BOTÓN PIN IT',//tu imagen para el boton//elige un numero del 1 al 5 para cambiar la posicion del boton
position: Posición de la imagen Pin It en tus imágenes
});
//Este Pinterest Hover Button está desarrollado por http://www.zkreations.com/
//Porfavor no borres esta atribución

//]]>
</script>
<!--////*Fin Codigo boton pinterest////*-->


- Modifica lo que está en amarillo, sin tocar las comillas, según tus intereses:

  URL de tu imagen Pin It , como siempre os digo, la imagen debe estar alojada en internet para poder copiar el enlace de la imagen, yo uso una entrada del blog que nunca se publicará para estas cosas. Solo tienes que hacer click derecho sobre la imagen dentro de la entrada donde tienes tus fotos, y elegir "Copiar dirección de imagen" (fíjate en no copiar "Copiar dirección de enlace")

  Posición de la imagen Pin It en tus imágenes   Aquí podéis elegir si queréis que quede en el centro, en la parte superior derecha o izquierda, o abajo, poniendo alguno de los siguientes números. Sustitúyelo por la frase en amarillo.

1  arriba a la izquierda
2  arriba a la derecha
5  centro (no suele quedar centrado)
4  abajo a la izquierda
3  abajo a la derecha

- Una vez modificados estos pasos nos vamos a nuestro blog y seguimos los siguientes pasos:

1 Vamos a Plantilla

2 Crear copia de Seguridad

3 Editar HTML

4 Buscar dentro de la plantilla (con CTRL + F , si no sábes cómo te dejo el vídeo) :


buscamos el siguiente código:

</body>

y ántes de ese código que hemos buscado, pegamos el que tenemos modificado en nuestro bloc de notas, word o write, que antes comentamos.

5 Guardamos plantilla

6 Buscamos de nuevo en plantilla, como hemos hecho antes, pero esta vez buscamos este código:

]]></b:skin>

Si no te sale, busca primero </b:skin> , dale a los puntitos anteriores y luego busca de nuevo:

 ]]></b:skin>


7 Pega el siguiente código:

/**** Codigo boton pinterest******/.img-pint img {    display: inline-block;}.img-pint {    position: relative;    display: inline-block;}
.pin {    position: absolute; opacity: 0;    -webkit-transition: opacity .3s;       -moz-transition: opacity .3s;        -O-transition: opacity .3s;    transition: opacity .3s;}
.img-pint:hover .pin { opacity: 1;}.img-pint .top {top: 10px;}.img-pint .left {left: 10px;}.img-pint .right {right: 10px;}.img-pint .bottom {bottom: 10px;}/**** Fin Codigo boton pinterest******/
8 Guardamos plantilla y Listo

MODIFICAR EL PIN IT QUE YA TENÍA INSTALADO 


Para esto todavía lo tenemos más fácil porque solo tendremos que cambiar una parte del código que ya tenemos.

1 Vamos a Plantilla

2 Crear copia de Seguridad

3 Editar HTML

4 Buscar dentro de la plantilla (ver vídeo anterior) el siguiente código:

bs_pinOnHover
5 Nos aparecerá el código de bloggersentral, como este:

<!-- Inicio - Botón Pin it -->
<script>
//<![CDATA[
var bs_pinButtonURL = "URL de tu imagen Pin It";
var bs_pinButtonPos = "Posición de la imagen Pin It en tus imágenes";
var bs_pinPrefix = "";
var bs_pinSuffix = "";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
<script id='bs_pinOnHover' src='https://googledrive.com/host/0B40RQ963OElISE9lY1E1YS1lU28/bs_pinOnHoverv1_min.js' type='text/javascript'>
// This Pinterest Hover Button is brought to you by bloggersentral.com.
// Visit http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html for details.
// Feel free to use and share, but please keep this notice intact.
</script>
<!--Fin - Botón Pin it -->

Elimína todo el código, para poder instalar el botón que te servirá siempre, y llevar a cabo las instalaciónes desde cero que te sugiero en este tutorial .


6 Guardar y llevar a cabo la instalación desde cero que te compartí más arriba.


Más fácil imposible, ¿Verdad? 

No obstante aquí os dejo un vídeo para que os resulte más fácil ;)

VÍDEO-TUTORIAL






Ahora ya tienes todo lo necesario para que las imágenes de tu blog sean pineadas por tus lectoras/es :)

Espero que te haya gustado y servido de ayuda, y si tienes sugerencias de posts no dudes en sugerírmelas. Las dudas aquí debajo, en comentarios :D


Si te sientes generosa/o puedes compartir este post en tus redes sociales para que llegue a más gente que lo necesite como tú. 




   

10 comentarios

  1. Que maravilla tu post!! Me ha caído del cielo, ya que yo me había dado cuenta que había dejado de funcionar el código, busqué en bloggersentral y pues no encontré que hubiesen actualizado (ciega yo!). Gracias!!
    Un abrazo!!

    ResponderEliminar
    Respuestas
    1. Vale!! verdad que es frustrante? pues me alegro haber resuelto tu problemilla, en él me encontré yo hace poco y por eso quise compartirlo cuanto antes!! :)
      De nada, gracias a ti por comentar!! :D

      Eliminar
  2. como siempre tu post tan genial monica y muy bien explicado, sabes en mi plantilla no encuentro esta palabra la palabra body con los corchetes :/ pero seguiré intentando

    ResponderEliminar
    Respuestas
    1. Espero que la hayas encontrado Noura :)
      Está en todas las plantillas!!
      Muack!

      Eliminar
  3. Muchisimas gracias por el tutorial, me estaba costando la vida porque no encontraba codigos actualizados :) asi que muchas gracias por hacerlo simple para torpecillas como yo! Y de paso me quedo por aqui que hay mucho que ver!
    Besos!

    ResponderEliminar
    Respuestas
    1. Genial Ali!!! de eso se trata de soluciones sencillas y variadas para esta tarea tan ardua!!
      Gracias!!!
      Un besin

      Eliminar
  4. Gracias! Excelente tuto, me has ayudado un montón :)

    ResponderEliminar
  5. Hola super bueno tu post pero no pude aplicarlo pues blogger no me dejo crear una copia de seguridad por lo que no pude acceder a html alguna ayuda que me puedas dar de antemano gracias
    saludos Claudia

    ResponderEliminar
    Respuestas
    1. Qué raro Claudia!!!
      Seguro que si actualizas la página o vuelves a intentarlo te dejará!!, no dejes de intentarlo
      Muack!!

      Eliminar

© Blogger Paso a Paso • Theme by Maira G. Adaptada por Mónica Lemos, autora de este blog.
Todas las imágenes son del banco de imágenes Unsplash.com o bien de mi propia autoría.
Si quieres puedes reclamar tu autoría - Contactar con la autora del blog.