XF 1.4 Add a font awesome icon on custom BBcode

[Betclever]

Hello,

How can I add a font awesome icon on custom BBcode?

Thanks.

 

[Mike]

Add it where exactly? The icon? You'll likely need to enter some other image to trigger the display and then edit the CSS manually/directly to change the icon to what you want.

 

[Betclever]

Add it where exactly? The icon? You'll likely need to enter some other image to trigger the display and then edit the CSS manually/directly to change the icon to what you want.

Hello,

Link to the icon => http://bet-clever.com/styles/default/xenforo/editor/justify.jpg
Sprite position 3 - 1406px
Icon size "jpg" is 16x16 but I have tried with 32x32 but same issue. :/

Thanks.

 

[Mike]

That's not a sprite so you shouldn't be entering any sprite params.

 

[Betclever]

Ok so when can I add the original awesome icon for the bbcode justify?

 

[Mike]

You would need to write custom CSS to change the editor icon to something other than the image system that we support.

 

[Betclever]

You would need to write custom CSS to change the editor icon to something other than the image system that we support.

In fact, I have changed a template to change the editor icons to awesome icons but it doesn't change the "justify BBcode".
For each new BBcode I will use, I will have this problem... :/

Is there any template I can modify to put an awesome icon without modifying the CSS?
If not, I gave the position of the icon, any possibility you can help me for this?

Thanks.

 

[Mike]

CSS are templates, so I'm sort of confused as to what you're referring to. But the CSS is the only way to tackle this. You'll need to use the browser to identify the correct selector to use for your tag and then add the necessary CSS to display the correct icon. (The template would be editor_ui.css IIRC.)

 

[cclaerhout]

In fact, I have changed a template to change the editor icons to awesome icons but it doesn't change the "justify BBcode".
For each new BBcode I will use, I will have this problem... :/

Is there any template I can modify to put an awesome icon without modifying the CSS?
If not, I gave the position of the icon, any possibility you can help me for this?

Thanks.

FA doesn't work with sprites because it's using some font icons. The easiest way is use FA is how they were meant to: with extra class:

<i class="fa fa-custom-name"></i>

You can of course recreate all css propertie to an existed html element (you will have first to apply to it the "font-awesome" font-family, etc.) but honestly that's quite a none-sense.
If you want to use FA with a custom BB Code, you can still use the Bbm, there's an option that allows you to select a FA icon (on Redactor or TinyMCE) and applies it to a button: