jekyllブートストラップGlyphiconsをインポートしていません
-
20-12-2019 - |
質問
今日はJekyllを使い始めました、そしてこれまで私はそれが好きです。
既定のテーマ(単にbootstrap-3
というタイトル)のいずれかを使用しています。ファイル構造の観点から、細かくコンパイルされているようです。
しかし、私のローカルサーバー(またはgithub.io)で実行すると、いくつかのファイルが見つからない、特にブートストラップでデフォルトになるGlyphiconフォントがあります。
fonts
フォルダは、_site/assets
ディレクトリと外部assets
ディレクトリの両方に存在します。
しかし、Google Dev Toolsを使用して資産を探すと、フォントがまったく見つかりません。 CSSは正常に発生しますが、フォントはそうではありません。
興味深いことに、私が別のテーマを使用すると(_site
など)フォントが大丈夫になっています。
Glyphiconsが私のthe-project
に存在すると、私が考えることができる唯一のものは、bootstrap.min.css
コードが間違っているということです。
url()
はMy src:url('../fonts/glyphicons-halflings-regular.eot')
にあり、親フォルダにbootstrap.css
フォルダが含まれているように、ファイル構造が設定されています。
これは私のディレクトリツリーです:
bootstrap-3
├── bootstrap
│ ├── css
│ │ ├── bootstrap.min.css
│ │ └── bootstrap.theme.min.css
│ ├── fonts
│ │ ├── glyphicons-halflings-regular.eot
│ │ ├── glyphicons-halflings-regular.svg
│ │ ├── glyphicons-halflings-regular.ttf
│ │ └── glyphicons-halflings-regular.woff
│ └── js
│ └── bootstrap.min.js
└── css
└── style.css
.
and これは私の出力サイト、Glyphiconをfonts
ボタンに入れたいです。連絡先ページの(私はまだUIに焦点を当てていないので、メインサイトから見えません)。
興味深いことに、私がglyphiconをどこかに置くとき を入れると表示されます。
編集:WOW、誤ってCLASSICETAGCODEをクラス名に入れます。
解決
http://getbootstrap.com に進み、ネットワークインスペクタを見ると、フォントがロードされていないわけではありません。しかし、 http://getbootstrap.com/components/ に進むと、ブラウザにジャンプが表示されます。。
ブラウザは、必要な場合にのみフォントをロードします( glyphon-xxx スタイルを使用する場合)。これは遅延ロードと呼ばれ、不要なリソースの読み込みを回避します。
編集:あなたがサイトにglyphiconsを使わない場合はロードされていません。ベースJekyllブートストラップはglyphiconsを使用しません。
をファイルのいずれか(例:pages.html)またはindex.mdで同等のマークダウンを試してください。
のフォントがロードされます。