alex10
(Alex)
1
Discourse でコードブロックの書式設定に関する問題が発生しています。Python コードを投稿すると、コードの一部（URL やパスなど）が赤くハイライトされたり、予期せず書式設定されたりします。これは以下のスクリーンショットに示されています。
問題の説明
- コードブロックに 3 つのバッククォートを使用して Python コードを投稿すると、テキストの特定の部分（URL やパスのアンダースコアなど）が赤くハイライトされたり、誤った書式設定になったりします。
- エスケープ文字の使用、HTML エンティティの使用、言語を指定しないことによる構文ハイライトの無効化などを試しましたが、問題は解決しません。
コードの例
問題を引き起こしているコードスニペット（Python）を以下に示します。
import degirum as dg
zoo = dg.connect(dg.CLOUD, “https://cs.degirum.com”, “”)
model = zoo.load_model(“mobilenet_v2_ssd_coco–300x300_quant_n2x_orca_1”)
result = model(“https://docs.degirum.com/images/samples/TwoCats.jpg”)
display(result.image_overlay)
試したこと
- アンダースコアをバックスラッシュでエスケープしました。
- HTML エンティティを使用してアンダースコアを置き換えました。
- コードブロックで
python を指定しないことで、構文ハイライトを無効にしました。
- 書式設定なしでプレーンテキストとしてコードを投稿しました。
設定情報
- 設定では、以下の言語がハイライトされています。
- bash, c, cpp, csharp, css, diff, go, graphql, ini, java, javascript, json, kotlin, lua, makefile, markdown, objectivec, perl, php, php-template, plaintext, python, python-repl, r, ruby, rust, scss, shell, sql, swift, typescript, xml, yaml, wasm
サポートのお願い
- 他にこの問題に遭遇した方はいらっしゃいますか？
- Discourse がコードの一部を誤って解釈するのを防ぐための推奨される方法はありますか？
- コードブロックのレンダリングに影響を与える可能性のある設定や構成を確認すべきものはありますか？
bryce
(Bryce Huhtala)
2
構文のハイライトシステム/設定全体には詳しくありませんが、赤いテキストを削除したいだけであれば、サイトのテーマにCSSを使用できます。
code.language-python span {
color: inherit;
}
赤は文字列を示すために使用されているため、それを別の色に変更したい場合は、次のようなことができます。
code.language-python span.hljs-string {
color: #FFF; /* 意図した色に置き換えてください */
}
赤いテキスト以外に、フォーマットが間違っている部分はありましたか？
alex10
(Alex)
3
ご提案ありがとうございます、@bryce！サイトのテーマのCSSを調整して、赤いテキストの問題に対処してみます。
サイトのテーマのCSSを調整して、赤いテキストの問題に対処してみます。
主な問題は、元のスクリーンショットのフォントがコードのようにフォーマットされていないことだと思います。コードブロックで一般的に使用される等幅フォントスタイルが欠けています。理想的には、コードが、適切なフォントとフォントカラーを持つ、こちらのような表示になることを期待していました。
この例のような等幅フォントでコードが表示されるようにする方法はありますか？
これ以外には、他に大きなフォーマットの問題は気づいていませんが、引き続きテストして、他に何か問題があればお知らせします。
改めて、ご協力ありがとうございます！
bryce
(Bryce Huhtala)
4
ハイライトの色は、次の CSS 変数をオーバーライドすることで変更できます。
--hljs-comment: コードコメントに使用されます--hljs-number: コード内の数値に使用されます--hljs-string: コード内の文字列に使用されます--hljs-literal: コード内のリテラル値に使用されます--hljs-tag: HTML/XML タグに使用されます--hljs-attribute: HTML/XML タグの属性に使用されます--hljs-symbol: コード内のシンボルに使用されます--hljs-bg: コードブロックの背景色に使用されます--hljs-builtin-name: 組み込み関数名に使用されます
例: 文字列の色をオーバーライドするには:
:root {
--hljs-string: pink;
}
使用されているハイライトライブラリである hljs は、例の degirum のような Python 識別子のハイライトをサポートしていない可能性がありますが、他の色を変更することでかなり近い表示にできるはずです。
フォントについては、それは奇妙です。コードブロックはデフォルトで等幅フォントで表示されるはずです。テーマで何かオーバーライドされていないか、再確認することをお勧めします。
「いいね！」 1
alex10
(Alex)
5
念のため確認ですが、現在、追加コンポーネントなしのデフォルトテーマを使用しており、コードブロックに等幅フォントがデフォルトで適用されていないのは奇妙です。何も上書きしているようには見えません。
参考までに、macOS 14.6.1 の Chrome バージョン 127.0.6533.100 で作業しています。
Moin
6
try.discourse.orgで問題を再現できますか？
試しましたが、リンクはハイライトされませんでした。
「いいね！」 1
alex10
(Alex)
7
try.discourse.org でコードをテストしたところ、結果は下のスクリーンショットに示されています。
フォントは正しく表示され、リンクも期待どおりにハイライトされています。しかし、私たちのコミュニティでは、フォントが正しく表示されず、リンクも期待どおりにハイライトされないという問題が依然として発生しています。
なぜこのような不一致が発生するのかわかりません。
参考までに、私たちのコミュニティのページへのリンクはこちらです: here
Jagster
(Jakke Lehtonen)
8
セーフモードは問題なさそうです。フォントに関しては。
ということは、問題はプラグイン、テーマ、またはコンポーネントのいずれかにあるということですね。
Moin
9
これはJavaのハイライトです
そして、あなたのフォーラムではMakefileになっています
こちらに、Selecting the programming language used in code blocks に関するガイドがあります。
サイト設定でデフォルトの言語を選択することもできます。
あなたのフォーラムのスクリーンショットはセーフモードなしで撮影されたため、私にはフォントがmonospaceに見えます。
「いいね！」 1
alex10
(Alex)
10
お二人とも、この件にご協力いただきありがとうございます。フォントが他の人には等幅フォントで表示されていると知ってよかったです。
私の環境では正しく表示されていないため、私のセットアップまたは環境固有の問題である可能性があります。ChromeとSafari（どちらも最新バージョン）の両方で、私には正しく表示されていません。組織内の他のPCユーザーにも正しく表示されていません。
alex10
(Alex)
11
個人のコンピューターから確認しましたが、問題はそちらでも継続しています。コードフォントが等幅で表示されず、リンクが正しくハイライトされていません。
これは、問題が異なるデバイス間で一貫しているため、プライマリセットアップの問題ではないようです。
Moin
12
alex10
(Alex)
13
セーフモードで確認したところ、問題は解決しているようです。コードフォントは等幅で表示され、リンクも正しくハイライトされています。
これは困惑します。デフォルトテーマを使用しており、追加コンポーネントは使用していないため、通常のモードで何が問題を引き起こしているのか分かりません。
pfaffman
(Jay Pfaffman)
15
それが期待されるものです。それらの文字列は、文字列であることをすぐにわかるように、別の色になっています。お使いのテキストエディタでは、このようには見えませんか？
SiteSetting.default_code_lang を「text」または「“”」に変更するだけでよいと思います。highlighted_languages という設定もあります。ここでは、デフォルトのコード言語がテキストのようなものに変更されていると確信しています。
これは次のように表示されます。
result=model("https://big.bang")
そして、 ```python で強制すると、次のようになります。
result=model("https://big.bang")
alex10
(Alex)
16
デフォルトのコード言語が自動に設定されていました。テキストに変更しましたが、私の側では何も変わりませんでした。
以下は、強調表示されている言語です。
Moin
18
確認したところ、自動検出ではPythonではなくMakefileだと認識されていました。
投稿にコードブロックで使用するプログラミング言語を追加しましたか？
「いいね！」 1
alex10
(Alex)
19
Python をコードブロックに追加すると、このようになります。
コミュニティを管理しているので、エンドユーザーが見るであろうように表示されるようにしたいと考えています。右側に見られるように、見た目が正しくありません。
