Simple Machines Community Forum

Customizing SMF => Modifications and Packages => Topic started by: SychO on April 20, 2019, 05:30:45 AM

Title: FA Board Icons
Post by: SychO on April 20, 2019, 05:30:45 AM
Link to Mod (https://custom.simplemachines.org/mods/index.php?mod=4224)

FA Board Icons
FontAwesome icons for boards
GitHub Repository (https://github.com/SychO9/smf-fa-board-icons)

Settings
Each board has an icon & color fields
A default icon and color can be specified under Admin > Configuration > Modification Settings > Miscellaneous

Changelog

License
FA Board Icons is released under the MIT License. A full copy of this license is included in the package file.

Copyrights
FontAwesome Icons (https://fontawesome.com/license/free) © 2020
Title: Re: FA Board Icons
Post by: GigaWatt on April 21, 2019, 12:39:23 AM
Nice 8). Now I can do this :P :D.

(https://i.postimg.cc/LH0Gkm21/SHOT7032.png)
Title: Re: FA Board Icons
Post by: SychO on April 21, 2019, 05:12:13 AM
Interesting choice of color for the icons
Title: Re: FA Board Icons
Post by: lurkalot on April 21, 2019, 05:39:50 AM
Quote from: SychO on April 21, 2019, 05:12:13 AM
Interesting choice of color for the icons

GigaWatt does like blue.  ;)

Nice mod by the way.  I might give this one a go at some point.  8)
Title: Re: FA Board Icons
Post by: pocttopus on April 21, 2019, 11:33:07 AM
Amazing job SychO.  ;)

Title: Re: FA Board Icons
Post by: -Rock Lee- on April 21, 2019, 04:23:48 PM
Without a doubt, a great job @SychO. I comment on github but it does not cost me anything to leave the translation attached to the Latin Spanish here.


Regards!
Title: Re: FA Board Icons
Post by: SychO on April 21, 2019, 04:32:07 PM
Thank you Rock Lee, I will update the package as soon as I can.
Title: Re: FA Board Icons
Post by: GigaWatt on April 21, 2019, 05:31:41 PM
Quote from: SychO on April 21, 2019, 05:12:13 AM
Interesting choice of color for the icons

Quote from: lurkalot on April 21, 2019, 05:39:50 AM
GigaWatt does like blue.  ;)

Actually, the icon and the color was pretty random :P :D... but yeah, I do like blue ;).

Just wanted to test it out... see how the icons would look :).
Title: Re: FA Board Icons
Post by: addlife on April 23, 2019, 03:58:48 PM
Thanks for the mod! Changing board icons really sets the tone of a site.

I've used bigguys cbi v.05 to do that on my site. Although I'm assuming this makes it easier.
Title: Re: FA Board Icons
Post by: SychO on April 23, 2019, 04:07:02 PM
Well this is a 2.1 mod and it's not for image icons, you can set FontAwesome Icons (https://fontawesome.com/icons) with it :)
Title: Re: FA Board Icons
Post by: GigaWatt on April 23, 2019, 10:11:03 PM
Quote from: addlife on April 23, 2019, 03:58:48 PM
I've used bigguys cbi v.05 to do that on my site. Although I'm assuming this makes it easier.

I didn't see an option to make it board specific, so this pretty much means that whatever you set, it changes the icons of all boards.
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 04:18:46 AM
Which mod are you talking about Gigawatt ?
Title: Re: FA Board Icons
Post by: Bigguy on April 24, 2019, 06:48:13 AM
https://custom.simplemachines.org/mods/index.php?mod=511
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 07:09:05 AM
Quote from: Bigguy on April 24, 2019, 06:48:13 AM
https://custom.simplemachines.org/mods/index.php?mod=511

