0

Mensaje animando a suscribirse a tu blog

Un mensaje para mostrar a tus visitas animándoles a suscribirse a tu blog.
Supongo que ya habréis visto el que uso en El Escaparate y que solo es visible cuando accedemos al blog desde alguna de las páginas de archivos o etiquetas.

Mensaje de suscribe
El mensaje puede configurarse fácilmente mediante CSS personalizando su aspecto para conseguir que se adapte a la estética de cada blog, modificando el borde, colores, imagen o no de fondo, etc.

[1] Añadimos el CSS necesario en nuestra plantilla, siempre antes de ]]></b:skin>

.subscribe_cartel {
background: #ffc url(Aquí_la_url_de_la_imagen_de_fondo);
border: 1px solid #a6c4e1;
padding: 5px;
margin: 0 2px;
font-size: 90%;
}
.subscribe_cartel a {
text-decoration: none;
}
.subscribe_cartel a:hover {
text-decoration: underline;
}

Es en este código donde haremos los cambios oportunos para modificar el aspecto del mensaje:

background: #ffc url(Aquí_la_url_de_la_imagen_de_fondo);
Añadiremos la url de la imagen que queremos mostrar en el fondo del mensaje.
Si hemos decidido no usar una imagen y solo vamos a darle un color de fondo, dejaremos así esa línea: background: #ffc; cambiando el código por el del color que vamos a usar: Tabla de colores.

border: 1px solid #a6c4e1;
Aquí controlamos el aspecto del borde de nuestro mensaje.
Si hemos decidido no añadirle ninguna clase de borde, podemos eliminar esta línea o poner el borde en cero (0px) por si más tarde decidimos añadírselo.
Si vamos a usar nuestro mensaje con borde, escogeremos el grosor de dicho borde, modificando el "1px" por el valor que necesitemos. En "solid" conseguiremos el aspecto del borde: solid, dotted, dashed, double, etc. En "#a6c4e1" cambiamos el color del borde.

padding: 5px; margin: 0 2px;
Aquí variamos la distancia de lo que coloquemos dentro de nuestro mensaje a sus bordes "padding" y la distancia de nuestro mensaje al resto de los elementos que lo rodean "margin", lo ideal es que cada uno encuentre los valores que necesite, aunque pueden dejarse como están, al menos para la primera prueba.

font-size: 90%;
El tamaño del texto. Cambiamos el valor del porcentaje por el nuestro, mayor o menor.

Tamaño del mensaje
Si dejamos el código CSS tal como está, el tamaño del mensaje se adaptará al del lugar donde lo coloquemos. Si, por ejemplo, lo situamos en un elemento sobre las entradas, el mensaje ocupará el mismo ancho que estas, si queremos controlar su anchura, añadiremos width:300px;, o el valor que queramos para el ancho, por ejemplo, justo debajo de .subscribe_cartel {.

[2] Una vez tengamos el aspecto del mensaje más o menos decidido, hemos de usar el código HTML necesario donde vamos a mostrar el mensaje (dentro de un nuevo elemento HTML que arrastraremos luego a donde nos interese, por ejemplo, sobre las entradas.)
<div class="subscribe_cartel"><img src="URL_DE_LA_IMAGEN"/> Tu primera visita al Escaparate? <div align="center">Quizás te interese <a href="URL_DE_TU_FEED">subscribirte a mi feed</a> o recibir las<a href="URL_DE_SUSCRIPCION_POR_EMAIL"> actualizaciones por email.</a></div></div>


En "URL_DE_LA_IMAGEN" colocaremos la url de nuestro icono de suscripción.
En "URL_DE_TU_FEED" la url de Feedburner o del servicio que usemos para facilitar la suscripción. Si no usamos ningún servicio externo, colocaremos aquí el de Blogger:
http://Tu_blog.blogspot.com/feeds/posts/default
En "URL_DE_SUSCRICIPCION_POR_EMAIL" la del servicio que usemos para facilitar la suscripción por correo.

[3] Guardamos los cambios en el nuevo elemento y lo arrastramos encima o debajo de nuestras entradas; también podemos dejarlo en la sidebar.
Localizaremos ahora nuestro nuevo elemento dentro del código de la plantilla y haremos los cambios necesarios para que solo sea visible en las páginas de archivos y etiquetas, para ello vamos a necesitar expandir los artilugios y seguir las instrucciones que se explican en esta entrada anterior.

0

Avatares glamurosos

Una bonita colección de cien avatares animados. Todos los avatares tienen la misma medida 100x100 pixeles y estoy segura que a las chicas sobre todo les van a encantar, aunque hay algunos algo "subiditos de tono" que no van a pasar desapercibidos para los chicos.eek

Son ideales para usarlos en la imagen de nuestro perfil del blog o en el perfil de alguno de los foros en los que participamos a menudo.

Algunos ejemplos



Enlace:Dezignus

Descargar desde Deposit
Descargar desde Rapidshare

Nota
Si tenéis problemas con la descarga podéis solicitarme el archivo zip por email.

0

Comprueba online la validez de cualquier email

Solo con introducir la url de la dirección de correo que quieras en la web de Emailvalido podrás comprobar si ese email que tienes hace tiempo de algún contacto sigue siendo operativo o no.



Una vez introducido el email, en segundos obtendremos la verificación:



Emailvalido además ofrece la posibilidad de agregar este servicio a nuestro blog, usando uno de los dos códigos disponibles según el modelo de widget que queramos usar, así nuestras visitas tendrán la posibilidad de usar el servicio de comprobación desde nuestro blog.



Enlace: Emailvalido Vía: Xyberneticos

0

Simple menu con CSS

Un sencillo menú construido mediante CSS y usando solo una imagen.

Ejemplo de menu
[1] Colocamos las líneas de CSS dentro de nuestra plantilla antes de ]]></b:skin>:

