Como Blogger es bastante parco a la hora de informarnos cosas, hay que esperar que alguien se de cuenta y por suerte, Rosa siempre está atenta y este fin de semana nos avisa que en Blogger Draft hay dos nuevos gadgets que es posible agregar al blog: Estadísticas y Entradas populares

Por supuesto, como todo lo que se encuentra en esa parte, no están 100% probados así que es posible que nos encontremos con errores o incluso, que vayan cambiando con el tiempo pero, nada impide probar y agregarlos ya que son bastante simples.

El llamado Estadísticas del Blog muestra precisamente eso y nos permiten elegir entre cuatro estilos diferentes, algunos de los cuales podemos a su vez configurar aunque en todos ellos, las opciones son mínimas.



¿De dónde sacan las estadísticas? Seguramente coinciden con las que se muestran en la pestaña Estadísitcas del mismo Blogger Draft y se corresponden con la cantidad de páginas vistas (historial completo).

El gadget se agrega como cualquier otro y lo veremos en nuestra plantilla identificado con un ID llamado Stats1 y su título por defecto es Páginas vistas en total
<b:widget id='Stats1' locked='false' title='Páginas vistas en total' type='Stats' />
Si lo expandimos, veremos el código donde, al parecer, poco hay para tocar y si, eventualmente, se nos ocurriera modificar algún detalle, deberíamos agregar las reglas de estilo correspondientes para sobrescribir las que utiliza Blogger.


