How to change color title when post read
-
Hello everybody !
I search everywhere a solution for my problem, but impossible to find a topic or a plugin who can help me.
I wish that when a post is read for a user, the title change the color to mark it as read. Like we can see in a lot of forums or links.
I can give more information if you want.
Thanks for reading.
-
You need to modify your CSS.
The title should be an . Just create a css entry like the following:
a.blahblah:visited, a.blahblah:hover { color: #f00; }
or if that doesn’t work…
a.blahblah:visited, a.blahblah:hover { color: #f00 !important; }
That should do it.
Thanks for answer !
I find my style.css, and one things seems what you say me :h2.title a{text-decoration:none;color:#4e4e4e;} h2.title a:hover{color:#ed1e24;text-decoration:none;}
Is it possible to add before or after ?
h2.title a:visited{color: #f00; } h2.title a:hover{color: #f00 !important; }
The thing you posted should work:
h2.title a:visited{color: #f00; }
h2.title a:hover{color: #f00 !important; }Cheers
[signature removed per forum rules]
I tried it… but not works… ??
I doesn’t like put a big code, and i don’t wanna someone do my works… but it’s very important for me.
Is there a order or a place to write my code ?
Do i delete the line h2.title a{text-decoration:none;color:#4e4e4e;}
h2.title a:hover{color:#ed1e24;text-decoration:none;} ?/* post */ .post, .page{margin:1em 0 2em 0;padding:0 0 .6em;display:block;background:transparent url(images/dot.gif) repeat-x left bottom;} .post.preview-title{background:none;} body.single-page .page, body.single-post .post{background: none;margin:0;padding:0;} .post.asides{ border: 4px solid #eee; background-color: #fff; background-image: none; padding: 5px 10px; } .post.sticky{ /* needs redesigned */ } h2.title{ font-weight: bold; font-size: 180%; margin:0 0 .2em 0; padding:.2em 0 0 0; text-shadow: #fff 1px 1px 1px; } .post.asides h2.title{ font-size: 130%; font-style: italic; letter-spacing: -0.02em; } .post.sticky h2.title{ font-size: 300%; } h2.title a{text-decoration:none;color:#4e4e4e;} h2.title a:hover{color:#f00;text-decoration:none;} h3.title{font-size:140%;font-weight:bold;margin:1em 0 0 0;padding:0;} h3.title a{text-decoration:none;color:#4e4e4e;} h3.title a:hover{color:#ed1e24;text-decoration:none;} .post-excerpt{font-size:90%;font-style:italic;color:#666;} .post-short-info{margin:0;padding:0;} .post-thumb img{border:4px solid #eee;} .post-info{background:transparent url(images/info-bar.png) no-repeat right top;height:42px;margin-left:11px;color:#bbb;text-shadow:#fff 1px 1px 1px;} .post-info a{font-weight:bold;color:#999;} .post-info a:hover{color:#ed1e24;} .post-info p.author{padding: 0 0 0 6px;margin:0;line-height:32px;} .post-info p.comments{padding: 0 12px 0 0;margin:0;line-height:32px;} .post-info p.comments a.comments{background:transparent url(images/icons.png) no-repeat 0px -49px;padding-left:20px;} .post-info p.comments a.no.comments{background-position:0px 1px;} .post-date{background:transparent url(images/info-bar.png) no-repeat left -75px;padding-left:11px;float:left;text-transform:uppercase;font-weight:bold;} .post-date p.day{background:transparent url(images/info-bar.png) no-repeat right -42px;height:33px;padding:0 16px 0 0;margin:0;line-height:31px;color:#fff;} .post-content p{margin:0 0 .8em 0;padding:0;} .post-content a.post-edit-link{border:#ddd 1px solid;background-color:#fff;padding:3px 6px;text-decoration:none;} .post-content a.post-edit-link:hover{border:#ff284b 1px solid;background-color:#ed1e24;color:#fff;} .post-content a.more-link{background-color:#eee;text-decoration:none;color:#666;text-shadow:#fff 1px 1px 1px;padding:2px 6px 3px 6px;margin:0;font-size:85%;text-transform:uppercase;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;} .post-content a.more-link:hover{background-color:#999;color:#fff;text-shadow:#666 1px 1px 1px;} .post-content a.more-link.loading{border:0;margin:0 4px;padding:3px 8px;border:0;background:transparent url(images/loader-white.gif) no-repeat center center;} .post-tags{background:transparent url(images/icons.png) no-repeat 0px -104px;font-style:italic;padding-left:20px;line-height:22px;} .category-description{ font-size: 115%; font-style: italic; } .about_the_author{ padding: 8px 10px; line-height: 150%; background-color: #5e5e5e; color: #ccc; font-style: italic; } .about_the_author a{ color: #f9f9f9; text-decoration: underline; } .about_the_author a:hover{ color: #fff; text-decoration: none; } .about_the_author h3{ margin: 0; padding: 0; font-size: 130%; font-weight: bold; font-style: normal; color: #f9f9f9; } .about_the_author div.avatar{ float: left; margin-right: 8px; } .about_the_author div.avatar img{ border: 6px solid #333; } .post-meta{padding:6px 4px;border-top:1px solid #ddd;background-color:#f6f6f6;color:#999;display:block;} .post-meta td, .post-meta tr:hover td{ background-color: transparent; border: 0; padding: 0 2px; margin: 0; } .post-meta a{color:#666;text-decoration:underline;} .post-meta a:hover{color:#ed1e24;text-decoration:none;} .post-meta .details{font-size:80%;line-height:150%;} .post-meta a.control{display:block;padding:2px 6px 4px;background-color:#eee;text-shadow:#fff 1px 1px 1px;font-style:italic;text-decoration:none;font-size:115%;border:1px solid #fff;border-radius:3px;text-align:center;letter-spacing:-0.02em;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;cursor:pointer;} .post-meta a.control:hover, .post-meta a.control:hover a{background-color:#0071bb;text-shadow:#666 1px 1px 1px;color:#fff;}
Thanks again for reading.
ChrisFinally i don’t touch the CSS, cause a found a plugin “mark_as_read” and i modified it source to color title by user view.
Thanks, goodbye !
- The topic ‘How to change color title when post read’ is closed to new replies.