FontAwesome 5 は公式のCDNでCSS配布をやめるらしい

  • ---

    LINEで送る
  • -

    ブックマーク
  • -

    pocket
  • -

    rss
FontAwesome
by 写真AC一部筆者加工

WebアイコンフォントにFontAwesomeがあります。

CSSファイルを読み込むのに、CDNが一番かんたんな方法ですが、公式のCDNの配布をやめるそうです。

ということで代わりのCDNからもってきます。

Font Awesome 5は公式のCDNでCSS配布をやめます。

正確には

CSSを動的に展開するJavaScriptをCDNで配布する

ので、『CSSファイルの配信』をやめます。SVGのJavaScript配布と統合するようです。

今回はバージョン5のはなしです。

バージョン4はCDNの配布をつづけます。betaなので今後はわかりませんが。

FontAwesome CDN End
FontAwesome公式CDNページ

2019年7月7日現在、Font Awesomeのアカウントを作成しないと見れません。

ということで、CDNJSというCDNサービスを使います。

all.min.cssを選んで、『Copy Link Tag』でコピーします。

自分のサイトのHTMLのヘッダ(<head>)に貼り付けてください。できればサイトの全ページ共通でつかう<head>に貼り付けます。

貼り付け例
<head>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css" integrity="sha256-UzFD2WYH2U1dQpKDjjZK72VtPeWP50NoJjd26rnAdUI=" crossorigin="anonymous" />
</head>

WordPressなら、header.phpのタグ内の1か所に貼り付けるだけです。そのほかでも同じようなテンプレートに貼り付けてください。

個別のページに貼り付けると、アイコンフォントを使うページ数分の貼り付け作業が発生するのでめんどうです。

AMPは対応できない。どうなるのか?

Font Awesomeの最新バージョンは5.9.0です。

(2019年7月7日現在)

CDNは、いますぐやめるわけではなく、次期バージョン(5.10 ?)からサポートしないようです。

そうなると対応できないのはAMPです。

AMPでは、サポートしているFont Awesomeは2つです。

https://use.fontawesome.comFont Awesome公式。
https://maxcdn.bootstrapcdn.comBootstrapCDN。

公式はなくなるので、のこりはBootstrapCDNですね?

でもBootstrapCDNは、Font Awesomeのバージョンが4.6.3です。

このままだとFont Awesome 5は使えません。

このあたりも対応してくれるんでしょうね? どうなるか要チェックです。

BootstrapCDNにはもうひとつサイトがあります。

こっちのバージョンは4.7.0です。

AMPは未対応です。なんで2つあるのかよく分かりません。

前のページ
WebでアイコンフォントFontAwesome 5を数秒で使えるようにする方法
アイコンフォントFontAwesomeはアカウントが必要になった
次のページ
HTML&CSSの本
post-cta-image

どうしてもインターネットで調べて勉強するのが苦手という人のために、HTMLとCSSの最新技術と基本を網羅できる本を2冊選びました。

この内容を身につければ、ほかの本は必要ありません。将来的には、自分の力で、書籍を使わずに、インターネットにある情報だけで学べます。


HTML&CSSの本2選

SNSでも記事を配信しています。
コメントを残す

*

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

top
この記事を気に入ったらぜひシェアも!!