XF 2.3 xenforo 2.3 fontawesome

[Dr-SpinXO]

Hello,

In Xenforo 2.3 the fontawesome icons are no longer displayed. What can I do to make them appear again?

 

[Mr Lucky]

For CSS, e.g. for categories:

.block.block--category.block--category28 .block-header:before

{
    .m-faContent(@fa-var-music);
  
}

Or

.m-faContent(@fa-var-solid-music);

.m-faContent(@fa-var-duotone-music);

In templates etc:

<xf:fa icon="fa-sparkles" aria-hidden="true"/>

or

<xf:fa icon="fas fa-sparkles" aria-hidden="true"/>

 

[Dr-SpinXO]

For CSS, e.g. for categories:

.block.block--category.block--category28 .block-header:before {
    .m-faContent(@fa-var-music);
    float: left;
    padding-right: 5px;
}

Or

.m-faContent(@fa-var-solid-music);

In templates etc:

<xf:fa icon="fa-sparkles" aria-hidden="true"/>

where does this have to go?

 

[Mr Lucky]

where does this have to go?

That is just an example, but it would go in extra.less if you have (for example) category icons or some other use of pseudo element such as before or after.

 

[Dr-SpinXO]

But that doesn't solve the problem,

 

[Dr-SpinXO]

Prefix in css icons doesn't work either

 

[Mr Lucky]

But that doesn't solve the problem,

It did for me

 

[Dr-SpinXO]

ok I'm happy for you, I still have the prefix addon and the icons aren't shown there either.

 

[Mr Lucky]

ok I'm happy for you,

Well, I told you how to use font awesome in CSS, you're welcome

I still have the prefix addon and the icons aren't shown there either.

What prefix addon? You didn't mention an addon.

 

[Dr-SpinXO]

I know, but it's not about the addon, it's about the icon on the page in general, these are not displayed. [XenGenTr] Onek sistemi

https://xenforo.gen.tr/xenforo-kaynaklari/xengentr-onek-sistemi.1002/

 

[Mr Lucky]

I'm not quite sure what you are after, ie I don't know where you want the icons, I've done my best to tell how to use them in 2.3.

In prefixes you can use this in extra.less for before and/ or after, e.g. with the lightGreen prefix:

.label.label--lightGreen {
   
   
    &:before {
        .m-faContent(@fa-var-flower-tulip);      
    }

    &:after {
        .m-faContent(@fa-var-flower-daffodil);       
    }
}

 

[Mr Lucky]

To get rid of the default node icon showing as well as your custom icon

.node .node-icon i svg

{
        display: none;
    }

 

[Dr-SpinXO]

alles funktioniert nicht

So entfernen Sie das standardmäßige Knotensymbol sowie Ihr benutzerdefiniertes Symbol

.node .node-Symbol ich svg

{
        Anzeige: keine;
    }

 

[Mr Lucky]

That code seems like it has been translated into German. Sorry I can't help with that I only know how to do code in English.

 

[Dr-SpinXO]

I'm not quite sure what you are after, ie I don't know where you want the icons, I've done my best to tell how to use them in 2.3.

In prefixes you can use this in extra.less for before and/ or after, e.g. with the lightGreen prefix:

.label.label--lightGreen {
  
  
    &:before {
        .m-faContent(@fa-var-flower-tulip);     
    }

    &:after {
        .m-faContent(@fa-var-flower-daffodil);      
    }
}

How does this work? If I enter prefix nothing happens .label.label--lightGreen

 

[Mr Lucky]

How does this work? If I enter prefix nothing happens .label.label--lightGreen

 

[Mr Lucky]

If I enter prefix nothing happens .label.label--lightGreen

Are you sure there isn't a 3rd party addon or theme which could interfere?

You may find this resource helpful:

Font awesome icons 2.3 - categories, nodes, prefixes, phrases, templates etc...

Sep 19, 2024

A general guide to using Font Awesome icons in xenforo 2.3

• Mr Lucky
• font awesome
• XenForo tips & guides [2.x]