Discourseのインストールにディレクトリを簡単に追加できますか?

ローカルフォントをサイトに追加しようとしていました。テーマのCSSファイルに以下のように記述しました。

@font-face {
  font-display: swap; /* 他のオプションについては https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display を参照してください。 */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/montserrat-v26-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

HTMLファイルには以下のように記述しました。

<link rel="preload" href="/fonts/montserrat-v26-latin-italic.woff2 " as="font" type="font/woff2" crossorigin="">

その後、保存してサイトをリロードし、ページソースを表示して /fonts/montserrat-v26-latin-italic.woff2 のURLをクリックしたところ、以下のページに遷移しました。
https://forums.mysite.com/fonts/montserrat-v26-latin-italic.woff2

「404 Not Found」というNginxのエラーページが表示されました。そこで、「ああ、そういえばVPSのDiscourseディレクトリにfontsフォルダがないな」と思いました。テーマのfontsフォルダから読み込まれないのが不思議でした。そこで、/var/discourse/shared/standalone/ に「fonts」フォルダを追加し、そこにフォントファイルを入れました。ブラウザページを再度リロードしても、まだ404エラーが表示されます。Discourseにこのようなフォルダを単純に追加できるのでしょうか、それともサーバーを再起動しないと反映されないのでしょうか、それとも他に何か必要なことがあるのでしょうか?

ディレクトリの追加についてはよくわかりませんが、テーマでフォントファイルを使用することに関しては、試すことができる組み込みの方法があります。テーマファイルを直接編集している場合は、フォントをテーマの /assets ディレクトリに追加し、about.json に次のようにエントリを追加できます。

{
  // その他のプロパティ
  "assets" : {
    "my-font-identifier": "assets/my-font-file.woff2",
  }
}

次に、@font-facesrc: url($my-font-indentifier); を使用して参照できます。


設定インターフェイスのテーマエディターを使用しているだけであれば、アップロードセクションに追加し、SCSS var name フィールドに使用したい識別子を入力してから、SCSS で同じように参照できると思います。

「いいね!」 5

では、フォントごとにアセットコードは以下のようになりますか?

  "assets": {
    "montserrat-reg": "assets/montserrat-v26-latin-regular.woff2",
    "montserrat-ita": "assets/montserrat-v26-latin-italic.woff2"
},

編集:うまくいきました。フォントへの直接の /assets/ URLはまだ404を表示しますが、フォントはページで機能しているので、:man_shrugging:

管理サイトの設定で、フォントをMontserratに変更できます。
ベースフォント
見出しフォント


コアに含まれていないがGoogle Fontsにあるフォントを追加したい場合は、このテーマコンポーネントを使用できます。

「いいね!」 5

ええ、モンセラートは別のページ用です。でも、ありがとうございます!

Googleフォントの問題は、人々がほとんど使用しない200文字以上を読み込むことでページが遅くなることです。

「いいね!」 1

いいえ、そうではありません。必要なウェイトのみを使用し、最大3〜4つのフォントセットを使用する場合(本来そうすべきです)は、そうなりません。

「いいね!」 2

これについて質問があります。Discourseサイトのフォーラムページでソースを表示し、「font」を検索すると、たくさん表示されます。これらは、セットアップウィザードで1〜2個しか選択しなくても、すべて読み込まれていますか?もしそうなら、選択したものだけを読み込みたいです。

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.