no I meant which mod is he talking about when he says that you can't choose icons per board, because yes you can with FA Board Icons as that's the whole point of it.
Title: Re: FA Board Icons
Post by: Bigguy on April 24, 2019, 07:27:28 AM
I thought he meant your mod does not work on a per board basis like mine does. If yours does, than not sure what he means. Just skip by this post, lol. I just woke up, so might be a bit slow still. :)
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 07:33:38 AM
Quote from: Bigguy on April 24, 2019, 07:27:28 AM
I thought he meant your mod does not work on a per board basis like mine does. If yours does, than not sure what he means. Just skip by this post, lol. I just woke up, so might be a bit slow still. :)

You're not slow, that's what he said, oh and good morning to you :P
Title: Re: FA Board Icons
Post by: Bigguy on April 24, 2019, 07:35:59 AM
Good morning back to you sir. :)
Title: Re: FA Board Icons
Post by: GigaWatt on April 24, 2019, 05:52:02 PM
Yeah, that is what I was actually saying, the icon change is global, not applicable per board.

So, I went back to my test site and looked at the mod and settings once more.

(https://i.postimg.cc/2SFc936k/SHOT7034.png)

If there are per board settings, where are they ???.
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 05:55:39 PM
in the specific board editing page :3
Title: Re: FA Board Icons
Post by: GigaWatt on April 24, 2019, 06:04:47 PM
Ah, yes, you're right ;).

(https://i.postimg.cc/XJFyxBjx/SHOT7035.png)

This mod is even cooler than I thought :)... oh I'm definitely implementing this on my forum when 2.1 becomes final 8).

PS: Did I miss something in the mod's description ???.

EDIT: My mistake, once again, you're correct ;).

Quote from: SychO on April 20, 2019, 05:30:45 AM
Each board has an icon & color fields
Title: Re: FA Board Icons
Post by: gecitli on April 25, 2019, 03:19:28 AM
nice mod

Make the style of Cbi v.05
#board_1 .fabi_icon .fa-comments:before { content:"\f1d8";}
#board_2 .fabi_icon .fa-comments:before { content:"\f436";}


(https://i.postimg.cc/2SSJQWPh/icon.jpg) (https://postimg.cc/YhTbkv2C)



Title: Re: FA Board Icons
Post by: SychO on April 25, 2019, 04:16:00 AM
You can already choose specific board icons from the board settings...
Title: Re: FA Board Icons
Post by: chadon on May 15, 2019, 03:34:46 PM
This is an interesting mod but we are loosing the "no new posts", new posts" icons with this mod.
In a future version, would it be possible to have different color fields for each boards? One for the "no new posts", one for the "new posts" and ideally, one for the "new posts in a subboard"?
Title: Re: FA Board Icons
Post by: SychO on May 15, 2019, 04:28:20 PM
Quote from: ForumMustang.com on May 15, 2019, 03:34:46 PM
This is an interesting mod but we are loosing the "no new posts", new posts" icons with this mod.
In a future version, would it be possible to have different color fields for each boards? One for the "no new posts", one for the "new posts" and ideally, one for the "new posts in a subboard"?

If I were to make a change for that, I'd use an opacity effect, i.e slightly translucent icons for no new posts and normal for new posts, more colors would only make things more complex because of the "Force default" options, and I like to keep things simple.
Title: Re: FA Board Icons
Post by: chadon on May 15, 2019, 05:04:45 PM
That's a good idea, I hope you will make a change for that.
Title: Re: FA Board Icons
Post by: maximus23 on May 16, 2019, 10:37:22 PM
Hello,

A variation easy to test :

File FA-BoardIcons.template.php

Search :

echo '
<a href="', ($context['user']['is_guest'] ? $board['href'] : $scripturl . '?action=unread;board=' . $board['id'] . '.0;children'), '" class="board_', $board['board_class'], ' fabi_icon"', !empty($board['board_tooltip']) ? ' title="' . $board['board_tooltip'] . '"' : '', '>
<i class="', $icon, '"', !empty($color) ? ' style="color:'.$color.'"' : '', '></i>
</a>';


Replace by :
if ($board['new'] == 1) {

echo '
<a href="', ($context['user']['is_guest'] ? $board['href'] : $scripturl . '?action=unread;board=' . $board['id'] . '.0;children'), '" class="board_', $board['board_class'], ' fabi_icon_new"', !empty($board['board_tooltip']) ? ' title="' . $board['board_tooltip'] . '"' : '', '>
<i class="', $icon, '"', !empty($color) ? ' style="color:'.$color.'"' : '', '></i>
</a>';
}

else

echo '
<a href="', ($context['user']['is_guest'] ? $board['href'] : $scripturl . '?action=unread;board=' . $board['id'] . '.0;children'), '" class="board_', $board['board_class'], ' fabi_icon"', !empty($board['board_tooltip']) ? ' title="' . $board['board_tooltip'] . '"' : '', '>
<i class="', $icon, '"', !empty($color) ? ' style="color:'.$color.'"' : '', '></i>
</a>';

}


Save.

File fabi.css

Search :
.board_icon .fabi_icon {
text-align: center;
display: flex;
align-items: center;
margin: 0 auto;
background: none;
font-size: 2.5em;
text-decoration: none;
color: #6e91ae;
}


Replace by :
.board_icon .fabi_icon {
text-align: center;
display: flex;
align-items: center;
margin: 0 auto;
background: none;
font-size: 2.5em;
text-decoration: none;
color: #6e91ae;
overflow: hidden;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
width: 60px;
    height: 60px;
padding: 13px;

}

.board_icon .fabi_icon_new {
text-align: center;
display: flex;
align-items: center;
margin: 0 auto;
background: none;
font-size: 2.5em;
text-decoration: none;
color: #6e91ae;
background: #d7daf3;
overflow: hidden;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
width: 60px;
    height: 60px;
padding: 13px;
}


:)
Title: Re: FA Board Icons
Post by: Diego Andrés on July 14, 2019, 12:33:53 AM
I prefer the opacity option, but that is really good alternative.
Title: Re: FA Board Icons
Post by: AllanD on June 06, 2020, 07:49:49 PM
I know this is an old thread but I was coming here looking to see if the opacity option was still in thoughts. Having a no new post difference would be great.
Title: Re: FA Board Icons
Post by: kilk on June 09, 2020, 04:01:43 PM
This is an awesome mod, needs opacity as an option for sure!
Title: Re: FA Board Icons
Post by: Apllicmz on June 15, 2020, 03:00:33 PM
Nice mod
Update portuguese_PT

