Bienvenido a mi blog. Aquí encontrarás todas las cosas que he creado e ido aprendiendo con el tiempo, útiles para ti y tu sitio web.

Pon Comentarios Recientes

21.10.12


Hoy traigo otro código para colocar el widget de "Comentarios Recientes". Este widget permite ver los últimos comentarios realizados en tu blog y además de llevarte, con sólo un click en un comentario, a la entrada donde se publicó dicho comentario.

Bien iniciemos con el paso a paso (ノ ̄▽ ̄)ノ Let's begin with step by step.

PASO 1: Click en 'Diseño → Diseño → Añadir un gadget → HTML/Javascript'

PASO 2: Pega el sgte. código (↓↓↓)

<style type="text/css">
    ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
    .w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
    .w2b_recent_comments li .avatarImage{padding:3px;background:#FCA4D0;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
    .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
    .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
numComments = 4,/** NUMERO DE COMENTARIOS VISIBLES **/
showAvatar = true,
avatarSize = 50,/** TAMAÑO DE AVATAR **/
roundAvatar = true,
characters = 100,/** NUMERO DE CARACTERES VISIBLES **/
showMorelink = true,
moreLinktext = "Más »",
defaultAvatar = "URL DE IMAGEN",/** AVATAR POR DEFECTO **/
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b-recent-comments-w-gravatar.js"></script>
<script type="text/javascript" src="URL DE TU BLOG/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

PASO 3: Guardar y ver como ha quedado (*o*) ...a de verse así (↓↓↓)

*PERSONALIZALO! (Opcional)

#FCA4D0 Color del borde del avatar. Cambialo por otro código de color. Ejemplo: Fuxia (#FF0077), Rojo (#FF0000), Lila (#D186EB), etc.


/** NUMERO DE COMENTARIOS VISIBLES **/ A mayor sea el número mayor sea el número de comentarios que se podrán ver.

/** TAMAÑO DE AVATAR **/ Con esto puedes agrandar o achicar el tamaño del avatar, sólo cambia el número por el que gustes más.

/** NUMERO DE CARACTERES VISIBLES **/ Yo le dejé con 100 caracteres, que vienen a ser 100 letras contando también a los espacios. Si cambias ese número por otro mayor podrás ver más caracteres y si no cambias por uno menor será todo lo contrario.

/** AVATAR POR DEFECTO **/ El avatar por defecto es la imagen que se verá en caso un usuario no tenga imagen de perfil (avatar) o si es un usuario anónimo. Sólo pon el url de la imagen que quieres mostrar.

URL DE TU BLOG Aquí es muy obvio ヘ( ̄ω ̄ヘ) pones el url de tu blog. LOL.


3 comentarios:

Home About Design My designs Contact