/* el bloque donde se muestra el gadget */
.Stats .counter-wrapper {
display:inline-block;
font-size:24px;
font-weight:bold;
height:30px;
line-height:30px;
vertical-align:top;
}
/* la imagen del gráfico si usamos esa opción (tamaño 75x30) */
.Stats img { margin-right:10px; vertical-align:top; }
.Stats .graph-counter-wrapper {color:#FFFFFF;}
/* el estilo de cada dígito */
.Stats .digit {
background:url("/img/widgets/stats-flipper.png") no-repeat scroll left center transparent !important;
border:1px solid #FFFFFF;
display:inline-block;
height:28px;
line-height:28px;
margin-left:-1px;
position:relative;
text-align:center;
width:22px;
}
.Stats .blind-plate {
border-bottom:1px solid #FFFFFF;
border-top:1px solid #000000;
height:0;
left:0;
opacity:0.65;
position:absolute;
top:13px;
width:22px;
}
/* la posición de cada dígito */
.Stats .stage-0 {background-position:0 0 !important;}
.Stats .stage-1 {background-position:-22px 0 !important;}
.Stats .stage-2 {background-position:-44px 0 !important;}
.Stats .stage-3 {background-position:-66px 0 !important;}
De todo ello, tal vez, lo que seguramente es más importante es la posición ya que no está centrado, para hacerlo, deberíamos poner algo así antes de </b:skin>
#Stats1_content { text-align: center; }

Si esas estadísticas son creibles o no ... ¿quién sabe? En todo caso, es llamativo que no coincidan con las que da Google Analytics siendo ambos, servicios de la misma empresa. Es cierto que todas las estadísticas son ... dudosas pero algunas son "mas dudosas" que otras. De todas maneras, en un blog comercial, la única estadística válida es la cuenta bancaria y en un blog personal, la única estadística válida es el placer y esa, no puede ser mensurada.

El otro gadget es el llamado Entradas Populares que se basa en el mismo sistema de estadísticas por lo que difiere de aquellos otros que se basaban en la cantidad de comentarios y que, por utilizar los feeds, sólo permitian acceder a las últimas 500 entradas.

En este caso, las opciones nos permiten seleccionar tres períodos: mostrar las entradas más vistas en cualquier momento, en los últimos 30 días y en al última semana. Los resultados variarán pero lo más razonable, parecería utilizar la primera opción ya que en las otras dos, suelen pesar demasiado las últimas entradas publicadas.


A su vez, de manera similar a como lo hace el gadget Lista de blogs, podemos elegir si mostramos el título de las entradas, una miniatura (si es que hay una imagen) y un fragmento de la misma.

Al agregarlo, también veremos el código pero pocas posibilidades de personalizarlo:
<b:widget id='PopularPosts1' locked='false' title='Entradas populares' type='PopularPosts' />
Aparentemente, no hay limitaciones a la cantidad de gadgets a agregar así que pueden probarse todas juntas pero, tal como se ve en algunos comentarios de la entrada de Rosa, el resultado que se obtiene es bastante ... pobre. Fundamentalmente, el problema es que se listan 10 entradas y eso hace que el gadget sea excesivamente largo. En estas dos capturas se ve el resultado parcial, el real, tiene casi el doble de esa altura:



Aún usando el gadget con la opción donde se muestran sólo los títulos, el CSS agregado por Blogger es molesto, crea listas con items muy separados así que deberemos recurrir al CSS y agregar nuestras propias reglas de estilo para sobrescribirlas.


/* esta es la miniatura cuando hay un fragmento */
.PopularPosts .item-thumbnail {float:left;margin:0 5px 5px;}
/* esta es la miniatura cuando no hay un fragmento */
.PopularPosts .item-thumbnail-only {text-align:center;}
/* esta es la miniatura en si misma */
.PopularPosts img {padding-right:0.4em;}
/* cada uno de los diez items */
.PopularPosts .widget-content ul li {padding:0.7em 0;}
/* el título de cada item */
.PopularPosts .item-title {padding-bottom:0.2em;}
Por ahora, tal como está, no creo que sea demasiado útil, más que nada por su tamaño. Los resultados que muestra, por lo menos en mi caso son ... extraños porque, como dije antes, los resultados que muestran las estadísticas de Blogger Draft también son extraños y esa es la fuente que se consulta. De todos modos, si pudiera configurarse un poco más, reducirse la cantidad, estabecer alguna forma de mostrar una imagen alternativa cuando la entrada no tenga, etc, etc, podría ser una alternativa sin importar esos resultados ya que es una forma de "refrescar" entradas viejas.


Un último dato curioso. Mirando la hoja de estilo (la voluminosa hoja de estilo) que incluye Blogger por defecto, se ven algunas reglas que hacen suponer que en algún momento se agregará algún gadget de entradas relacionadas ya que hay definiciones que parecen indicar eso.

Habrá que estar atentos ...

53 comentarios:

Hugo.V13  

Como siempre, atento a lo que comentas sobre lo nuevo con que el viejo Blogger nos intenta sorprender jejeje =P! Y la verdad es que nunca nos dará en el gusto al cien por ciento...
Sobre las entradas populares... es útil, como dices, para refrescar entradas antiguas... y aunque que sean 10 entradas es bastante, siempre un overflow:hidden y un height mas pequeño nos salva el día jajajaja xD!

Saludos y gracias por tus aportes =P!

Responder
Felipe Calvo Cepeda  

¿Será? :D
Mientras funcionen apropiadamente y podamos controlar cosas como el numero de entradas a mostrar y alguna miniatura, serían alternativas muy interesantes o tal vez casi indispensables.

Vi via @pizcos una adaptacion para mostrar las 10 entradas con solo la miniatura y con una imagen por defecto, pero pues esperar a ver.

POS: Que buena forma de ampliar las imágenes. Sencillo y rápido :D
Pensé por un momento que habías eliminado Lightwindow, que a propósito, pienso que es una de las mas populares (o tal vez la más) ;)

Saludos.!

Responder
Unknown  

Muchas gracias por su información, mis entradas se dividen en 'divinas y populares', cosa que Blogger desconoce :P
Con respecto a las estadísticas, he contratado una ONG

Responder
JMiur  

Balthazar:
No, nunca estaremos conformes ¿eso sera bueno o será malo? :D

Eso que comentas es posible que sea una solución, también usar algún script para contarlos, no sé; creo que habría que esperar a ver que hacen con eso proque al estar en la parte de pruebas es posible que sufra cambios y no vale la pena adelantarse en estas cosas.

Felipe:
Si se pudiera hacer eso, sería una alternativa más.