#nav-menu ul
{
list-style: none;
padding: 0;
margin: 0;
}

#nav-menu li
{
float: left;
margin: 0 0.15em;
}

#nav-menu li a
{
background: url(http://img410.imageshack.us/img410/9401/cssnavbm2.gif) #fff bottom left repeat-x;
height: 2em;
line-height: 2em;
float: left;
width: 6em;
display: block;
border: 0.1em solid #dcdce9;
color: #0d2474;
text-decoration: none;
text-align: center;
}

/* Hide from IE5-Mac \*/
#nav-menu li a
{
float: none
}
/* End hide */

#nav-menu
{
width:30em
}


[2] Añadimos el código necesario para construir los enlaces del menú en un elemento HTML de la plantilla y lo arrastramos sobre las entradas o debajo de la cabecera:
<div id="nav-menu">
<ul>
<li><a href="http://elescaparatederosa.blogspot.com">Inicio</a></li>
<li><a href="mailto:lejaniaimposible@hotmail.com">Contacto</a></li>
<li><a href="http://blogger.com">Blogger</a></li>
</ul>
</div>

[3] En este último código es donde tenéis que colocar vuestros propios datos para construir los enlaces.
En el ejemplo hay solo tres botones, pero pueden añadirse más, duplicando las líneas del código y añadiendo los datos del enlace:
<li><a href="Url_del_enlace">Enlace</a></li>

0

Generador de "nombre de calle"

Un generador online que al introducir el texto que queramos nos lo devuelve imitando una placa o señal con el nombre de una calle o ciudad. Podemos escoger tres tamaños, pequeño, mediano y grande; descargar el resultado directamente a nuestro PC o subirlo desde allí mismo a ImageShack.
El tamaño pequeño queda muy lindo incluso para usarlo como botón de enlace.
Es una pena que no pueda elegirse otro color...



Enlace: EasyStreet

0

Redireccionar el blog

Recuerda
que aunque yo pruebe los "trucos"
antes de hacer ningún cambio
GUARDA SIEMPRE TU PLANTILLA
Nunca es seguro
que todo salga bien...
Con un sencillo script lograremos que nuestras visitas sean llevados a la página que nosotros queramos.
Esto es muy útil, por ejemplo, si alguna vez "trasteando" tu plantilla (como me ha pasado a mi, en más de una ocasión) el blog se te ha ido "al garete". Necesitas tiempo para acomodar de nuevo tu blog, pero no quieres perder a tus visitantes asiduos ni tampoco que estos vean el "desastre", así que mientras arreglas el desaguisado puedes optar por dirigirlos a otro sitio. Me explico:

[1] Creas un blog nuevo (como cuando haces uno de pruebas) y en este blog pones una sola entrada con cualquier foto o texto "En Construcción" o el mensaje que estimes oportuno.

[2] Guardas la url (dirección) de ese nuevo blog.

[3] En tu blog "de verdad" pones este script justo después de <body>
<script>
location.href='URL DEL BLOG EN CONSTRUCCIÓN';
</script>

Esto hará que cuando entren a tu blog el navegador les lleve directamente al blog en "Construcción".
Mientras tu sigues como siempre arreglado el blog "real", eso si, acuérdate de retirar el script cuando termines el trabajo en tu blog "real".
¡Suerte!

0

Widget que identifica a tus visitas

Cuando una de tus visitas acceda al blog, verá un mensaje que le muestra su dirección IP, el sistema operativo que está usando, su país de procedencia y el navegador que usa. El widget no es demasiado grande y podemos escogerlo en dos diseños, cuadrado y horizontal, los resultados se muestran en inglés, pero acompañados de unos iconos que no necesitan traducción alguna.
Podemos cambiar su tamaño, dentro del código en width= (ancho) y height= (alto).

Con forma de cuadrado
IP
Código

<a href="http://www.wieistmeineip.de/cometo/?en"><img src="http://www.wieistmeineip.de/ip-address/" border="0" width="125" height="125" alt="IP" /></a>

En horizontal
IP
Código
<a href="http://www.wieistmeineip.de/cometo/?en"><img src="http://www.wieistmeineip.de/ip-address/?size=468x60" border="0" width="468" height="60" alt="IP" /></a>


Enlace: Computer Bild

0

Me tomo un descanso

Pues así es. Me voy unos días de vacaciones aprovechando los días festivos de Semana Santa, mientras tanto los comentarios en El Escaparate permanecerán cerrados, espero que sepáis disculparme y perdonad las molestias que esto pueda causaros.
Al igual que vosotros yo también tengo una vida fuera del blog y uno de mis hijos viviendo lejos al que estoy deseando abrazar de nuevo...
Mientras regreso podéis consultar todo lo que necesitéis aquí y en los magníficos blogs de ayuda que podéis ver en el apartado "Blog de Ayuda" de la sidebar del Escaparate.
¡Un abrazo!
Vacaciones

0

Envios de emails al futuro

ApuntiEn Apumti.com ofrecen un sistema muy original para programar mensajes de correo online.

Solo hay que rellenar un sencillo formulario, con el destinatario, su email, asunto, cuerpo del mensaje...en fin, como cualquier email corriente, y escoger la fecha en la que será enviado,(hasta el 2099).
En la web te lo guardan y cuando llegue el día señalado lo envían por ti, ya no hay disculpa para olvidarnos de felicitar a alguien en su aniversario de boda, o su cumpleaños, por ejemplo.
Os contaré un secreto...yo me he enviado uno a mi misma recordándome una cita médica que tengo dentro de tres meses...¿Práctico o no?

0

Ver los comentarios de la entrada debajo del titulo


Recuerda
que aunque yo pruebe los "trucos"
Antes de hacer ningún cambio
GUARDA SIEMPRE TU PLANTILLA
Nunca es seguro
que todo salga bien...
Me pregunta Benjamin en un comentario la forma de hacer que los comentarios de las entradas se muestren debajo del título de las mismas.

[1] Iremos a la parte del código de nuestra plantilla y expandiremos los artilugios para localizar la parte de código que corresponde a los comentarios:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>

<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/>
<data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

[2] Tendremos que cambiar todo esa parte del código de su posición actual a justo encima de:
<div class='post-header-line-1'/>

Usamos la vista previa antes de guardar nada por si acaso...

Ejemplo de entrada

0

Picasion, crea tus gifs online

Leo en el blog de Key sobre esta herramienta oline que, como ella bien dice, es muy sencilla de usar.

Se pueden usar hasta diez imágenes distintas para crear nuestra propia imagen animada, subiéndolas directamente desde nuestro PC e incluso importarlas desde Flickr o Picasa.
Escogemos el tamaño que tendrá el gif y la velocidad de reproducción y, una vez creado, nos proporcionan el código HTML para pegarlo en el blog y una url directa a nuestra nueva imagen.

Yo he usado tres imágenes distintas para conseguir esta imagen animada. Para ser una "inútil total" con estas cosas, no me ha quedado mal del todo...

suscribe


Por cierto, que si alguien la quiere, este es el código para usarla:
<img src="http://picasion.com/pic1/69085d90e6569a0d9d9b47b31e158ed7.gif" width="120" height="175" border="0" alt="suscribe" />


Enlace: Picasion

0

Buscador de Blogger in Draft

Hace un par de días que cambié el buscador del Escaparate por el que proporciona Blogger in Draft y yan son varias las personas que se han interesado por la forma de obtener uno igual.
También he visto que muchos aún no saben que es exactamente el Blogger in Draft, así que he pensado matar dos "pájaros de un tiro" y explicar las dos cosas.

¿Qué es Blogger in Draft?
Es una versión de Blogger en la cual el equipo de Blogger va habilitando nuevas funcionalidades a modo de prueba. Para acceder a esta versión de Blogger, usamos los mismos datos que para acceder a nuestro panel de Blogger "normal", y una vez dentro lo usamos exactamente igual que hacemos en Blogger. La única diferencia es que a la hora de añadir un nuevo elemento a nuestra sidebar, veremos algunas opciones que en el otro Blogger no están disponibles aún.
Podría decirse que Blogger in Draft es como un laboratorio donde se prueban nuevas funcionalidades antes de sacarlas definitivamente al público.

Buscador de Blogger
Accedemos al panel de control de nuestro blog, a través de Blogger in Draft y una vez allí en la parte de "Diseño" añadimos un nuevo elemento que se llama "Cuadro de búsqueda".
Cuadrode busqueda
Podemos configurar algunas opciones: búsqueda sólo en nuestro blog, resultados desde otros blogs, búsqueda en la web y enlaces relacionados.
Una vez añadido al blog, cuando hagamos una búsqueda, los resultados se mostrarán en la parte superior de las entradas, mostrando distintas pestañas dependiendo de las opciones que hayamos escogido, una vez terminada la consulta, se puede cerrar cómodamente el cuadro de resultados en la x que aparece arriba a la derecha.

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