0

Top de comentaristas (Investigando)

Habréis visto que he colocado un widget en la sidebar del Escaparate con un top de comentaristas, o lo que es lo mismo, una lista de las visitas que más comentan. En realidad no me gusta demasiado como funciona, pues va tomando sus datos de los últimos comentarios y no de todos los que hay en el blog y además vincula cada nombre al ultimo comentario que ha hecho, pero mientras encontramos algo mejor creo que algo de esto nos servirá:

Usando mi copia de Yahoo Pipes

Está hecho usando Yahoo Pipes un servicio que proporciona Yahoo para trabajar con cualquier tipo de feeds.
En un principio intenté guiarme por las explicaciones de Assess My Blog pero a pesar de seguir sus indicaciones a "rajatabla" no conseguía que mi propio nombre no se mostrara en el listado de comentaristas, así que decidí investigar por mi cuenta eso de "Yahoo Pipes" y al fin conseguí crear mi propia "pipe" para los comentaristas, que filtrara mis propios comentarios.

Si a alguno le interesa profundizar en el tema de las Pipes de Yahoo, en El Módem han publicado un excelente tutorial en tres partes.
En Pisito en Madrid encontraréis otro también muy completo.
Jesús Conde nos ofrece un video-tutorial. espectacular.


[1] El primer paso será ir a la página de Yahoo Pipes y pinchar en el menú donde dice "Create a Pipe" si aún no tenéis una cuenta en Yahoo, os pedirá que la creéis, si ya la tenéis introducís vuestros datos.

[2] Una ves estéis logeados en Yahoo, tendréis que ir a la pipe que yo he creado para el top de comentaristas, pinchando en este enlace: Top comentaristas Blogger. Veréis una página como esta:

Yahoo Pipes
[3] Como se puede ver en la imagen anterior, pincharéis en "Clone" para conseguir una copia de mi pipe que se añadirá a vuestra propia página de Yahoo Pipes de forma automática, con el nombre de "Top comentaristas Blogger Copy".

[4] Una vez obtenida la copia, pincháis en "Edit Source" y accederéis a la página de edición de la Pipe que acabáis de copiar.
Saldrá una especie de diagrama. Arriba del todo localizáis un módulo que se llama "Fetch Feed":
Feed Fetch
[5] En la casilla donde está incluido el feed para comentarios del Escaparate ponéis vuestro propio feed de comentarios, borrando antes el mio, claro está:

http://Nombre_del_blog.blogspot.com/feeds/comments/default?max-results=1000

Algo más abajo localizáis el modulo llamado "Filter" y cambiáis donde dice "Rosa" por el nombre con el que publicáis en vuestro blog:

Filter
[6] Una vez hechos los cambios pincháis en "Save a Copy" arriba a la derecha, y una vez "salvada" la copia veréis arriba del todo "Pipe Saved, Run Pipe", pincháis ahí. Se abrirá entonces una ventana con vuestra propia Pipe, donde veréis la lista de vuestros comentaristas:

Get as RSS
[7] Pincháis en el icono RSS de color naranja y en el despegable que se abrirá copiamos usando el botón derecho del ratón, la ruta del enlace en"Get as RSS".

[8] Ahora solo tendréis que pegar la ruta del enlace en un nuevo elemento "Feed" en vuestro blog, con lo que si todo ha ido según lo previsto, tendréis el top comentaristas en vuestra sidebar con los cinco comentaristas más activos.

[9] Haciendo algunas de mis pruebas he notado que en algunas ocasiones Blogger no admitía la url del RSS de Yahoo Pipes y en otras si (misterios de Blogger), así que yo he usado un servicio online para la creación del widget, lo que me permite además añadir mas de cinco comentaristas a la lista.
Se trata de Feed2JS,donde solo tenéis que incluir la misma ruta del enlace anterior (paso [7]) y escoger el número de comentaristas a mostrar en Number of items to display, lo demás lo dejáis tal cual está, pincháis en Generate JavaScript y colocáis el código obtenido en un nuevo elemento HTMLJavascript.


Añadir la lista de comentaristas directamente mediante un widget

Más fácil imposible, Amanda de Blogger Buster nos proporciona el top de comentaristas mediante un widget de instalación directa. Incluimos en su formulario el título de nuestro elemento y la dirección del blog y en segundos tendremos la lista en el blog.

Blogger Buster

Una vez instalado en el blog, si pinchamos en "editar" del elemento, veremos en su código justo detrás de la url de nuestro blog &num=10, esto es lo que hace que se muestren 10 comentaristas en la lista, para mostrar más o menos cantidad, tendremos que cambiar ahí el valor.

Añadiendo el código Javascript necesario en un elemento HTML

