Configuración:
.
Biología
.
Botánica
.
Tecnología
.
Sociedad
A mis trece años de edad, el día 2 de Diciembre de 2007 inicié ‘El Balcón de Jame’. Este humilde espacio, cuyo secreto siempre fue el de compartir sin recibir nada a cambio, me dio la oportunidad de conocer un mundo nuevo, un entorno en el que me sentía yo mismo.

Hoy, 17 de abril de 2011 finalizo esta etapa de mi vida con una gran sonrisa y junto al recuerdo que este blog y cada unos de vosotros me habéis concedido.

He sido bloggero.

Jaime Trujillo Escobedo.

Los cursores en el blog

Hace mucho tiempo me preguntaron la forma de cambiar el cursor al pasarlo por encima de un enlace, un título, un bloque de texto, una imagen...

Por suerte, todo eso e incluso más puede hacerse en blogger.

Antes de comenzar, conozcamos los tipos de cursores y sus respectivos nombres que serán necesarios para incluirlos en el CSS:



Diseño>Edición de HTML>expandimos artilugios




1) Para poner cualquier cursor en el título de las entradas busca este bloque:

.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}

y añade debajo de .post h3 { esta línea:

cursor: NOMBRE;

Para terminar sustituye NOMBRE por el nombre del cursor que más te guste, por ejemplo move.

2) Para poner cualquier cursor en todos los enlaces del blog busca este bloque:

a:hover {
color:$titlecolor;
text-decoration:underline;
}

Y añade debajo de a:hover { esta línea:

cursor: NOMBRE;

Para terminar sustituye NOMBRE por el nombre del cursor que más te guste, por ejemplo help.

3) Para poner cualquier cursor en un enlace específico busca la siguiente etiqueta:

]]></b:skin>

Y encima pega esto:

.enlacecurs:hover{cursor: NOMBRE; text-decoration: none;}

Guarda la plantilla.

Ahora, cada vez que desees insertar el enlace con cursor especial haz uso de esta línea:

<a class="enlacecurs" href="DIRECCION">TITULO</a>

Reemplaza DIRECCION por la URL de tu sitio web y TITULO por el texto del enlace.

Nota:

Para no estar copiando la línea que inserta el enlace con cursor especial, puedes hacer uso de la plantilla de entrada.


4) Para poner cualquier cursor en los enlaces de la sidebar (barra lateral):

Busca la etiqueta ]]></b:skin> y encima añade esto:

.sidebar ul li a:hover{
cursor: NOMBRE;
text-decoration: none;
}

Reemplaza NOMBRE por el nombre del cursor elegido y guarda la plantilla.

5) Para poner cualquier cursor en los enlaces del post-footer o pie del post:

Busca la etiqueta ]]></b:skin> y encima añade esto:

.post-footer ul li a:hover{
cursor: NOMBRE;
text-decoration: none;
}

Reemplaza NOMBRE por el nombre del cursor elegido y guarda la plantilla.

6) Para poner cualquier cursor en las imágenes de las entradas:

Busca la etiqueta ]]></b:skin> y encima añade esto:

.post img a:hover {cursor: NOMBRE;}

Reemplaza NOMBRE por el nombre del cursor elegido y guarda la plantilla.

ellobo dice...

Hola Jaime.
En configuración tengo activado para que aparezca la foto de perfil en los comentarios, pero en realidad no salen. ¿Qué puedo hacer?
La dirección es http://udalmeriaellobo.blogspot.com/
Gracias.
Saludos.

Jaime Trujillo Escobedo dice...

ellobo, próximamente publicaré una entrada al respecto, ofreciendo los códigos necesarios en caso de no visualizar los avatares en los comentarios ;).

Escribe tu comentario en la entrada...

El Balcón de Jaime fue terminado el 17 de abril de 2011. Leer despedida.

Me gustaría conocer tu opinión. El comentario será moderado y en breve se publicará.

Si deseas incluir un enlace utiliza este código:

<a href="Dirección de tu página">Titulo del enlace</a>

Para publicar un código haz uso del Conversor de entidades.

Intenta escribir sobre algo relacionado con el artículo. Si no lo haces, podría tardar en responderte.

¿Problemas al comentar? Utiliza el formulario antiguo