Lo del código, si, es posible ya que todo está a la vista así que bastaría borrar cosas y listo pero, preferiría esperar por lo que dije antes, al estar en modo pruebas, no sabemos si eso será lo definitivo o cambiará algo.

Ese "coso" de las imágenes no es LightWindow sino una modal personal muy pequeñita que puse para cosas rápidas. Podría complicarse un poco y hacerla más sofisticada. Veremos ;-)

LightWindow es de las primeras que vi y en ese momento era la más flexible ya que había muchas para imágenes pero no para otro tipo de contenido. En este momento ya hay muchas más, incluso mejores pero cambiarla, por lo menos en este blog, sería un trabajo infernal.

Si mal no vi, LightWindow ha dejado de dar soporte o sea que, a menos que alguien retome el proyecto, terminará por ser obsoleta lo cual es una pena y me traerá dolores de cabeza :D

Graciela:
Ese tipo de calificación no parece estar contemplado pero en su caso, es muy atinado.

Las estadísticas me gustan, son lindas para mirar los dibujitos pero nunca hay que creerlas :D

Responder
Gem@  

Hay un detalle en las estadísticas que ha llamado mi atención y es la posibilidad de marcar si deseamos que no contabilice las visitas del propio autor, para eso Blogger debe añadir una cookie de bloqueo en el navegador. Igual ya lo habías visto pero yo siempre con retraso lo vi ayer mismo :S

Responder
Canovu  

Hola! Me gusto mucho el blog te he leido un poquitin y veo que eres un experto en el tema de los blogs. Me gustaria pedirte un gran favor:

¿Como hago para insertar un foro en un blog o subdominio propio tal y como hizo http://forum.icebreaker.com.br/?

De veras lo necesito, llevo mucho tiempo intentando hacerlo y quiero evitar el uso de iframes. IceBreaker lo incluyó sin iframes...

Te estoy muy agradecido.

Responder
Anónimo  

@JMiur Uy eso de Lightwindow no me agrada, creo no tener tantas entradas usándolo, ¿qué otra mejor recomiendas?, a ver si me animo. :S

Responder
DB THE LEGEND  

hola para lo del foro yo uso http://www.nabble.com/ q permite incrustarlo al blog ej yo lo puse en una pagina y se ve bien

http://bofocat.blogspot.com/p/foro.html

solo te registras escojes el tema de tu foro
una ves que ya estas adentro vas a dond dice options/embedding option y ahi te da el codigo para que lo pegues dond quieres que salga tu foro
suerte espero q t ayude

Responder
JMiur  

Gem@:
Eso es bastante normal, muchos servicios de estadísiticas tienen la misma opción. Sin duda, usan alguna cookie aunque en el caso de Blogger imagino que debe usar la misma que se emplea para mantenerse logueado.
acabo de ver que las estadísiticas ya salieron de Blogger Draft, no el gadget sino la pestaña.


Administrador:
En el caso de esa página creó un foro acá: http://www.forumeiros.com/um-forum-gratis. Desconozo si el sitio tiene un hosting propio o no, si es así, pudo haber creado un subdominio.

No es el único sistema, hay muchos servicios que ofrecen foros gratuitos y no se insertan, son sistemas separados y se enlazan. La URL dependerá de cada caso.

ozvaldO:
No hay recomendaciones, todo es subjetivo; hay decenas de ventanas modales de todo tipo. Son elecciones personales.

Responder
Anónimo  

