How to add forum status icons to XF

Alpha1

Well-known member
My vb big board has unique forum status icons for each forum and subforum. These partly make up the forum / brand identity. I would like to add these to my xenforo installation.

Does XenForo have forum icon functionality?
If not, then are there any addons? I have searched, but did not find any in the RM.
 
Please note that I want to replace the stock node icons, with custom node icons. I do not want double node icons.
So no separate icons, but complete replacement.
I'm not touching any templates, so if there is no addon, then I will need to create one.
 
My vb big board has unique forum status icons for each forum and subforum. These partly make up the forum / brand identity. I would like to add these to my xenforo installation.

Does XenForo have forum icon functionality?
If not, then are there any addons? I have searched, but did not find any in the RM.

There is a style property to change the node icons from default to your own if that is what you are saying.

Style Properties -> Node Icons: In there you can change/adjust your icons.
 
Each forum and subforum has an unique icon and a variant for new posts, locked, link, etc.
Mind that I have 450+ nodes/forums. So that would be a massive extra.css
 
You can either add the custom icon (redirect to the spritesheet or upload an indivudual icon by going into Appearance >> Style properties >> node icons >> Node Icon: link and insert path to image or spritesheet
 
You can either add the custom icon (redirect to the spritesheet or upload an indivudual icon by going into Appearance >> Style properties >> node icons >> Node Icon: link and insert path to image or spritesheet
ok cool.. that makes sense.. but i was wondering along the lines of something that you would put in your extra.css file.. just in case you had several links .. This method would make them all the same..
 
ok cool.. that makes sense.. but i was wondering along the lines of something that you would put in your extra.css file.. just in case you had several links .. This method would make them all the same..

You are wanting to make each link forum node icon different?

You could use ID to make them different

The following is an example, your ids would differ and you would need to adjust the node id accordingly along with the path of the image. keep adding the code for each link forum and change the id and path to image accordingly.

Code:
.node .node_31 .linkNodeInfo  .nodeIcon, .node .node_31 .linkNodeInfo .nodeIcon {
    background-image: url("@imagePath/xenforo/icons/node17-read.png");
    background-position: 0;
    background-repeat: no-repeat;
 
}
 
You are wanting to make each link forum node icon different?

You could use ID to make them different

The following is an example, your ids would differ and you would need to adjust the node id accordingly along with the path of the image. keep adding the code for each link forum and change the id and path to image accordingly.

Code:
.node .node_31 .linkNodeInfo  .nodeIcon, .node .node_31 .linkNodeInfo .nodeIcon {
    background-image: url("@imagePath/xenforo/icons/node17-read.png");
    background-position: 0;
    background-repeat: no-repeat;
 
}
ha.. thank you.. i was really close... it was that .linkNodeInfo .. that i was getting wrong... I'm learning.... lol.. thanks
 
Is there an easy way to make each custom Forum-icon click-able ? So adding some "a href" to it so that it links to the correct Forum-Node when the image is clicked ?

I mean: is it possible to add the node-number to the "a href" somehow ?
How to do this, please ?


I have this code for one of my Forum-Nodes:

Code:
.categoryForumNodeInfo, .nodeList .node_185 .forumNodeInfo .nodeIcon, .node .node_185 .categoryForumNodeInfo .nodeIcon {
background-image: url("/marketplace/b2b_lounge.jpg") !important;
}
.categoryForumNodeInfo, .nodeList .node_185 .forumNodeInfo.unread .nodeIcon, .node .node_185 .categoryForumNodeInfo.unread .nodeIcon {
background-image: url("/marketplace/b2b_lounge.jpg") !important;
}


:)
 
Is there an easy way to make each custom Forum-icon click-able ? So adding some "a href" to it so that it links to the correct Forum-Node when the image is clicked ?

I mean: is it possible to add the node-number to the "a href" somehow ?
How to do this, please ?
:)

Template node_forum_level_2

Find:
Code:
<span class="nodeIcon" title="{xen:if $forum.hasNew, '{xen:phrase unread_messages}', ''}"></span>

Replace with:
Code:
<a href="{xen:link forums, $forum}"><span class="nodeIcon" title="{xen:if $forum.hasNew, '{xen:phrase unread_messages}', ''}"></span></a>

Should work everywhere I think..
 
Template node_forum_level_2

Find:
Code:
<span class="nodeIcon" title="{xen:if $forum.hasNew, '{xen:phrase unread_messages}', ''}"></span>

Replace with:
Code:
<a href="{xen:link forums, $forum}"><span class="nodeIcon" title="{xen:if $forum.hasNew, '{xen:phrase unread_messages}', ''}"></span></a>

Should work everywhere I think..

you are a genius, works like a charm (y)(y)(y)

Thanks a lot!!!!!!!

:)
 
Top Bottom