Title: Re: FA Board Icons
Post by: SychO on June 15, 2020, 03:34:55 PM
Quote from: AllanD on June 06, 2020, 07:49:49 PM
I know this is an old thread but I was coming here looking to see if the opacity option was still in thoughts. Having a no new post difference would be great.

Quote from: kilk on June 09, 2020, 04:01:43 PM
This is an awesome mod, needs opacity as an option for sure!

I'll try updating this soon.




Quote from: Joomlamz on June 15, 2020, 03:00:33 PM
Nice mod
Update portuguese_PT

Thank you, I'll make sure to add it :)
Title: Re: FA Board Icons
Post by: AllanD on June 15, 2020, 08:52:12 PM
Thank you for the update Sych0
Title: Re: FA Board Icons
Post by: SychO on June 21, 2020, 06:27:33 PM
Update: Version 1.3

Title: Re: FA Board Icons
Post by: AllanD on June 23, 2020, 04:52:44 PM
Thank you for the update.
Title: Re: FA Board Icons
Post by: DJ Omnimaga on June 28, 2020, 10:52:56 AM
Quote from: SychO on June 21, 2020, 06:27:33 PM
Update: Version 1.3

  • Added Portuguese Translation by Joomlamz (https://www.simplemachines.org/community/index.php?action=profile;u=79248)
  • Added opacity effect option on new/no new posts. (Needs to be manually turned ON from the settings, style can be edited in the fabi.css file)
  • Updated FontAwesome from 5.8.1 to 5.13.1
I have updated to version 1.3 and made sure that in the CSS, no new post was set to 0.6 opacity and the option was turned ON in my settings, yet they still showed with no opacity at all.
Title: Re: FA Board Icons
Post by: SychO on June 28, 2020, 11:12:51 AM
Forum link?
Title: Re: FA Board Icons
Post by: DJ Omnimaga on June 28, 2020, 02:12:19 PM
It's the codewalr.us link in my signature
Title: Re: FA Board Icons
Post by: SychO on June 29, 2020, 09:57:57 AM
try disabling resource minimization and then enabling it again.

I should have changed the CSS file key but I didn't.
Title: Re: FA Board Icons
Post by: DJ Omnimaga on June 30, 2020, 11:05:15 AM
How would I do that? I couldn't find any results for "disabling resource minimization in SMF" in Google.
Title: Re: FA Board Icons
Post by: SychO on June 30, 2020, 11:27:18 AM
Admin > Configuration > Features and Options > General > Minimize CSS and JavaScript files
Title: Re: FA Board Icons
Post by: DJ Omnimaga on July 02, 2020, 10:28:50 AM
Thanks, it works now! I had to keep the option disabled, though, else it won't work when I re-enable it again.
Title: Re: FA Board Icons
Post by: Kindred on December 04, 2020, 12:17:53 PM
This is cool, SychO

As a note, it's simple to install this mod and then also add alternative font-packs

Code ( in Sources/FA-BoardIcons/FA-BoardIcons.php find) Select

loadCSSFile('fabi.css', array(
'force_current' => false,
'minimize' => true
), 'smf_fabi');

Code (add code like this after it) Select

loadCSSFile('starwars-glyphicons.css', array(
'force_current' => false,
'minimize' => true
), 'smf_swglyph');


Make sure that your additional font pack CSS file is added in Themes/default/css and that the reference in the CSS file (if local/relative) points the the correct location
(in my case, the font css references the font itself in an additional "fonts" directory)
and then you can reference them in the board settings, just like you would the fas fa icon (in my case like so...  swg swg-r2d2-3)

example: https://test2.turtleshellprod.com/index.php
Title: Re: FA Board Icons
Post by: SychO on December 04, 2020, 06:04:49 PM
Oh that's neat! didn't think you could use different fonts with it as well.

Also you could add the call to loadCSSFile in your template file as well (index.template.php) instead of editing the source file, you'd just have to add it before template_css function is called.
Title: Re: FA Board Icons
Post by: gevv on February 03, 2021, 10:33:35 AM
Hi @SychO

Redirect board count problem  smf 2.1 rc3 https://github.com/SimpleMachines/SMF2.1/issues/6490
Title: Re: FA Board Icons
Post by: SychO on February 03, 2021, 12:34:40 PM
Quote from: gevv on February 03, 2021, 10:33:35 AM
Hi @SychO

Redirect board count problem  smf 2.1 rc3 https://github.com/SimpleMachines/SMF2.1/issues/6490

Thanks for the report, I'll look into it when I can
Title: Re: FA Board Icons
Post by: Kindred on February 03, 2021, 12:50:02 PM
hmmmm... I have the mod installed into 2.1 RC3 and it seems to work

https://test2.turtleshellprod.com/index.php


Edit... Oh, wait, I see it now
Title: Re: FA Board Icons
Post by: camefromwpandmybb on May 31, 2021, 11:47:33 PM
hi.  what did i do wrong.  i installed this via package manager, installed fine. went into my db and checked to see if the two tables were added, etc.  all is fine.  but when i went to the modifications> misc section, there were no options to change the boards.

running 2.1rc3 and a reponsive theme
Title: Re: FA Board Icons
Post by: camefromwpandmybb on May 31, 2021, 11:53:54 PM
hi i solved my own issue.  looks like even though the steps to install it through package manager had zero errors, i went via ftp, saw that sources and themes folders were not uploaded, the only thing that happened was the database.php file ran and changed the tables.  so i uploaded both sources and themes folders, now it works

weird?
Title: Re: FA Board Icons
Post by: Aleksi "Lex" Kilpinen on June 12, 2021, 02:44:43 AM
Small, but somewhat irritating bug that I came across. This mod changes redirect -boards to look and act like actual boards.
(This was tested on a recent 2.1 version from Github.)

Edit: Oh, right - I wasn't the first one to mention :P Well, here's an example anyways.
Title: Re: FA Board Icons
Post by: smartmouse on July 15, 2021, 06:49:58 AM
Hello, are you going to release a version for SMF 2.1 RC4?
Title: Re: FA Board Icons
Post by: Speed King on July 15, 2021, 07:09:07 AM
Quote from: smartmouse on July 15, 2021, 06:49:58 AM
Hello, are you going to release a version for SMF 2.1 RC4?

Version 1.3 works fine with SMF 2.1 RC4 :)
Title: Re: FA Board Icons
Post by: smartmouse on July 15, 2021, 08:30:51 AM
Quote from: Speed King on July 15, 2021, 07:09:07 AM
Quote from: smartmouse on July 15, 2021, 06:49:58 AM
Hello, are you going to release a version for SMF 2.1 RC4?

