 |
概要 | Custom Codeを使用すると、サイト上で共有されるソースコードのフォントと色をカスタマイズできます。 |
 |
プレビュー | Discourse Theme Creatorでのプレビュー |
 |
リポジトリリンク | https://github.com/discourse/discourse-custom-code |
 |
Discourseテーマが初めてですか？ | Discourseテーマの使用に関する初心者ガイド |
このテーマコンポーネントをインストール
機能
一般的に、コードを書くために使用されるフォントはmonospaceファミリーの一部です。最も有名なフォントは以下の通りです：
(ただし、これにより最も多様なフォントを実験する人の妨げになるわけではありません！)
フォントを変更するには、https://fonts.google.com へアクセスします
-
使用したいフォントを選択
-
カスタマイズします
-
EMBEDを選択し、テーマ設定
Font内にフォントファミリーに関連する文字列(1)をコピーします
-
CSSに関連する文字列(2)をテーマ設定
font-family内にコピーして貼り付けます（文字列の末尾に;を追加しないでください）。
他のすべての設定は十分に明確であるはずです。
このコンポーネントの設定はライトテーマとダークテーマに分かれています。両方を使用する場合は、両方のテーマにコンポーネントを追加することを忘れないでください。
設定
| 名前 | 説明 |
|---|---|
| font | Google Fontから新しいフォントを選択します。選択したものによっては、さらにカスタマイズできます。例えばSarabun:300,400,500など。設定されていない場合、デフォルトのフォントが適用されます。 |
| font size | 使用するフォントのサイズを指定します。設定されていない場合、デフォルトのフォントが適用されます。 |
| font family | 使用するフォントを指定します。設定されていない場合、デフォルトのフォントが適用されます。 |
| border radius | コードの境界線の丸みを指定します。デフォルト値は0pxです。 |
| hljs light | ライトテーマ。テキストの色を選択します。 |
| code light | ライトテーマ。コードの色を選択します。 |
| code background light | ライトテーマ。コードの背景色を選択します。 |
| comment light | ライトテーマ。コメントとドックタグの色を選択します。 |
| title light | ライトテーマ。タイトル、名前、およびメタの色を選択します。 |
| string light | ライトテーマ。文字列の色を選択します。 |
| number light | ライトテーマ。数値の色を選択します。 |
| keyword light | ライトテーマ。キーワード、subst、リクエスト、およびステータスの色を選択します。 |
| class title light | ライトテーマ。クラス要素内のタイトルの色を選択します。 |
| tag light | ライトテーマ。タグの色を選択します。 |
| attribute light | ライトテーマ。属性の色を選択します。 |
| symbol light | ライトテーマ。記号の色を選択します。 |
| hljs dark | ダークテーマ。テキストの色を選択します。 |
| code dark | ダークテーマ。コードの色を選択します。 |
| code background dark | ダークテーマ。コードの背景色を選択します。 |
| comment dark | ダークテーマ。コメントの色を選択します。 |
| title dark | ダークテーマ。タイトル、名前、およびメタの色を選択します。 |
| string dark | ダークテーマ。文字列の色を選択します。 |
| number dark | ダークテーマ。数値の色を選択します。 |
| keyword dark | ダークテーマ。キーワード、subst、リクエスト、およびステータスの色を選択します。 |
| class title dark | ダークテーマ。クラス要素内のタイトルの色を選択します。 |
| tag dark | ダークテーマ。タグの色を選択します。 |
| attribute dark | ダークテーマ。属性の色を選択します。 |
| symbol dark | ダークテーマ。記号の色を選択します。 |
ホストは私たちですか？ テーマコンポーネントは、Standard、Business、Enterpriseプランで利用可能です。