MyBB Community Forums

Full Version: How to replace icon FA5?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I wonder how you can easily replace these icons found under themes FA5?

The provided link no longer works.

https://community.mybb.com/thread-220017.html

https://community.mybb.com/mods.php?acti...w&pid=1188

[Image: iCdbmjv.png]
(2020-01-19, 04:32 AM)OakleY Wrote: [ -> ]I wonder how you can easily replace these icons found under themes FA5?

The provided link no longer works.

https://community.mybb.com/thread-220017.html

https://community.mybb.com/mods.php?acti...w&pid=1188

[Image: iCdbmjv.png]



Super easy way: https://community.mybb.com/mods.php?action=view&pid=909 * this way you can edit per forum and mini icon via edit forum settings in acp Wink

Note these particular instructions for themes that already have fa5 in them like fa5 theme does:

https://github.com/vintagedaddyo/MyBB_Pl...meIconsFA5

* i suggest the 3 template revert option of the following instructions over the msnusl alternative of same instructiins as it is easier.


Final note for existing themes that have font-awesome already installed:
If your theme has custom formbit template modifications ie: forumbit_depth2_cat, forumbit_depth2_forum, forumbit_depth3_statusicon you will need to revert those templates to default before installing the plugin and also remove any other font-awesome include say for example in headerinclude if already present in the theme. if you don't revert them you would have to manually insert the plugin calls.

mainly what you need to find is where to add the plugin calls for example:

In forumbit_depth2_forum & forumbit_depth2_cat & forumbit_depth3_statusicon you would find:


id="mark_read_{$forum['fid']}">


And add this after:


<i class="{$forum['myfontawesomeicon']}"></i>

In headerinclude template you would also need to make sure that after:


{$stylesheets}

There is the following include:

<link href="{$mybb->asset_url}/inc/plugins/myfontawesomeicons/font-awesome-5/css/all.css" rel="stylesheet" type="text/css">


And that your font awesome include in that template or wherever it is included is commented
<!-- -->
out so as to avoid version conflicts.


* As far as the old deleted tutorial: ie: manual way instructions, that would have to be more in depth and most likely will have to wait until such a time that I perhaps rewrite the deleted tutorials. ** since the tutorial coverd all fa icons in theme not just forum icons and was a rather massive in depth tutorial




But if the aforementioned options doesn't feel easier for you and you want to manually edit css of forums then you need to find this area in global.css

global.css Forum and subminiforum icon styling
** Forums **/

.forum_status {
height: 50px;
width: 50px;
font-size: 30px;
text-align: center;
}

.forum_status i {
display: inline-block;
line-height: 50px;
}

.forum_on {
color: #0094d1;
}

.forum_off, .forum_offclose, .forum_offlink {
color: #333;
opacity: 0.5;	
}

.forum_off i {
opacity: .4;
}

.forum_offclose i:before {
content: "\f023";
}

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


/** Ficons **/

.ficons_2 i:before {
content: "\f000";
}

.ficons_3 i:before {
content: "\f1ba";
}

.ficons_4 i:before {
content: "\f2e7";
}

.ficons_5 i:before {
content: "\f3fd";
}

.ficons_6 i:before {
content: "\f03e";
}

.ficons_7 i:before {
content: "\f000";
}

.ficons_8 i:before {
content: "\f1ba";
}

.ficons_9 i:before {
content: "\f2e7";
}

.ficons_10 i:before {
content: "\f3fd";
}

.ficons_11 i:before {
content: "\f03e";
}

.ficons_12 i:before {
content: "\f000";
}

.ficons_13 i:before {
content: "\f1ba";
}

.ficons_14 i:before {
content: "\f2e7";
}

.ficons_15 i:before {
content: "\f3fd";
}

.ficons_16 i:before {
content: "\f03e";
}



/** Subforums **/

.subforumicon {
height: 10px;
width: 10px;
display: inline-block;
margin: 0 5px;
}

.subforum_minion {
color: #333;
}

.subforum_minioff, .subforum_minioffclose, .subforum_miniofflink {
color: #333;
opacity: 0.5;	
}

.subforum_minioff {
opacity: .4;
}

.subforum_minioffclose i:before {
content: "\f023";
}

.subforum_miniofflink i:before {
content: "\f0c1";
}

/** sFicons **/

.sficons_2 i:before {
content: "\f000";
}

.sficons_3 i:before {
content: "\f1ba";
}

.sficons_4 i:before {
content: "\f2e7";
}

.sficons_5 i:before {
content: "\f3fd";
}

.sficons_6 i:before {
content: "\f03e";
}

.sficons_7 i:before {
content: "\f000";
}

.sficons_8 i:before {
content: "\f1ba";
}

.sficons_9 i:before {
content: "\f2e7";
}

.sficons_10 i:before {
content: "\f3fd";
}

.sficons_11 i:before {
content: "\f03e";
}

.sficons_12 i:before {
content: "\f000";
}

.sficons_13 i:before {
content: "\f1ba";
}

.sficons_14 i:before {
content: "\f2e7";
}

.sficons_15 i:before {
content: "\f3fd";
}

.sficons_16 i:before {
content: "\f03e";
}

Thanks V Wink
(2020-01-19, 05:48 AM)OakleY Wrote: [ -> ]Thanks V  Wink

No worries.. Smile