Version 1.3 works fine with SMF 2.1 RC4 :)


You are right, thank you.
Title: Re: FA Board Icons
Post by: Mick. on October 15, 2021, 10:13:20 PM
Dude! This nifty mod is off the hook! Makes the feather theme look like an app lol

featherbicons.jpg
Title: Re: FA Board Icons
Post by: TurtleKicker on November 01, 2021, 02:24:45 PM
Bug?

Tried setting a specific icon, didn't work (just this one icon, it's working fine otherwise). So let's say a person makes a typo.

But clearing the field and then [Modify] in SMF admin doesn't clear the field, so the icon remains broken (blank). Return to the board editor, and the old incorrect fa text is still there. No matter how many times you clear and [Modify].

How to actually "clear"?
Title: Re: FA Board Icons
Post by: cuongvttt on December 22, 2021, 11:36:59 AM
Hello guys,

This Modification works so perfectly in the version SMF 2.1 RC3 but it causes SMF 2.1 RC4 to load slowly on mobile devices. I wish the author could update the mod as soon as possible :D

Thank you guys so so much for your hard work :D
Title: Re: FA Board Icons
Post by: Kindred on December 22, 2021, 12:09:24 PM
??   can not replicate.

test2.turtleshellprod.com is running this mod on 2.1RC4 and I notice no slowdowns
Title: Re: FA Board Icons
Post by: cuongvttt on December 22, 2021, 09:44:12 PM
Hello Kindred,

Please have a look at these pictures.

Title: Re: FA Board Icons
Post by: Diego Andrés on December 22, 2021, 10:33:14 PM
Did you test with and without the mod for your site?
What exactly is the resource causing problems for you?
Title: Re: FA Board Icons
Post by: pikeman on February 27, 2022, 02:34:38 PM
Works well with 2.1.1. :)
Title: Re: FA Board Icons
Post by: Senkusha on June 27, 2022, 07:48:58 PM
Sorry, I know this is an old thread, but do I have to use an FA icon, or could I use an icon I make?
Thank you!
Title: Re: FA Board Icons
Post by: Kindred on June 27, 2022, 07:51:25 PM
This mod, by design will only use fafa icons

I modified it to use starwars icons, so I suppose that you could modify it to use your own.   But not a single icon, it uses a whe icon set, along with the associated css and references
Title: Re: FA Board Icons
Post by: Senkusha on June 28, 2022, 08:12:22 PM
Oh bummer.  I guess I'll have to wait for the Custom Board Icons mod to work for 2.1.x.