XF 2.2 How to change read and unread node icons?

[Floki]

I don't want anything fancy like a new icon for each node. I just want to change the read icon to one image, and the unread icon to another image.

This doesn't work:

.node--unread .node-icon {
background-image: url(link) !important;
background-repeat: no-repeat !important;
background-position: center !important;
}
.node--read .node-icon {
background-image: url(link) !important;
background-repeat: no-repeat !important;
background-position: center !important;
}

It wont overwrite whats already there, and for the life of me I cant find out where in the templates the coding for the unread and read icons are. Is there a way to do it myself?

 

[Floki]

Figured it out. Never mind.

 

[Alan_SP]

What's solution? For others to implement if they want to do it.

 

[Thanh Thai]

I'm interested in how to do it

 

[Old Nick]

[cXF] Change default FA node icon

Would you like to change your default Font Awesome node icons like this? < read node > < unread node > To change a single node icon with a different Font Awesome icon add this code to your extra.less template: Change X with your node...

xenforo.com

 

[tourmeister]

I just upgraded to XF 2.3 and now my Read/Unread images for nodes have some other graphic overlaid on them. See below,



My image is a dark blue helmet for unread and a pale blue helmet for read. Here is the extra-less code I have been using prior to the upgrade (still there after upgrade as well),



I cannot figure out how to get ride of the new image so that only the helmet is visible. I don't mind the new image for the subnodes.

 

[ekool]

This code is working for me.

.node-icon i { display: none; }
.node-icon { background-image: url('/img/node-icon.png'); background-repeat: no-repeat; background-position: center; }
.node--read .node-icon { background-image: url('/img/node-icon-bw.png'); opacity: 0.5; }

 

[Old Nick]

I cannot figure out how to get ride of the new image so that only the helmet is visible. I don't mind the new image for the subnodes.

Just add this to your extra.less template:

.node .node-icon svg {display: none;}

 

[tourmeister]

This code is working for me.

.node-icon i { display: none; }

That one line cleared the default icon perfectly!

Just out of curiosity, if I wanted to use the same custom icon image for the sub nodes as well, how would I do that?

 

[Old Nick]

That one line cleared the default icon perfectly!

I missed you are running 2.2, mine was for 2.3.