Simplemente tenéis que añadir este código en un nuevo elemento HTML-Javascript y cambiar donde dice NOMBRE_DEL_BLOG por el nombre del vuestro. Además podéis escoger el número de comentaristas a mostrar donde dice com&num=10 cambiando el número por el que queráis.
Este código también usa una Pipe de Yahoo y como en el anterior saldrán los comentarios del autor del blog, la diferencia con los otros es que usa el total de los comentarios del blog para mostrar los resultados.
<script type="text/javascript">
function pipeCallback(obj) {
document.write("<ol>");
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write("</ol>");
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&
_id=c92ac21897d8b56e61cfa85930dd89a1&url=http%3A%2F%2FNOMBRE_DEL_BLOG.blogspot.com&num=10" type="text/javascript"></script>

0

Ideas para plantillas

Así lleva por título el último blog creado por mi amiga Eulalia.

En Ideas para plantillas podéis ya encontrar un buen surtido de plantillas "tuneadas" (como a ella le gusta decir) por ella misma. Son diseños muy agradables partiendo de las plantillas de Blogger, por lo que no tendréis ningún problema para cargarlas en vuestro blog.
Las hay de dos y tres columnas.
Las pone a vuestra disposición de forma gratuita y en descarga directa, además de ayudaros de "mil amores" en cualquier problemilla que pudiera surgir, incluso puedes solicitarle algún cambio en particular a través de su email.

Plantilla EulaliaPlantilla Eulalia

¡Buen trabajo Eulalia!

0

Link a tu blog mediante un widget

Con este método proporcionamos a nuestros visitantes un botón de enlace de nuestro blog, para que lo coloquen en el suyo.
El botón se añadirá con el mismo sistema de añadir un widget de forma automática.

[1] En primer lugar hemos de tener creado un botón de enlace de nuestro blog. Si aún no lo tienes y quieres uno rápido y fácil, puedes visitar Cool Text.

[2] Subimos el botón a un alojamiento de imágenes y copiamos su url (dirección).

[3] En nuestra plantilla - añadir nuevo elemento, escogemos un elemento Html-javascript y pegamos este código:

<img src="URL DE TU BOTON"/>
<form action="http://beta.blogger.com/add-widget" method="POST">
<input value="FAVORITO" name="widget.title" type="hidden"/>
<textarea style="display:none;" name="widget.content">

<a href="URL DE TU BLOG"><img src="URL DE TU BOTON" alt="TITULO DE TU BLOG"></a>

</textarea>
<input
value="http://buzz.blogger.com" name="infoUrl" type="hidden"/>
<input
value="http://www.blogger.com/img/icon_logo32.gif" name="logoUrl" type="hidden"/>
<input value="Enlaza mi Blog" name="go" type="submit"/>
</form>

Sustituimos lo que está en mayúsculas por nuestros propios datos.
Donde pone "Enlaza mi Blog" también podemos poner lo que queramos, teniendo en cuenta que eso es lo que se verá escrito en el botón que saldrá en nuestra sidebar:

Cuando un visitante de nuestro blog desee enlazarnos, solo tendrá que pinchar en ese botón y seleccionar el blog donde ha de salir nuestro enlace y el título que va a ponerle (puede dejarse sin titulo):



Nuestro botón de enlace aparecerá de forma automática en el blog del visitante, solo tendrá que arrastrarlo donde mejor le parezca.

0

Sistema de visitas y estadísticas Google Analytics

Google Analytics es un completísimo sistema de estadísticas que Google proporciona de forma gratuita, y con el que podremos obtener detallados informes sobre el número de visitas de tu blog, número de páginas que esas visitas han visto, la media de tiempo que cada visita permanece en el sitio, ruta de entrada de las visitas (desde un buscador, desde otra página o tecleando directamente la dirección del blog), navegadores y sistemas operativos que utilizan para entrar a nuestro blog, las palabras que han utilizado en los buscadores para llegar al blog, páginas que nos enlazan y desde las que nos han llegado visitas, partes de nuestro sitio que son las más visitadas...

[1] Para empezar a utilizarlo, el primer paso será acceder a su página de registro, una vez allí observamos que hay dos opciones. Si ya tenemos una cuenta de Google, lo único que hemos de hacer es identificarnos con los datos de la cuenta. Si no la tenemos, la crearemos rellenando un formulario de datos.
Una vez obtenida la cuenta, podremos acceder al sistema de nuevo, ingresando nuestra dirección de correo y la contraseña.

Paso uno
[2] Una vez nos hayamos registrado e identificado, aparecerá una nueva pantalla, pulsaremos en el botón "Regístrese" para dar de alta nuestro blog.

Paso dos
[3] En la siguiente pantalla especificaremos la dirección de nuestro blog, un nombre que lo identifique, el país desde donde lo publicamos y la zona horaria. Pulsamos en Continuar.

Paso tres
[4] El siguiente paso será apuntar nuestro nombre, apellido, un teléfono de contacto (opcional) y el país donde residimos. Pulsamos en continuar.

Paso cuatro
[5] En la siguiente pantalla nos proporcionan información sobre los términos de servicio y una vez aceptados (marcando la casilla) pulsamos en "Crear una cuenta nueva".

Paso cinco
[6] A continuación aparece una caja con un código. Pinchamos arriba en Código de seguimiento nuevo (ga.js) y veremos un nuevo código, que es el que deberemos copiar y pegar en nuestro blog justo antes de </body> para que el sistema de análisis funcione correctamente.
Lo mejor será dejar abierta esta ventana del explorador mientras incluimos el código en nuestro blog.

[7] Una vez pegado el código en el blog y guardados los cambios, volvemos a la página de Google Analytics. En la siguiente página ya podemos pulsar en el botón de "Comprobar estado" para saber si el sistema se ha instalado correctamente y si empiezan a llegar los primeros datos sobre nuestro sitio.

Paso seis
Tendremos paciencia ya que lo más probable es que tarde cierto tiempo en recopilar los datos. Casi que os recomendaría comprobar los resultados al día siguiente...

Paso siete

0

Detectar el navegador de tus visitas con CSS

Este truco está basado en una de las características de IExplorer ya que este navegador interpreta los comentarios precedidos de doble barra, por lo que cualquier cosa seguida por // lo entenderá como parte del código.
He construido unas líneas de CSS para que cuando un usuario del blog llegue a nuestra página usando IExplorer, se muestre un mensaje que le dice que está usando IE, animándole además a cambiarse a Firefox. Si nuestra visita no está usando IExplorer, mostrará un mensaje distinto que le felicitará por su decisión de no usar IExplorer.
Por descontado que respeto a todas mis visitas por igual, usen un navegador u otro, esto no es más que un ejemplo para que se entienda el funcionamiento.

Este es el código CSS, donde podemos hacer las modificaciones que estimemos oportunas, color de fondo, del borde, tamaño del mensaje, margenes, etc.
Recordad que todo lo que esté precedido por la doble barra (//) será interpretado por IExplorer.

#otros, #paraie{
margin: auto;
margin-top: 20px;
width: 450px;
padding: 0 0 0 20px;
background-color: #efeff7;
border: 1px solid #a6c4e1;
//background-color: #ffffcc;
//border: 1px solid #cc0000;
}

#otros{
//display: none;
}