Tengo una pregunta. En la plantilla de mi blog de pruebas (http://etbpruebas.blogspot.com/) hay una seccion de codigo que hace que las imagenes se alinien a la izquierda. Y cuando quiero usar esta plantilla en otro blog, me desacomoda todas las imagenes (aunque tengan su propio renglon de codigo de alineacion).

¿Podria por favor decirme que parte del codigo es? Para eliminarla.

Responder
Joel  

Nada nuevo :P.. aunque lo de entradas populares me puede servir de algo :D

Responder
JMiur  

Don Choky:
¿A ver si entendí?
En esa plantilla, las imágenes de los posts no se alinean a la izquierda sino que flotan siempre ye so no es bueno porque pierdes flexibilidad; eso está en esta parte, deberías eliminar ésta propeidad:

entry img {
.......
float:left;
}

Fíjate que también tienen borde, fondo, padding y márgenes asi que cualquier otro detalle que te moleste, también lo cambias ahí o lo eliminas.

Responder
Emerald  

:o sonamos!! que no se caiga LightWindow que mi blog está lleno de sus efectos!!!
por una vez que aprendí uno ahora lo vuelan!! :D

Responder
JMiur  

No se preocupe ... por ahora seguirá un buen rato :D

Responder
Admin  

Mira cuando vengo a encontrar esta entrada...Hace unos día ya que lo vi en lo de Rosa y estoy usando en tres blogs en gadget de Entradas populares, pero en uno de ello no queda bien porque la sidebar es angosta (Te Propongo) y se ensima el texto con el borde de la sidebar, entoncés opté por poner sin resumen, tampoco queda bien :S ahí si todo centrado pero bien feo :(
Se podría poner esa parte de código que decís en el otro gadget para centrarlo? Creo que no me explico... el código que decís para centrar el de las estadisticas, ponerlo en el de entradas populares, se centraría con eso? Y de ser así donde se pone?
Porque sospecho que si lo centro le puedo poner el resumen, y con resumen en los otros blogs me queda bien, claro que no están centrados pero igual se ven bien por muy grande que sea :O

Y otra cosa a modo de información, a mi me coinciden las populares con las que mas veo que la gente lee, tanto en la pestaña de estadisticas como en el Feedjit...

Responder
JMiur  

Lo que veo en ese gadget es que todo está centrado, k_nelita.

Responder
Admin  

El gadget original está centrado? Entonces si la sidebar es angosta no queda bien, no hay alguna solución? En los blogs con sidebar ancha queda bien con el resumen y la miniatura, pero si es angosta se desfigura :S

Responder
JMiur  

Parece que está centrado cuando n otiene un resumen de las entradas. Ahora, lo veo distinto a como lo vi antes ya que aharoa se ve el resumen. En ese caso, no se centra. Hay muchas propeidades que deberían cambiarse para hacer algo pero n osé cuñal es la idea final del diseño. Por ejemplo:

#PopularPosts1 li {
font-size:12px;
line-height:1.2em;
margin:0;
padding:10px 0;
text-indent:0;
}
#PopularPosts1 .item-title {
font-size:13px;
padding:0 0 10px 0;
clear:both;
text-align:center;
}
#PopularPosts1 .item-thumbnail {
float:none !important;
text-align:center;
}

Responder
Admin  

Ahí queda mucho mejor JM, pero lo ideal sería que quedara el título primero, después la miniatura y al lado el texto, ya lo cambié de lugar (al css) para arriba, para abajo pero no consigo el efecto deseado :S

Me gustaría que la miniatura quedara de costado como en un post, (le puse left en lugar de center), pero al lado el texto, y no, el texto se va hacia abajo :(

Tal vez no me expliqué bien cuando dije centrar, no me refería exactamente a que quedara todo en el centro sino que no se ensimara el texto a las miniaturas y al costado de la sidebar...
No se si me explico bien... :o

Responder
Admin  

Ya lo arreglé JM, le saqué las miniaturas y el resumen, solo quedaron los títulos así ocupa menos espacio y con los estilos que me diste queda bien, sin ensimarse con los costados de la sidebar.
Aunque hay un poco de separación entre los títulos, se ve bien :)
Mil gracias ;)

Responder
Lluís Hoffman  

a mi no me funciona muy bien , no quiero poner imágenes ni texto pero aun así me sale solo, supongo que es un error, se puede solucionar con el codigo HTML?
Saludos

Responder
JMiur  

Como está en modo de pruebas es posible que ciertas cosas no funcionen o lo hagan de manera errática así que habrá que esperara hasta que no esté agregado definitivamente.

Responder
Lluís Hoffman  

Gracias :D

Responder
Administrador  

HOLA! ¿Me podrías resolver una duda que me está poniendo de muy mal humor?

Tengo un blog que he hecho con una plantilla ya diseñada y que he retocado, y me va bien.
Pero precisamente el widget de entradas populares me está dando problemas.

