08 marzo 2011

"Comentar en ventana emergente"


Otra forma de mostrar la caja de comentarios para que vuestros lectores escriban, es usando una ventana emergente que resulta verdaderamente útil, ya que los visitantes podrán comentar tanto con el formulario incrustado bajo las entradas como con el formulario en ventana emergente, con un efecto muy elegante, hacer que el fondo del blog se oscurezca (de manera que la ventana quede resaltada).

Con esta opción hacemos que el formulario de comentarios se habra al hacer click en una imágen o botón.



El lado positivo de este truco es que su instalación es realmente sencilla y el resultado muy prometedor.

Comenzaremos instalando el script en el blog.

Diseño>Edición de HTML>expandimos artilugios



Busca la etiqueta </head> y añade "antes" el script que te muestro a continuación:

<link href='https://sites.google.com/site/amorsevillista/scriptamorsevillista.css' media='screen' rel='stylesheet' type='text/css'/>

<script src='https://sites.google.com/site/amorsevillista/scriptamorsevillista.js' type='text/javascript'/>


Ahora busca esta línea: 

<div class='post-footer'>

E inserta esto justo debajo:

<a expr:href='&quot;http://www.blogger.com/comment.g?blogID=IDBLOG&amp;amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;' rel='lyteframe' rev='width:682px; height:460px; scrolling:yes;'><img align='right' src='http://4.bp.blogspot.com/_gjBqKNTws4M/S7IPJytQz4I/AAAAAAAACNA/NOuP-jW5n2g/s320/blcomentp.png'/></a>

Seguidamente deberás hacer el paso más importante: colocar la ID de tu blog, reemplazando IDBLOG por las cifras que la componen.

¿Dónde encuentro la ID? Muy sencillo. Si te encuentras en el apartado de Diseño>Edición de HTML, bastará con observar la dirección que aparece en la barra de direcciones...


Guarda la plantilla para terminar...

Notas:
- En caso de no encontrar la línea <div class='post-footer'>, busca la línea <data:post.body/> y agrega el código encima de ella.

- Si deseas cambiar el botón que abre la ventana emergente con el formulario, reemplaza la línea http://4.bp.blogspot.com/_gjBqKNTws4M/S7IPJytQz4I/AAAAAAAACNA/NOuP-jW5n2g/s320/blcomentp.png  por la URL de tu imagen

Os dejo unas cuántas imágenes de ejemplo por si la queréis cambiar:











Por favor, comente de acuerdo al tema del artículo.
Serán removidos todos los Comentarios con enlaces.
Si quieres recibir los nuevos comentarios marca "Avisarme"