[How To?] Change FA4 to FA5

[LittleFoxy]

Anyone here that can help me changing my Font Awesome 4 icons to Font Awesome 5 in my forum? The theme that I downloaded is using by default FA4 but I don't wanna mess up the site 

[User 6029]

Anyone here that can help me changing my Font Awesome 4 icons to Font Awesome 5 in my forum? The theme that I downloaded is using by default FA4 but I don't wanna mess up the site 

Two ways to do this: one is manually change the fa inlude and the modify the css and templates for the fa5 changes which takes longer than option 2

Two while faster and more simple than option 1 still requires alot of the same work but in the end has more advantages, option 2 is install the myfontawesomeicons 5 plugin following the existing fa themes install instruction for either forumbit template reverts or since your theme has highly customized forumbits follow the same instructions but do the manual insert steps, as then that covers forum status icons and mini forum status icons that can now be changed via forum settings and since now you have the fa5 library already installed via the plugin and the forums status icons out of the way then you can go in and modify the remaining icons on the theme templates and css for the font awesome 5 icon changes as many of the icon names and numbers have changed from 4 to 5 as well as the font name is not Fontawesome anymore it is Font Awesome 5  Free and for most icons Font weight 900  or 600  and content  icon id numbers many have changed as far as css is needed but inline since now icons inline may be fas fab far etc etc the inlines would need changing also some of the icon names as well

Note neither way is as simple change the library include and wam bam thank ya mam job done and does take some time and edits, also note while fa5 has a fallback to help transition some of the fa4 icons will still work with old calls but that does not mean your task is done the fallback is there to help during transition and each and every icon still needs to be edited to reflect the new way in fa5, hopefully that makes sense.

Example you could look at the igame theme I updated for 1.8.22 for another user:
https://community.mybb.com/thread-165251...pid1342425 *

* and compare the two versions of it as far as fa changes in templates and css as one still has  fa4 and the other fa5 if you want a general idea about the process of transition for your own mindset



On a unrelated side note but related to the theme: the lobos theme is a modified version of netpen https://community.mybb.com/mods.php?action=view&pid=727 and netpen is actually a responsive version of envy's square theme as I noted ages ago in 2016 here https://community.mybb.com/thread-160302...pid1247746 and netpen is released without crediting the source or original author as requested in license and to me at least I agree with envy's note about respect and what should have been done is keep existing credits intact and add the editor credit to new release with source credits also.

Example: say I wanted to release a version of netpen that I modified, I would respectfully credit the actual source which misharnet did not, ahem, square by envy, then credit, ahem, netpen by misharnet, then add my modification credits, as one can see that is the correct respect factor and adherance to release license and release terms, and is common practise and knowledge in the open source develooment community, food for thought.

Square theme: https://community.mybb.com/mods.php?action=view&pid=172

And..., here is the square theme license:

Terms and conditions

LICENCE
---------------------------------------------------------------------------------------------------

You can edit, remove and modify whatever you want.

If you respect my work, leave the credits with the link to my own account of MyBB forums there.

If you don't respect my own work, go ahead and remove it, but I'm sure you will not get official
support from myself or MyBB team.

anyhoo, alot of owl themes "premium" themes are simply netpen modified which is sourced on envy's theme source but this is not surprising as the owlthemes have done this to other designers if you search through the forums here you will find tons of complaints about selling ripped work so one knowing the history of the owl themes theme author I am not suprised they are still selling to people unaware of the history or sources. Personally I would never buy from such folks and know that such folks like that are the main cause of why not all but some of the old school designers no longer do stuff for mybb.

[LittleFoxy]

Anyone here that can help me changing my Font Awesome 4 icons to Font Awesome 5 in my forum? The theme that I downloaded is using by default FA4 but I don't wanna mess up the site 

Two ways to do this: one is manual change the fa include and then modify the css and templates for the fa5 changes

Two is install the myfontawesomeicons 5 plugin following the existing fa themes install instruction fir either forumbit template reversions or since your theme has highly customized forumbits follow the same instructions but do the manual insert steps, as then that covers forum stus icons and mini forum status icons that can now be changed via forum settings and since now you have the fa5 library already installed via the plugin and the forums status icons out of the way then you can go in and modify the remaining icons on the theme templates and css for the font awesome 5 icon changes as many of the icon names and numbers have changed from 4 to 5 as well as the font name is not Fontawesome anymore it is Font Awesome 5  Free and for most icons Font weight 900  or 600  and content  icon id numbers many have changed as far as css is needed but inline since now icons inline may be fas fab far etc etc the inlines would need changing also some of the icon names as well

I will try the first thx

[User 6029]

I will try the first thx

Best of luck!

Two ways to do this: one is manually change the fa inlude and the modify the css and templates for the fa5 changes which takes longer than option 2

Two while faster and more simple than option 1 still requires alot of the same work but in the end has more advantages

[LittleFoxy]

I will try the first thx

Best of luck!

Two ways to do this: one is manually change the fa inlude and the modify the css and templates for the fa5 changes which takes longer than option 2

Two while faster and more simple than option 1 still requires alot of the same work but in the end has more advantages

If I give you admin to fix it, will you do it?

[User 6029]

I will try the first thx

Best of luck!

Two ways to do this: one is manually change the fa inlude and the modify the css and templates for the fa5 changes which takes longer than option 2

