機能
これらは利用可能なオプションの一部にすぎません。このコンポーネントには、hljsリポジトリで提供されているすべての90のオプションが含まれています。
すべてのオプションがこのコンポーネントに含まれていますが、選択したテーマのみが読み込まれます。したがって、オーバーヘッドはありません。
使用方法
このコンポーネントの接続方法により、サイトの設定の1つを少し変更する必要があります。
your.site.com/admin/site_settings/に移動します
theme_authorized_extensionsを検索します
- そのリストに
cssを追加します。
以下のようにします:
コンポーネントをインストールする前にこれを行ってください。そうしないと、機能しません。
それが完了したら、他のコンポーネントと同様にこのコンポーネントをインストールできます。
設定
| 名前 |
説明 |
| hljsテーマ |
コードブロックで使用したいテーマを選択します。テーマをプレビューするには、hljsデモページにアクセスしてください |
| hljsダークマッチ |
利用可能な場合はダークカラースキームを読み込む |
オプションがどのように見えるかを確認したい場合は、こちらをご覧ください We're not a CDN - highlight.js
使用するhljsテーマが決まったら、ドロップダウンボックスで希望のテーマを検索して設定を保存してください。すべてが機能し始めるには、ページを更新する必要があります。
クレジット
このコンポーネントに含まれるすべてのhljsテーマには、それぞれのファイルに著作権情報が記載されています。すべての著者リスト(
)は大きすぎてここには追加できませんが、こちらで確認できます。
ホストされていますか? テーマコンポーネントは、Standard、Business、Enterpriseプランで利用可能です。
「いいね!」 42
MuZhou233
(Mosarin)
16
このテーマは非常に役立ち、長期間当サイトで使用していましたが、突然 Firefox で問題が発生することに気づきました。カスタム CSS ファイルが X-Content-Type-Options: nosniff ヘッダーによってブロックされています。コンソールによると、CSS ファイルの MIME タイプが text/html として表示されています。どのテーマを選んでも Firefox ではこの問題が発生しますが、Chrome では問題ありません。
neounix
(Dark Matter)
17
このスーパーテーマコンポーネントは、選択されたコードブロックのスタイルをユーザー設定として選択可能にすれば、さらに良くなるでしょう。
「いいね!」 5
Zup
18
同意します。ユーザー設定が実装されるととても素晴らしいでしょう。
SkyLin
(Sky Lin)
20
素晴らしいテーマコンポーネントですね。
一つ質問ですが、highlight.js デモには 242 のテーマがあります。例えば、添付画像の「Github Dark Dimmed」などです。
この問題を解決する方法はありますか?アドバイスをお願いします。
Johani
(Joe)
21
残念ながら、これは少し複雑です。
Discourse は highlight-js のバージョン 10.6.0 を実行しています。現在不足している追加テーマのほとんど(base16 など)は、バージョン 11.0 が必要です。
問題は、そのバージョンが破壊的変更と非推奨を導入していることです。こちらをご覧ください。
つまり、現在の選択肢はしばらく変更されないことになります。まず、Discourse の tests-passed で highlight-js のバージョンを更新する必要があります。その後、安定版リリースを待つ必要があります。テーマ(現在のものさえも)を更新すると、テーマがあなたのサイトで正しく機能するかどうかを推測するしかないという悪い状態に陥ってしまいます。
「いいね!」 4
vincentp
(Vincent)
22
このコンポーネントは最新のベータ版で壊れているようです。インストールすると、ハイライトが正しく機能しなくなります。テーマからコンポーネントを削除したところ、再び機能するようになりました。ハイライトテーマを選択できなくなっただけです。
「いいね!」 2
最新のベータ版でも、ここでも構文の色付けが壊れていることを確認してください
pmusaraj
(Penar Musaraj)
24
「いいね!」 2
Dennis_P_Z
(Dennis P. Z)
25
コンポーネントをインストールしようとしたときに、このエラーが発生しました。
Error creating upload asset: a11y-dark. Original filename アップロードしようとしたファイルは承認されていません(承認された拡張子: wasm, jpg, jpeg, png, woff, woff2, svg, eot, ttf, otf, gif, webp, avif, js)。
このテーマコンポーネントを見つけました。存在してくれて本当に嬉しいです!設定の hljs dark match が機能していないようです。
例えば、hljs theme を atom-one-light に設定しているとします(atom-one-dark も存在します)。
リフレッシュすると、ダークモード時に atom-one-light が適用されますが、ダークモードに切り替えてもコードブロックはダークモードに切り替わらず、ライトモードのままです。
テーマコンポーネントをインストールした際にこのエラーメッセージが表示されました。コミュニティの皆さんに修正方法を教えていただけると幸いです。
Firepup650
(Firepup Sixfifty)
30
css を許可されたテーマ拡張機能のリストに追加しましたか?
「いいね!」 1
このテーマコンポーネントは最新バージョンで動作していないようです。
すでに theme_authorized_extensions 設定に css を追加し、コンポーネントの再インストールも試みましたが、コードブロックのスタイルが適用されません。
ご確認いただけますでしょうか。ありがとうございます。