XF 2.0 different node fa-icon

Currently reading:
XF 2.0 different node fa-icon

maszd

cXF Pack C
cXF Pack B
cXF Donor
May 20, 2015
119
46
Hi @BassMan
on xF 2.0 to change all node icon iam use this code :
Code:
.node--forum .node-icon i:before {
    text-shadow: 1px 1px 0;
    content: "\f0f4";
}
my question is, how to change only for specific node?
thank you before.
Regards.
 

TheXboxCloud

cXF Pack C
cXF Pack A
Feb 7, 2016
3
3
Code:
.node--category .node-icon i::before, .node--forum .node-icon i::before {
text-shadow: 1px 1px 0;
content: '\f0f4';
}
I think that's the code for all of them at once. Try and see if it works. I think it should as it showed the URL of my node icons in that specific selector rather then the one you used.

If you want to target a specific node ID try something like this and replace the area that's the node ID with the desired node.

Code:
.node--id33 .node--category .node-icon i::before, .node--id33 .node--forum .node-icon i::before {
text-shadow: 1px 1px 0;
content: '\f0f4';
}
I'll let BassMan correct this if I'm wrong. Just trying to help. I haven't tested any of it but it seems that relatively speaking it should work. The second code is simply targeting the node id '33' with the appropriate selector for changing node icons. You'll need to replace the node ID after using inspect element to find out which one you should use.

I'd give it a shot. At least the first one should work.

@maszd I updated the post. I don't know if the second one would work you'd have to play around with it. But it might.

EDIT: I also updated it a third time just now. I realize since there's a comma the node ID should be in both places.
 
Last edited:

TheXboxCloud

cXF Pack C
cXF Pack A
Feb 7, 2016
3
3
To add to this it's required you add the font awesome property in the code as I just tried a while ago for our category icon and it wouldn't work without it.

So add this to the code above:

Code:
font-family: 'FontAwesome', sans-serif;
Also be aware that there is no space between "Font" and "Awesome". There can't be a space between it. Thanks.
 

BassMan

Staff member
Administrator
May 18, 2015
1,097
683
www.customizexf.com
Hi @maszd,

try with this one:
Code:
.node.node--id4 .subNodeLink.subNodeLink--forum:before {
    content: "\f123";
    color: #9E5697;
}
... where X is your parent node ID from subforum.
 

TheXboxCloud

cXF Pack C
cXF Pack A
Feb 7, 2016
3
3
Hi @BassMan
iam try that code but not working :(
This is the one I used on my forum when I was using it. Should work.

CSS:
.node--id52.node--read .node-icon i:before {
    font-family: FontAwesome;
    content: '\f023';
}

.node--id52 .node-icon i:before {
    font-family: FontAwesome;
    content: '\f023';
}
Not sure if my previous above example ever worked but this is what I went with on my old forum and it worked like a charm. Replace "52" with the node ID and the unicode with the appropriate icon.

Works with subforums too.

If the unread indicator for the second part needs an adjustment add .node--unread in the same format as the first.

@maszd
 

maszd

cXF Pack C
cXF Pack B
cXF Donor
May 20, 2015
119
46
This is the one I used on my forum when I was using it. Should work.

CSS:
.node--id52.node--read .node-icon i:before {
    font-family: FontAwesome;
    content: '\f023';
}

.node--id52 .node-icon i:before {
    font-family: FontAwesome;
    content: '\f023';
}
Not sure if my previous above example ever worked but this is what I went with on my old forum and it worked like a charm. Replace "52" with the node ID and the unicode with the appropriate icon.

Works with subforums too.

If the unread indicator for the second part needs an adjustment add .node--unread in the same format as the first.

@maszd
working perfect :heart: thank you @TheXboxCloud :)
 

maszd

cXF Pack C
cXF Pack B
cXF Donor
May 20, 2015
119
46
Hi again :D
now iam change this option to show sub node icon on forum list:

2018-05-12_142418.png

iam try this code but not working, icon not changged:

HTML:
.node.node--id40 .subNodeLink.subNodeLink--forum:before {
    content: "\f187";
}
thank you before.
 

maszd

cXF Pack C
cXF Pack B
cXF Donor
May 20, 2015
119
46
Hi maszd,

it should work, just make sure you add the node id from the parent forum.
Hi @BassMan
how about a node with lot of sub forum?
i try that code its working but all sub forum icon have same icon like this:



i want each sub forum have different icon.
thanks.
 
Last edited:

Create an account or login to comment

You must be a member in order to leave a comment

Create account

Create an account on our community. It's easy!

Log in

Already have an account? Log in here.

Top