26

We contributed to font-awesome 5 (yea), and we are looking from moving from our existing icons (Symbol set) to font-awesome. Will the naming of icons and usage of font-awesome 5 be backwards compatible with font-awesome 4.7?

IE: Should we go to 4.7 now, and have very easy upgrade to 5.0? OR should we hold off until font-awesome 5 comes out?

Daniel
  • 6,858
  • 5
  • 40
  • 46

7 Answers7

14

It's not backwards compatible.

I just publish a script to do the migration from 4 to 5 in:

https://github.com/estebandelaf/scripts/blob/master/fontawesome4to5.sh

PS: I know the post is from a year ago, but is the second result in google for "fontawesome migration script 4 to 5".

delaf
  • 191
  • 2
  • 5
  • Can you please explain what do we need to do with your script? I tried upgrading our existing project from 4.7 to 5.0 directly and have to revert back. – Naomi May 03 '18 at 17:23
  • 4
    Would've been even better if the comments were in English :) – The Onin Oct 05 '18 at 16:44
  • Getting errors running this on my Mac: `sed: 1: "s/fa[[:space:]]fa-addre ...": bad flag in substitute command: 'I'` `sed: 1: "./app/pages ...": invalid command code .` – cloakedninjas Jun 01 '20 at 08:16
6

Since above mentioned scripts doesn't work for icons like thermometer,battery etc. Created a python script that works for all icons. Below is the link.

https://github.com/abkcode/fontawesome4to5

For details about the upgrade changes visit.

https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4

Abhijeet Kambli
  • 142
  • 1
  • 11
  • Using Python 3.7.2 the print statements in the script need to be modified to include the print content in parenthesis. print(fpath) print("\nAbove files have been modified") – glez Feb 27 '19 at 15:42
2

Fontawesome provides v4-shiv.js that transitions old v4 icons into v5 but it's only for the SVG+JS framework.

If you are using the CSS framework with webfonts, here is a jQuery javascript that does the same thing.

https://gist.github.com/timint/fb53929ff196d0a5754188bd93a80cef

tim
  • 1,819
  • 2
  • 21
  • 37
  • Remember to adjust the "fa" to "far" "fab", when needed. – Bernard Saucier May 10 '18 at 12:37
  • This is already taken care of: $('.fa.'+fa4).removeClass('fa').removeClass(fa4).addClass(fa5); – tim May 11 '18 at 18:56
  • Most of the icons that didn't get their name changed did get their "main" class changed. The plugin you suggest only adjusts the "main" class of the icons that changed name. – Bernard Saucier May 11 '18 at 21:34
  • I got the list from the official site where it stated "Icon Name Changes Complete List". I updated the list with my own making instead. How about now? – tim May 17 '18 at 21:34
  • 1
    There is now a shim file for the css styles – J. Allen Nov 08 '19 at 18:30
2

I have created a python script to upgrade from 4.7 to 5.1 without the need to. It worked best for me. https://gist.github.com/ilanben/38ef4d4545cb74089375af0ceecf439b

Update: Fixed the link which was temporarily broken

Ilan.b
  • 563
  • 6
  • 17
2

Simply use use.fontawesome.com/releases/v5.10.1/css/v4-shims.css

More details : https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4

Meraj al Maksud
  • 1,402
  • 2
  • 20
  • 32
javad rhmi
  • 21
  • 2
0

This python and shell scripts not properly worked me. I'm using Kendo Framework this reason fontawesome shims script dont change my classes. because shim script load before the component render.

I made own script in node.js. https://github.com/KiPSOFT/fontawesome4to5

0

I made (yet another) script:

Gist here: https://gist.github.com/cloakedninjas/9e4e029c92a141c547dabdabe9ccbb1d

It's in Node, it uses a CSV input file based off of https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4#name-changes (copied into Google Sheets and exported as CSV.

The thinking being, if future upgrades follow the same table structure, it will be trivial to re-run.

cloakedninjas
  • 3,346
  • 1
  • 27
  • 41