Thread Rating:
  • 6 Vote(s) - 4.33 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[For 1.8] Font-Awesome Forum Icons & Unique Ficons
#11
(08-11-2014, 03:25 PM)Eric J. Wrote:
(08-10-2014, 09:41 PM)iAndrew Wrote: Clear.png puts a big grey border around the icon messing up the forum

Also where would i find the icons for the new redirect and Locked forum on the index?

No idea why you're getting a border, but I'm guessing it's related to a custom theme you're using.

And the icons are decided here:

.forum_offlock i:before { content: "\f023"; }
.forum_offlink i:before { content: "\f0c1"; }

Also the reason I'm avoiding updating this tutorial right now is because if I can get THIS finished up, the tutorial will be a lot different.

Yea it's for a custom theme i'm using it on. decided to cheat a little and just use images with the icons till a fully working fix is available.

Take it that github is to get the mark forum read fixed?
[Image: sig2.jpg]
#12
Yeah exactly, after this there wouldn't be a need for the clear.png part.
#13
Updated to work with the latest version of 1.8. Shouldn't be any more problems with marking a forum read. Big Grin

Will update soon with subforum Font-Awesome icons.

Edit: Updated with subforum Font-Awesome icons.
#14
Very easy to follow tut. Surely going to get back to this.
#15
Great tutorial, Thanks.
#16
In Step 2 you put <div> tags but the default code uses <span> tags.

Great tut!
I don't give support on PM.
#17
(09-25-2014, 12:14 PM)eNvy Wrote: In Step 2 you put <div> tags but the default code uses <span> tags.

Great tut!

You're right, I forgot to update after the valid HTML was added. Changed, thanks. Smile
#18
Added a short tut to the end of the first post on finding icon codes to use for the offlock/offlink icons.
#19
Would it be possible to make it so each forum has a different font awesome icon? I tried toying with the code but failed pretty miserably!
#20
(09-29-2014, 04:05 AM)TheVirtualMarket Wrote: Would it be possible to make it so each forum has a different font awesome icon? I tried toying with the code but failed pretty miserably!

Yes it definitely is, you just have to make use of this

{$forum['fid']}

So for example:

<div class="forum_status forum_{$lightbulb['folder']} forum_{$forum['fid']} ajax_mark_read" title="{$lightbulb['altonoff']}" id="mark_read_{$forum['fid']}"><i class="fa fa-comments"></i></div>

And then in your CSS you would use this code:

.forum_3 i:before {
    // CSS for other icon
}

Replacing the number 3 with whichever forum you're trying to style (You can find forum IDs in the address bar while editing a forum in the ACP), and then using the short tutorial at the bottom of the first post for different icons.


Forum Jump:


Users browsing this thread: 1 Guest(s)