Two while faster and more simple than option 1 still requires alot of the same work but in the end has more advantages

If I give you admin to fix it, will you do it?

Currently limited on free time which option are you wanting? If it is option one, I don't need admin access I just need a copy of the theme package to install and modify on my localhost... if it is option  two i could also avoid needing admin access by getting the theme pkg from you to install on localhost and install plugin on localhost modify so the plug inserts are existant in said theme then modify the rest of the icons in the theme for fa5 but either of those two options would be dependant on two things one sending me privately the theme ppkg to modify and two your patience as this will have to be done when I have the free time to do so  after getting the theme pkg from you

[LittleFoxy]

I will try the first thx

Best of luck!

Two ways to do this: one is manually change the fa inlude and the modify the css and templates for the fa5 changes which takes longer than option 2

Two while faster and more simple than option 1 still requires alot of the same work but in the end has more advantages

If I give you admin to fix it, will you do it?

Currently limited on free time which option are you wanting? If it is option one, I don't need admin access I just need a copy of the theme package to install and modify on my localhost... if it is option  two i could also avoid needing admin access by getting the theme pkg from you to install on localhost and install plugin on localhost modify so the plug inserts are existant in said theme then modify the rest of the icons in the theme for fa5 but either of those two options would be dependant on two things one sending me privately the theme ppkg to modify and two your patience as this will have to be done when I have the free time to do so  after getting the theme pkg from you

I will pm you after

[User 6029]

I will try the first thx

Best of luck!

Two ways to do this: one is manually change the fa inlude and the modify the css and templates for the fa5 changes which takes longer than option 2

Two while faster and more simple than option 1 still requires alot of the same work but in the end has more advantages

If I give you admin to fix it, will you do it?

Currently limited on free time which option are you wanting? If it is option one, I don't need admin access I just need a copy of the theme package to install and modify on my localhost... if it is option  two i could also avoid needing admin access by getting the theme pkg from you to install on localhost and install plugin on localhost modify so the plug inserts are existant in said theme then modify the rest of the icons in the theme for fa5 but either of those two options would be dependant on two things one sending me privately the theme ppkg to modify and two your patience as this will have to be done when I have the free time to do so  after getting the theme pkg from you

I will pm you after

No worries, let me know. Anyhoo, looking at your source it looks like you are trying to use the myfontawesomeicons 4 version?  I know this because I see the headerinclude for the plugin here:

<link href="https://geekhall.xyz/inc/plugins/myfontawesomeicons/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

Also not since you are including the locally hosted fa library via the plugin you need to remove any other fa library includes to avoid confusion, conflicts and duplicate includes like this one for example:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

I also notice you attempted to manually add the stylesheet

https://geekhall.xyz/css.php?stylesheet%5B0%5D=110

*

Note: the attached stylesheet is called myfontawesomeicons.css that the fa4 plugin uses

Also note: like I told Anon in another support request about same theme and the plugin he ran into having duplicate icons and that is caused by either one not correctly installing the manual inserts and say still leaving the existing theme fa icon call in the forumbit and then adding the plugin icon insert (easy mistake) thus loading two icons ie: theme icon and plugin icon rather than just plugin icon or two if not that and installed correctly then thats because your theme has forum icons styling in dark.css with !important and that is conflicting with the plugins !important override, comment out the forum overrides in dark.css

Comment out this in dark.css:

/*
.forum_status {
	font-size: 17px !important; 
	text-align: center;
	padding-top: 5px !important; 
}

.forum_status i {
	display: inline-block
}

.forum_on {
	color: #527fbd;
	font-size: 17px !important; 
	opacity: .8;
}

.forum_off, .forum_offlock, .forum_offlink {
	color: #527fbd;
}

.forum_off {
	opacity: 1;
}

.forum_on::before {
    font-family: 'FontAwesome';
    content: "\f07c";
}

.forum_off::before {
    font-family: 'FontAwesome';
    content: "\f07b";
}

.forum_offlock:before {
	font-family: 'FontAwesome';
	content: "\f023"
}

.forum_offlink:before {
	font-family: 'FontAwesome';
	content: "\f0c1"
}

.ministatus {
	line-height: 2;
	padding-right: 0px;
	padding-left: 10px;
}

.ministatus .forum_on, .ministatus .forum_off, .ministatus .forum_offlock, .ministatus .forum_offlink {
	font-size: 16px !important; 
}

.subforumicon {
    height: 10px;
    width: 10px;
    margin: 0 10px 0 -7px;
   opacity: 1 !important; 
}

.subforum_minion {
	color: #434a56
}

.subforum_minioff, .subforum_miniofflock, .subforum_miniofflink {
	color: #434a56
}

.subforum_minioff {
	opacity: .4
}

.subforum_miniofflock i:before {
	content: "\f023"
}

.subforum_miniofflink i:before {
	content: "\f0c1"
}
*/

* I also noted in that support request that this theme is not current as you can see by the offlock usage here as well as the lock usage in threads status as well as most likely the respective templates and mybb changed from lock to close a good while ago,  just pointing that fact out.

Not sure if you have the followed the manual insert instructions for existing fa themes but following them and taking note of what I just mentioned should get you sorted for the fa4 myfontawesomeicons plugin you are trying to use.

[note] installing the fa5 myfontawesomeicons plugin is a very similar but not exactly same process as there are a few diffeence like the include libraryname and css is different.