11

Destacar los enlaces visitados en los posts

Hace tiempo que usaba este sistema de pequeños iconos en el Escaparate para señalar los enlaces de las entradas que ya habían sido visitados, hoy he vuelto a incluirlo.

Los enlaces solo en el cuerpo de las entradas (post-body) se verán resaltados como muestra la imagen:

Ejemplo de links

Como veis, para el enlace normal (a la vista) no añadiremos ningún código, con lo que mostrará el mismo aspecto que los demás enlaces del blog.
Una vez que alguien haya visitado ese enlace y vuelva después a esa entrada, el enlace se mostrará con un pequeño icono de color gris que avisa de que ya hemos pinchado antes en ese enlace.
Si aún así, pasamos el ratón sobre ese enlace, el icono gris cambiará a uno de color rojo para "reforzar" el aviso.
Por supuesto podéis usar otros iconos distintos a estos, cambiando la url en el código por la de vuestras imágenes.

Y este es el código para los enlaces, que colocaremos en el CSS (antes de ]]></b:skin>) de nuestra plantilla:

/* Posts links
----------------*/
.post-body a:visited {
color:#006699;
padding-right: 13px;
background: url(http://i33.photobucket.com/albums/d100/manas_tripathy/visitedLink.gif) no-repeat 100% 50%;
}
.post-body a:visited:hover {
background: url(http://i33.photobucket.com/albums/d100/manas_tripathy/visitedHoverLink.gif) no-repeat 100% 50%;
padding-right: 13px;
color:#4192e5;
}

color:#006699; Color del enlace visitado.
color:#4192e5; Color del enlace al paso del ratón.
padding-right: 13px; Distancia para dejar espacio al icono (el ancho del icono en pixeles).

Entradas Relacionadas:

11 comentarios:


Sayoyiner

Hola Rosa que tal!! Casi nunca te escribo, tus post son lo bastante claros como para preguntarte algo!!! :D Pero bueno hoy se dio la ocasion y solo paso a dejarte un afectuoso saludos desde tierras Mexicanas, cada que sacas un post lo leo y lo llevo acabo. Saludos!!! :P

selene

hola Rosa se que no viene al tema mi consulta pero me gustaria preguntarte como has hecho "RTweets recientes" me gustaria tener un tambien saludos Rosa !!!

Theemilio_crazy

Hola Rosa... Se que te molesto mucho y quiero saber como se hace lo que esta abajo de TRADUCE, Osea ese efecto que tienen cuando le doy clic... Espero que me ayudes ;D

ezeqdb

hoy he vuelto a incluirlo., perdona, pero no puedo ver ningún ejemplo en tu blog, entré en varios links y no cambia nada en ellos.. y tengo cookies, historial, etc, activados

Bonzu Pipinpadaloxicopolis III

Se podrá usar una letra o texto en vez de imágenes?

Anónimo

Sayoyiner Pues gracias por pararte a comentar a pesar de no necesitar ayuda. Me alegra saber que estás por aquí :D
Un beso!

Anónimo

Theemilio_crazy Eso es uno de los efectos que se logran con Scriptaculous y que en breve pretendo ir explicando en sucesivas entradas que estoy preparando.

Anónimo

ezeqdb Solo en los enlaces del "cuerpo del post" podrás verlo, en el resto no.

Anónimo

Bonzu No que yo sepa.

Unknown

Este post me viene de maravilla porque en mi blog no se notan mucho los link que se visitan :)
Muchas gracias por el dato prrr ^_^

besotes y un abrazo:D

NyA

muito obrigado por este fantastico Blogger que tens ;)
estou a deixar o meu Guapizimo heheh
Abraços Rosa

Publicar un comentario

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S