vektor-inc / lightning

Lightning is powerful them for WordPress.
https://lightning.vektor-inc.co.jp
GNU General Public License v2.0
103 stars 28 forks source link

FontAwesome4 からFontAwesome5 へのバージョンアップ #191

Closed catherine87 closed 6 years ago

catherine87 commented 6 years ago

■バージョンアップによる変更点 ★参照 https://qiita.com/tamaina/items/4a0747bf20296e0aab15


■バージョンアップ手順 ★参照 https://fontawesome.com/how-to-use/upgrading-from-4#icon-name-changes-complete-list


1.プロジェクトからFont Awesome Version 4に関連するファイルを削除 2.からFont Awesome V4のJSまたはCSSへの参照を削除 3.FA5を使用するあなたの方法を選び、ファイル読み込み 4.バージョン4と5の間で異なる名前を持つアイコンを検索して置き換え (アイコン名変更完了リストがあるのでそれを元に記事を作成して公開。自力で変更してもらう) 5.Font Awesome 5 Freeで疑似要素(:after,:before)のcontent指定する場合の対応(CSS) -> https://qiita.com/Garyuten/items/6d68da5cdac6dab9ba26


■埋め込み js について ★参照 https://fontawesome.com/get-started/svg-with-js


<head>
  <script defer src="/static/fontawesome/fa-v4-shim.js"></script>
  <!--your other font awesome references-->
</head>

catherine87 commented 6 years ago

@kurudrive

こんな感じでバージョンアップに関して進めれば、あまりトラブルなくいけるかなーっと思っていますーm( )m

kurudrive commented 6 years ago

@catherine87 ありがとう。たぶんウチの場合利用者が多くて利用状況が人それぞれだから結局両方のバージョンを切り替えられるようにしないと厳しいかなー。 ExUnit内で使ってるアイコンのクラス名もバージョンで切り替えたりしないといけないかぁ.... はふー。 今からチマチマやりまする(・w・;

catherine87 commented 6 years ago

@kurudrive

カスタマイザー上でラジオボタンとかで「4」か「5」を選択できるようにするみたいな感じですか?

アイコンのクラス名は、末が「xxx-xxx-o」じゃないものは変更しなくても表示されますみたいな記事も見ましたけど定かではないし、いずれ完全移行のときがくると思われるので今回対応しちゃったほうが後々楽かなーと思います(´ `)

kurudrive commented 6 years ago

んご、書いてくれてるけど /static/fontawesome/fa-v4-shim.js である程度サポートしてくれるのね... まーでもそもそも従来は fa の方が埋め込みだからセレクター必要かーごにょごにょ...