GitHub上のJekyll製サイトでFont Awesomeを使う

Tue Aug 10 10:25:00 JST 2021 (modified: Tue Aug 10 10:31:33 JST 2021)
views: 1227, keywords:GitHub,Jekyll この記事は最終更新日が2年以上前のものです。

英語の情報見ても「プラグインないよー」みたいな話になってたけど、普通にテンプレートのHTMLにlinkを埋め込んだら使えた。チミ達は生のHTMLを書かんのか?このサイトのための作業でした。

テンプレートのHTMLを作る

上記サイトを参考に、_layoutsの下にdefault.htmlを作ると良いと思います。HTMLのデザイン等を流用したい場合は、今表示しているGitHub上のページからソースをコピーしてきて、そこに埋め込み用のタグを仕込みます。

Font Awesomeのリンクを仕込む

本サイトのHTMLからコピペしました。いろいろルールが変わっているかもしれませんので、このままコピペはおやめください。

<!DOCTYPE html>
   ・・・
       <!-- head要素の下に起きましょう -->
       <!-- Font Awesome CSS -->
       <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
   ・・・

マークダウンのファイルでアイコン呼び出し

こんな感じで埋め込みます。

    * [WSL1のインストール実演動画 <i class="fa fa-external-link"></i>](https://youtu.be/JAszcQ8IEwg)

こんな感じで表示されます。

現場からは以上です。

ノート   このエントリーをはてなブックマークに追加 
 

prev:日記(2021年8月9日) next:日記(2021年8月16日)

やり散らかし一覧

記事いろいろ