jueves, 22 de agosto de 2013

Gadget de últimos comentarios expandibles para Blogger

En otras ocasiones ya he publicado gadgets de últimos comentarios para Blogger, pero el truco de hoy viene con algunas cosas adicionales, trae la fecha, hora, el nombre del usuario que comento y el nombre de la entrada, además al hacer clic en el pequeño icono de la cruz se ve el comentario completo, evitando que tengamos que ir a la entrada para ver el comentario completo.

Vista previa del gadget.



Para agregar este gadget a tu blog solo debes ir a Diseño, Añadir Gadget, HTML/JavaScript, estando allí pega el siguiente código:
<style type="text/css" media="screen">
.row-aa {        background: #f2f2f3; }
.row-bb {        background: #F8F5F1; }
.row-div {
  margin:0px;
  padding:5px;
}
.comment-header {
  font-size:0.9em;
//  border:1px solid #E0E0E0;
//  background-color:#F3F3F3;
  padding:4px;
  margin-top:10px;
  margin-bottom:5px;
}
.comment-box {
  margin:0px;
  padding:0px;
  font-size:0.9em;
  height:500px;
  overflow:auto;
}
.comments1  {
//  background: #F3F3F3;
  padding:3px;
  border-left:1px dashed #A6A6A6;
  color: #888888;
  font-style: italic;
  padding-top:4px;
  margin-bottom:5px;
}
.comment-footer {
  text-align:center;
  font-size:0.9em;
  padding:4px;
  margin-top:5px;
}
</style>
<div style="text-align: center" class="comment-header"><input class="comment-button" id="commshowall" type="button" onclick="if (this.value == &#39;Mostrar Comentarios&#39;) { unfold_all(this); this.value=&#39;Ocultar Comentarios&#39;; } else { fold_all(this); this.value=&#39;Mostrar Comentarios&#39;; }" style="width:13em;font-size:1em;font-family:Verdana,sans" value="Mostrar Comentarios" /></div>
<div class="comment-box">
<script type="text/javascript" src="https://dl.dropboxusercontent.com/u/35784805/Mil%20Trucos%20Blogger/Comentarios%20Recientes%20Expandibles.js"></script>
<script type="text/javascript"  src="http://URL DE TU BLOG/feeds/posts/default?start-index=1&max-results=999999&alt=json-in-script&callback=showrecentposts">
</script>
<script type="text/javascript"  src="http://URL DE TU BLOG/feeds/comments/default?start-index=1&max-results=999999&alt=json-in-script&callback=showrecentcomments">
</script>
</div>

Ahora solo reemplaza lo que esta resaltado en color azul por la URL de tu blog (solamente por tublog.com o en su defecto www.tublog.com sin el http://) y guarda los cambios.

El script pertenece a Help Blogger, yo he traducido el script al español en su totalidad y he hecho otros pequeños cambios.

Espero que les haya servido este tutorial, y si ya usaste este truco cuéntanos que te ha parecido.


SuitsTheme

Excepteur occaecat cupidatat proident, sunt in culpa officia deserunt mollit arnim laborum. Nemo enim ipsam voluptatem quia voluptas aspernatur odit, sed quia consequuntur ratione voluptatem sequi nesciunt.

No hay comentarios :

Publicar un comentario