Add Indicator after node title

Add Indicator after node title

Overview Reviews (32) Discussion
Alu03 said:
And how to show the hot topic?
How to change this to hot nodetitle?
Code: 
.nodeInfo.unread .nodeTitle:after
Click to expand...

This enhancement only displays new posts not "hot topics" since this would most likely require some kind of add-on.
 
How can I get it to stop displaying next to subforums? I tried

Code: 
.subForumsMenu .node .unread .nodeTitle:after {display: none;}

and it didn't do anything.
 
Chi Bearhawks said:
How can I get it to stop displaying next to subforums? I tried

Code: 
.subForumsMenu .node .unread .nodeTitle:after {display: none;}

and it didn't do anything.
Click to expand...

This might be what you are looking for. Css fix by @CyberAP for the subforums if you want to eliminate comletely remove the styling from the code below and add in your display:none;

Code: 
.nodeList > .node > .unread > .nodeText .nodeTitle:after
{ background-color: #be4f4f; border: 1px solid #902b2b;
content: "NEW"; color: white; border-radius: 2px; margin-left: 5px; padding: 0 5px; font-size: 9px; }
.subForumList .node .unread .nodeTitle:after {display:none;}
 
Last edited:
@Shelley, thank you so much for example!(y)(y)(y)
This:
Code: 
/**** INDICATOR NEW MESSAGES IN NODES ****/
.LoggedIn
.nodeList > .node > .unread > .nodeText .nodeTitle:after,
.discussionListItem.unread .title:after
{
  content: "Новое";
  display: inline-block;
  line-height: 14px;
  height: 14px;
  vertical-align: 2px;
  margin-left: 5px;
  padding: 0 5px;
  border-left: 7px solid rgba(0, 0, 0, 0);
  border-radius: 2px;
  background-color: red;
  background-color: hsla(0,0%,0%,0);
  background-image: -webkit-linear-gradient(#F00, #F00), -webkit-linear-gradient(45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%), -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%);
  background-image: -moz-linear-gradient(#F00, #F00), -moz-linear-gradient(45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%), -moz-linear-gradient(-45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%);
  background-image: linear-gradient(#F00, #F00), linear-gradient(135deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%), linear-gradient(45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%);
  background-clip: padding-box, border-box, border-box;
  background-origin: padding-box, border-box, border-box;
  background-size: auto auto, 20px 100%, 20px 100%;
  background-repeat: repeat, repeat-y, repeat-y;
  background-position: 0 0, 0 21px, 0 21px;
  color: #FFF;
  font-size: 9px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}
/**** INDICATOR NEW MESSAGES IN NODES ****/

works PERFECT for me!!
@CyberAP, thank you so much too! (y)(y)(y)
 
Chi Bearhawks said:
How can I get it to stop displaying next to subforums? I tried

Code: 
.subForumsMenu .node .unread .nodeTitle:after {display: none;}

and it didn't do anything.
Click to expand...

If your using the xenforo default grid (column) subforum layout then the following will fix this. replace your current code with the following.

Code: 
.nodeList > .node > .unread > .nodeText .nodeTitle:after,
.subForumList .node .unread .nodeTitle:after { background-color: #be4f4f; border: 1px solid #902b2b;
content: "NEW"; color: white; border-radius: 2px; margin-left: 5px; padding: 0 5px; font-size: 9px; }


If you want to totally eliminate the indicators on the grid subforum layout then apply and replace it with the following.
Code: 
.nodeList > .node > .unread > .nodeText .nodeTitle:after {
background-color: #be4f4f; border: 1px solid #902b2b;
content: "NEW"; color: white; border-radius: 2px; margin-left: 5px; padding: 0 5px; font-size: 9px; }
.subForumList .node .unread .nodeTitle:after {display:none;}
 
Shelley said:
Code: 
.nodeList > .node > .unread > .nodeText .nodeTitle:after,
.subForumList .node .unread .nodeTitle:after { background-color: #be4f4f; border: 1px solid #902b2b;
content: "NEW"; color: white; border-radius: 2px; margin-left: 5px; padding: 0 5px; font-size: 9px; }
Click to expand...
Sometimes re-reading an entire thread pays off, although starting at the end would have saved me 20 minutes! :whistle:

Finally my plan for displaying sub-forums is coming together thanks to a couple of your edits (y)

Now only displays "New" against the correct sub-forums, not all. Also pinched/modified another bit of your code to display an arrow next to the sub-forums!

upload_2013-9-22_10-26-11.webp
 
Thanks! Working perfectly (not showing in subforums and not showing to guests):

Code: 
/**** INDICATOR NEW MESSAGES IN NODES ****/
.LoggedIn
.nodeList > .node > .unread > .nodeText .nodeTitle:after

{
  content: "N";
  display: inline-block;
  line-height: 14px;
  height: 14px;
  vertical-align: 2px;
  margin-left: 5px;
  padding: 0 5px;
  border-left: 7px solid rgba(0, 0, 0, 0);
  border-radius: 2px;
  background-color: red;
  background-color: hsla(0,0%,0%,0);
  background-image: -webkit-linear-gradient(#F00, #F00), -webkit-linear-gradient(45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%), -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%);
  background-image: -moz-linear-gradient(#F00, #F00), -moz-linear-gradient(45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%), -moz-linear-gradient(-45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%);
  background-image: linear-gradient(#F00, #F00), linear-gradient(135deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%), linear-gradient(45deg, rgba(0, 0, 0, 0) 50.5%, #F00 50.5%);
  background-clip: padding-box, border-box, border-box;
  background-origin: padding-box, border-box, border-box;
  background-size: auto auto, 20px 100%, 20px 100%;
  background-repeat: repeat, repeat-y, repeat-y;
  background-position: 0 0, 0 21px, 0 21px;
  color: #FFF;
  font-size: 9px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}

.subForumList .node .unread .nodeTitle:after {display:none;}
/**** INDICATOR NEW MESSAGES IN NODES ****/
2013-10-05_1305.png

Thanks!! :D
 
Thanks for the fixes Shelley. One question, are we able to have the new display only in the sub-forum where there are new posts, not in the main one (unless there's new posts in there as well of course)??
 
CFodder said:
Thanks for the fixes Shelley. One question, are we able to have the new display only in the sub-forum where there are new posts, not in the main one (unless there's new posts in there as well of course)??
Click to expand...
TBH I'm not sure if this is possible offhand without trying it out. Hopefully someone can jump in and test this out or say if it's possible with css only.

If your referring to the forum_view subforums I've always known any knew posts will also show as "new" on forumhome. It might need to be done via a template mod or add-on tthough I could be very wrong in that assumption.
 
Shelley said:
TBH I'm not sure if this is possible offhand without trying it out. Hopefully someone can jump in and test this out or say if it's possible with css only.

If your referring to the forum_view subforums I've always known any knew posts will also show as "new" on forumhome. It might need to be done via a template mod or add-on tthough I could be very wrong in that assumption.
Click to expand...

If it's required as a mod then it's all okay, I was more sort of wondering if it could be done easily and cleanly ... if not all good.

Thanks for the quick reply :).
 
Hi anyone using a "new phrase" instead the content "New"?
I tried but cant get it working, maybe someone can help with?!
 
This is my problem:

I have imported my threads from vbulletin, so now all the threads are marked as unread and 'new'. So the users are seeing the new indicator for threads from 2 years ago. How can i set all the old threads as read, so i can start from now on with the 'new' threads?
 
You must log in or register to reply here.

Similar threads

Emre
Add Indicator after node title | xF 2.x.x [Deleted]
Replies
10
Views
2K
Emre
Emre
TsinJu
  • Question Question
XF 1.2 Add Indicator after node title with Numbers?
Replies
1
Views
722
Jake Bunce
Jake Bunce
Back
Top Bottom