http://lascancionesdelatele.blogspot.com

donde pone "Lo + visto", ¿porqué la imagen de la flechita azul se me pone con el título encima, en vez de dejar un espacio como en los demas widgets ("canciones de..." y "Lo último", por ejemplo)

Gracias de antemano

Responder
JMiur  

Eso ocurre porque todas las etiquetas LI tienen una imagen de fondo con propiedades genéricas y en ese gadget, Blogger agrega sus reglas de estilo propias así que deberás sobrescribirlas.

Por ejemplo, agregando esto en el CSS:

.PopularPosts .widget-content ul li { padding: 6px 0 6px 12px; !important}

para que tengan el mismo estilo que las otras listas.

Responder
Administrador  

Conseguido! Eres un CracK!

Responder
Ricardo Enriquez Caro  

Hola man queria hacerte una pregunta en referencia al tema de entradas populares, bueno soy nuevo en esto quizas e modificado algo pues mis entradas populares al principio marchaban bien tenia 5 temas aparecian 5 en la entradas ,.. pero ahora tengo 10 y 5 las 5 entradas mencionadas . no se lo que tengo que hacer .. quizas puedas ayudarme.. gracias

Responder
JMiur  

No entiendo la pregunta, aclárame un poco.

Responder
Sermartin  

Hola Jmiur, queria preguntarte para este caso si quiciera darle una alineacion automatica vertical al texto con respecto a las miniaturas, como podria hacerlo?

JMiur  

Tendría que ver tu ejemplo a evr si eso es posible pero, no suele ser sencillo. La únca forma seguroa d conseguirlo es usar una tabla.

Sermartin  

ah claro es este jmiur http://dmbeta.blogspot.com/

JMiur  

Podrías intentar con una regla así:

.PopularPosts .item-title {
display: table-cell;
height: 72px;
padding: 0;
vertical-align: middle;
}

debería funcionar incluso en IE8

Sermartin  

mil gracias jmiur quedo re bien!
Un saludo grande

Sermartin  

a proposito jmir, tengo un problema en una plantilla que en la parte de diseño no me muestra la seccion de la sidebar para agregar elementos aun estando delimitada en html.
Asi se ve en diseño, este es el blog: http://goo.gl/gHpbh
Hay alguna solucion jmiur?

JMiur  

Tendrías que fijarte si la sección no está bloqueada en el código HTML.

Sermartin  

por lo que veo no jmir, aqui es la parte del codigo http://goo.gl/LFAi1 (ya usando drive je)

JMiur  

En esa parte del código no se ve el tipo de bloqueo al que me refiero que sería algo así:

<b:section class='XXXXX' id='XXXXX' maxwidgets='1' showaddelement='no'<

Sermartin  

mm.. busque con los elementos compartidos ye sto es lo que encontre http://goo.gl/dZkA8 pero nada referido a maxwidgets jmiur, no se que parte puedo cambiar. un saludo

JMiur  

La sección de la sidebar parece normal, la que está bloqueada es main pero ese no es el problema:

<b:section class='main' id='main' showaddelement='no'>

¿Has probado agregar algo manualmente para ver si eso muestra la sección? Lo digo porque tal vez está allí pero no es evidente. Por ejemplo, en el HTML cambias esto:

<b:section class='sidebar' id='sidebarright' preferred='yes'/>

por esto:

<b:section class='sidebar' id='sidebarright' preferred='yes'>
<b:widget id='Label99' locked='false' title='EJEMPLO' type='Label'/>
</b:section>

de ese modo agregar un gadget de etiquetas que luego puedes eliminar del mismo modo, borrando esa línea.

Responder
Sermartin  

Jmiur, empeze a comparar con otro blog con la misma plantilla y note que toma como sidebar una secion inferior en la parte de diseño, un poco engorroso pero bueno estas plantillas je, muchas gracias por preocuparte.
A porposito, estoy ajustando los titulos de la sidebar, quiero aumentar el alto pero que los textos se mantengan centradas horizintal y vertical, al parecer lo logre pero no asi la altura.
Actualize el adjunto anterior con esa parte de codigo por las dudas.
Saludos jmiur.

