1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.4 Add a font awesome icon on custom BBcode

Discussion in 'XenForo Questions and Support' started by Betclever, Mar 13, 2015.

  1. Betclever

    Betclever Active Member

    Hello,

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

    Thanks.
     
  2. Mike

    Mike XenForo Developer Staff Member

    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.
     
  3. Betclever

    Betclever Active Member

    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.
     
  4. Mike

    Mike XenForo Developer Staff Member

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

    Betclever Active Member

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

    Mike XenForo Developer Staff Member

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

    Betclever Active Member

    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.
     
  8. Mike

    Mike XenForo Developer Staff Member

    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.)
     
  9. cclaerhout

    cclaerhout Well-Known Member

    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:
    Code:
    <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:
    [​IMG]
    [​IMG]
     

Share This Page