• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Change node icon and set the same for read/unread

Claudio

Well-known member
#1
Many people have been asking "how can I change the node icons"?

My questions is a little different.
I want to set a specific icon for each node but I don't care if the node is read or unread.

This is the best code I've found (http://xenforo.com/community/threads/rc-1-custom-node-status-icons-read-unread.10886/):
Code:
/* custom status icons */
.node .node_7 .forumNodeInfo .nodeIcon, .node .node_7 .categoryForumNodeInfo .nodeIcon {
    background-image: url("@imagePath/xenforo/widgets/forum-read-7.png");
}
.node .node_7 .forumNodeInfo.unread .nodeIcon, .node .node_7 .categoryForumNodeInfo.unread .nodeIcon {
    background-image: url("@imagePath/xenforo/widgets/forum-unread-7.png");
}
However, due I'm not going to use a different icon for read/unread, I'd like to know if there's a shorter code to do what I want and show ICON1 for NODE1 no matter if it's read or unread.

Thank you!
 

Brogan

XenForo moderator
Staff member
#2
Just combine the classes like so:

Code:
.node .node_7 .forumNodeInfo .nodeIcon, .node .node_7 .categoryForumNodeInfo .nodeIcon,
.node .node_7 .forumNodeInfo.unread .nodeIcon, .node .node_7 .categoryForumNodeInfo.unread .nodeIcon {
    background-image: url("@imagePath/xenforo/widgets/forum-icon-7.png");
}
 

Claudio

Well-known member
#3
Just combine the classes like so:

Code:
.node .node_7 .forumNodeInfo .nodeIcon, .node .node_7 .categoryForumNodeInfo .nodeIcon,
.node .node_7 .forumNodeInfo.unread .nodeIcon, .node .node_7 .categoryForumNodeInfo.unread .nodeIcon {
    background-image: url("@imagePath/xenforo/widgets/forum-icon-7.png");
}
Thanks Brogan, I didn't expect less from you.

However, I've added
Code:
background-position: 0px 0px;
to show the icon where it should be. If I don't set this parameter, the icon is not align.
I'm using a default style so you should add this parameter to following explanations :)