JMiur  

La posición de la sección en la página de diseño puede ser modificada con CSS; suele ser engorroso pero, es posible ya que tiene propiedades especiales que n oafectan al blog en si mismo; por ejemplo::
body#layout #sidebarright {}

vertical-align no funciona de ese modo pero debería ver el ejemplo concreto ya que no sé a qué te refieres con alinear verticalmente ¿alinear con respecto a qué?

Sermartin  

voy a probar ello jmiur y le comento si logre algo, gracias.
El blog en que estoy aplicandolo es este http://goo.gl/gHpbh.
me referia a alinear el texto del titulo, creo que quedo alineado, lo que no logro es que el ancho de sidebar h2 aumente, probe agregandolo la propiedad height pero no surgio efecto.

JMiur  

No sé exactamente qué resultado quieres obtener pero, vertical-align no tiene ningún uso práctico en esa regla así que puedes eliminar la propiedad.

Si quieres separar el texto de los bordes, usa padding, algo como esto:
paading:10px 0;

Responder
Sermartin  

tenias razon jmiur, borre algunas propiedades que estaban de mas y solo aplique esa y quedo re bien, muchas gracias.
Por ahora creo que no tengo consulta, cualquier cosa me veras visitandote je.
Espero pronto verlo por google plus asi lo agrego.
Saludos!

JMiur  

Perfecto, Martin.
En realidad, allí estoy pero .. no lo uso :-D

Responder
Anónimo  

Hola, me gustaría que pudieses resolver un problema que me ha surgido. Tengo el gagdet activo, pero las imágenes en miniatura no se ven y tengo activada la opción de 'imagen en miniatura' ¿Qué puedo hacer? Gracias.

JMiur  

No sé cuál es el blog al que te refieres. Puede ser que haya algún detalle de diseño o , lo más probable, es que Blogger no detecte esas miniaturas.

Responder
Anónimo  

El blog en cuestión es este: http://mundodeporteysalud.blogspot.com.es/ He probado varias plantillas diferentes y siguen sin aparecerme las imágenes.

JMiur  

Lo que se ve es que Blogger no detecta esa imagen, salvo en algunas entradas. Desde el navegador, usando CTRL+U puedes ver el código feunte y allí, debería verse una etiqueta similar a esta:

<link rel="image_src" href="xxxxxxxxxxxxxx" />

donde xxxxxxxxxxxxxx sería la url de la miniatura a mostrar, tanto en ese gadget como en otros.

Es probable que, como estás usando muchas imágenes de otros sitios, el acceso a ellas sea restringido o Blogger las ignore:

http://www.okdietas.com/images/te_verde3.jpg
http://simpleyproductivo.files.wordpress.com/2010/12/beber-agua.jpg
http://matasanos.org/wp-content/uploads/2011/07/vs1.jpg
http://el_blog_de_coogar.zonalibre.org/Dormir.jpg
http://estaticos.elmundo.es/elmundodeporte/imagenes/2012/09/27/ciclismo/1348770032_0.jpg
http://semanacincuentaydos.files.wordpress.com/2012/01/dominadas.jpg

No deberías hacer hotlink a imágenes de otros sitios; en el futuro, deberías alojarlas en el mismo Blogger para evitar problemas.

Anónimo  

Gracias por tu consejo. Ahora ya no hago hotlink y las subo desde el ordenador. Ahora ya si se ven en el gadget Entradas populares. ¡Muchas gracias de verdad!

JMiur  

Perfecto, Javier.

Responder
Yurika-Chan  

Hola JMiur de nuevo yo, hace unos días encontré este blog http://japonismo.com/

Me gusto la forma en que muestra las entradas más vistas, pero es claro que es un plugin de Wordpress, mi pregunta es, se puede adaptar a blogger, no me interesa el zoom al pasar el mouse, solo que muestre una parte de la imagen, el titulo de las entradas y tal vez la fecha

Gracias de antemano

JMiur  

Sólo puedes usar los gadgets de Blogger o de estadísticas de terceros ya que no tienes forma de acceder a los datos.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR