Font Awesome in ModCP,UserCP & Tabs

by linkzy - 05-02-2015, 12:56 PM
i'm so divine
Posts:
6,351
Joined:
Jan 2015
Likes:
319
Credits:
17
Reputation:
171
3 Years of Service
#1
OP
Posted: 05-02-2015, 12:56 PM (This post was last modified: 05-02-2015, 01:43 PM by linkzy.)
Hey
That link wasnt working k bye

How do I use this?

Font Awesome is pretty simple to add to your MyBB forum, it literally takes all of 60 seconds to do so.

Navigate to AdminCP > Templates and styles > Your themes templates > Ungrouped templates > headerinclude, and then add the following code.


PHP Code:
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"
There you have it, you can now begin to change your icons to Font Awesome icons. as seen below.

Font Awesome on tabbed menu

First of all, you will need a copy of Omni's tabbed menu plugin for MyBB.

[Image: 753b12ef647ee7c545fcc45269ef5be6.png]

Once you have it installed, go to the Font Awesome icon page -> http://fontawesome.io/icons/ and choose an icon that you want to use.

Let's say I want to use a computer icon, as seen below:


You can see that when I have clicked on my image, I have been provided with a code underneath it. This is what we will be using.

Go to ACP > Forums & Posts > Tabbed Menu, and click edit on the tab you wish to add the icon to.

[Image: 4da94e85cac6a696d1cd33001f3a4e7a.png]

Before the name, we'll add the icon code that we copied before.

It should look like this:


That is it, you can now go and add an icon to every tab you have!

Font Awesome in usercp and modcp


If you want to change all your icons in modcp/usercp to Font Awesome, then use these codes.

Navigate to AdminCP > templates and style > your theme > usercp.css, delete everything, and then add the following:

Please register or login in order to unlock hidden content.

Now go back and add this code into modcp.css:
Please register or login in order to unlock hidden content.

If done correctly, your icons will look like this (modcp example):

[Image: 6052c6ef0c99693164036b1bd30faa1a.png]


You can of course, change the color of the icons to suit your needs etc, but it really is that simple.

I hope you enjoyed this small tut, and I hope I helped you somewhat into knowing the world of Font Awesome!

Regards, Addiction.
| A- Best forever .. | Cake - ;) | Slavowitz | Senpai | Sui | Sensei | H | fdigl |

Tropical
19-06-2015, 06:00 AM
oldfag
Administrators
Posts:
6,289
Joined:
Jan 2015
Likes:
1,781
Credits:
5,165
Reputation:
274
3 Years of Service
#2
Posted: 05-02-2015, 01:18 PM
Nice copy&paste.
Send me a message for help. (Read the help docs first)
Steam Wishlist - Anime Watchlist
Blaze
05-02-2015, 01:23 PM
Same shit, different day.
Staff
Posts:
1,450
Joined:
Jan 2015
Likes:
173
Credits:
1,395
Reputation:
93
3 Years of Service
#3
Posted: 05-02-2015, 01:24 PM
Thanks "Addiction", this will be useful for some guys ;)
Like some, love some, trust none.

[Image: YuwcFg6.png?2]
i'm so divine
Posts:
6,351
Joined:
Jan 2015
Likes:
319
Credits:
17
Reputation:
171
3 Years of Service
#4
OP
Posted: 05-02-2015, 01:27 PM
(05-02-2015, 01:18 PM)linkz Wrote: Nice copy&paste.

yeah copy paste thats why at last i put :3


Regards of that user
| A- Best forever .. | Cake - ;) | Slavowitz | Senpai | Sui | Sensei | H | fdigl |

Closed Account
Posts:
2,764
Joined:
Jan 2015
Likes:
144
Credits:
1,970
Reputation:
26
3 Years of Service
#5
Posted: 05-02-2015, 01:38 PM
[Image: LbBQLWl.png]
Novice
Posts:
47
Joined:
Feb 2015
Likes:
5
Credits:
52
Reputation:
0
3 Years of Service
#6
Posted: 05-02-2015, 05:07 PM
Well done, thank your spirit, thanks for share it
Closed Account
Posts:
31
Joined:
Sep 2015
Likes:
1
Credits:
17
Reputation:
0
2 Years of Service
#7
Posted: 15-10-2015, 03:00 AM
thanks for the share boi
Junior Member
Posts:
68
Joined:
Sep 2015
Likes:
2
Credits:
35
Reputation:
0
2 Years of Service
#8
Posted: 16-10-2015, 04:15 PM
I was under the assumption that you have to use the \f01jk something for it rather than the <i>. Anyways, thanks for this. I loved the outcome in the screenshot. Looks very clean and neat.
Novice
Posts:
36
Joined:
Jun 2015
Likes:
1
Credits:
3
Reputation:
0
3 Years of Service
#9
Posted: 19-10-2015, 08:23 PM
thanks for share it
goods
Novice
Posts:
24
Joined:
Oct 2015
Likes:
0
Credits:
25
Reputation:
0
2 Years of Service
#10
Posted: 19-10-2015, 09:20 PM
Nice copy and paste, thanks.
The last reply on this thread is older than a month. Please do not unnecessarily bump it.
Register an account or login to reply
Create an account
Create a free account today and start posting right away. It only takes a few seconds.
Login
Log into an existing account.
1 Guest(s)