#paraie{
display: none;
//display: block;
}

Y esto es lo que colocaremos en el elemento HTMLJavascript o donde queramos mostrar el efecto. Dentro de las etiquetas div's se puede poner cualquier cosa que se desee mostrar(imagen, texto, publicidad), yo he añadido unos iconos que obtuve en Iconlet y un enlace para descargar Firefox:
<div id="otros"> Tu no estas utilizando Internet Explorer.... ¡Bien por ti!.... <img src="http://img99.imageshack.us/img99/3091/facewinkwo5.png"/></div>
<div id="paraie"> Tu estas utilizando Internet Explorer....¡Mejor con Firefox!.... <a href="http://www.difundefirefox.com/descargar-mozilla-firefox-gratis"><img src="http://img99.imageshack.us/img99/313/firefoxsd7.png"/></a></div>

Con IExplorer:

Con IE
Con otro navegador:

Con otros navegadores

0

Efecto Rollover para tus imagenes online

Generador
En unos minutos conseguiremos un bonito efecto rollover (la imagen cambia por otra cuando el ratón pasa por encima) para nuestras imágenes.

[1] Hemos de tener las dos imágenes del mismo tamaño subidas a un alojamiento de archivos, ya que necesitaremos sus direcciones (url).

[2] Accedemos a la página del generador en Creating online, pinchamos sobre el logo de la llave (open generator) y completamos los campos.

[3] En el primer campo hemos de colocar el enlace al que llevará nuestra imagen (opcional). En el segundo, la url de la imagen que se mostrará antes de pasar el ratón por encima, y en el tercero la imagen que veremos al pasar el ratón sobre la anterior. Fijaros que en todos los campos tenemos que ingresar las urls sin http://.

[4] Pinchamos en "Generate My Code", copiamos el código resultante y lo pegamos donde vamos a mostrar el efecto, una entrada o la sidebar, funciona en ambas sin problemas.
Tendremos en cuenta que el código no puede usarse más de una vez, es decir, no podemos pegar uno en la sidebar, y el mismo en una entrada, porque no funcionarían, pero si podemos volver a hacerlo cuantas veces queramos con distintas imágenes, he incluso usando las mismas pero con distinta url (volviendo a re-alojarlas).

Ejemplo:

0

S.O.B. (Save Our Blogs)


Me he encontrado de forma casual en el blog de Gaby, con esta linda iniciativa. Vi el monstruito luciendo en su sidebar y decidí seguir su rastro...
Nacho Gómez es el diseñador y creador de los Blogsaver, unos fantásticos monstruitos que no tienen más intención que la de ayudar a nuestro blog, animando a nuestras visitas a dejar sus comentarios.



Leo en su blog:

La muerte de un blog se produce por la falta de comentarios.
Muchos visitantes no se dan cuenta de que sus comentarios son VITALES para la supervivencia de un blog.
¡SALVA TU BLOG! Descárgate el Blogsaver que quieras, copiando su código html y pegándolo en la barra lateral de tu blog (estaría muy agradecido si me lo hicieras saber mediante e-mail o comentario).
¡Pronto habrá más Blogsavers!

Aunque Nacho promete pronto más Blogsavers, actualmente podemos encontrar en su blog varias versiones: italiano, francés, inglés, castellano y catalán, todas ellas a escoger en dos colores, oscuro (dark) o claro (light).

¿No son una monada? biggrin