Announcement

Collapse
No announcement yet.

Using a library Font Awesome

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • ABDUR7MAAN
    started a topic [vB5] Using a library Font Awesome

    Using a library Font Awesome

    Good evening ... How are you?
    I want to change the icons of the forum shown in the picture:
    Click image for larger version

Name:	icon-1.PNG
Views:	45
Size:	45.3 KB
ID:	4382222

    I want to use a library Font Awesome Such as this site :

    Click image for larger version

Name:	icon-2.PNG
Views:	36
Size:	89.1 KB
ID:	4382223

    How can I do that ؟

  • Glenn Vergara
    replied
    If you just want to use fontawesome icons for 10-12 icons in the forum directory list as referenced in the screenshot, it's not worth to include the entire ~30KB fontawesome css file and edit the templates and add the necessary fontawesome "fa-*" CSS classes which may result in template merge conflicts every time you upgrade the forum. In the main nav icons which Wayne Luke did, the fontawesome CSS classes and additional HTML tags can be added in the Phrase Manager without any merge conflicts, but for the icons in the forum directory list, there's no easy way without editing the templates.

    I'm not saying it's not possible to use fontawesome in forum directory icons without editing templates. The solution I'm thinking is actually my recommended solution in this particular case as you don't need to include the entire ~30KB fontawesome css file on your page which means there's no additional load on your page to download a css file.

    Leave a comment:


  • Wayne Luke
    commented on 's reply
    https://forums.rabidbadger.io/rabidb...-did-i-do-that

  • ABDUR7MAAN
    replied
    Originally posted by Wayne Luke View Post
    If you look at the rabidbadger site in my signature, I am using font awesome icons. The complete custom css for the site is available in the forums.

    You may need to register to see code, I don't remember off the top of my head.
    Actually that is very nice
    How can I do that

    Leave a comment:


  • Wayne Luke
    replied
    If you look at the rabidbadger site in my signature, I am using font awesome icons. The complete custom css for the site is available in the forums.

    You may need to register to see code, I don't remember off the top of my head.

    Leave a comment:


  • In Omnibus
    replied
    Originally posted by ABDUR7MAAN View Post

    What are the templates responsible for this
    Bearing in mind this is custom coding and is not supported by vBulletin you would need to add the font awesome HTML in the headinclude template, the fonts themselves in the fonts folder (unless you want to call them from MaxCDN), and the font awesome CSS into the css_additional.css template of each style where you wish to use font awesome. Then you need to use replacement CSS such as the one Glenn Vergara has generously provided here: https://www.vbulletin.com/forum/foru...icons-any-size

    You need to have font awesome CSS which calls two different images, one for new posts and another for old posts.

    If you're not 100% certain of how to go about this I would recommend having a skilled coder do it for you. It is not a simple template edit.

    Leave a comment:


  • ABDUR7MAAN
    replied
    Originally posted by In Omnibus View Post
    If you don't know how to write the CSS yourself the easiest way would be to use https://fortawesome.com/ which is Font Awesome specifically for websites. It allows you to select only the icons you need and writes the CSS for you.

    Caveat: It's not free.
    What are the templates responsible for this

    Leave a comment:


  • In Omnibus
    replied
    If you don't know how to write the CSS yourself the easiest way would be to use https://fortawesome.com/ which is Font Awesome specifically for websites. It allows you to select only the icons you need and writes the CSS for you.

    Caveat: It's not free.

    Leave a comment:

Related Topics

Collapse

Working...
X