Skip to main content
3 / 3
YAML のサポートが追加されました。 - https://meta.stackexchange.com/a/344489

シンタックスハイライトとは何ですか?

可読性を上げるためソースコードに色をつけることを、シンタックスハイライトと呼んでいます。通常、使われているプログラミング言語によって色の付け方を変えます。

どういう仕組みですか?

Stack Exchange ネットワーク上のシンタックスハイライト機能は、第三者によって開発されている Google Code Prettify を使用しています。 このためシンタックスハイライトに関するバグ報告や機能要求は Stack Exchange 側では処理できません。Google Code Prettify の開発チームにコンタクトを取って下さい。

投稿のプレビュー画面においては、タイピングを止めて 5 秒経ってからシンタックスハイライトが適用されるようになっています。

Prettify がコア部分の実装でハイライトに対応している言語には C/C++、HTML、Java、JavaScript、Perl、Python、Ruby、シェルスクリプトなどがあります。更に extension としていくつかの言語がハイライトできるようになっています。

コードに正しく色がつかない場合には?

もし正しくハイライトされない場合、その言語がサポートされていないのかもしれません。Prettify がサポートしている言語の一覧をご覧ください。もしその言語が一覧に載っていなければ、Stack Exchange へ実装される前に Prettify に実装される必要があります。

もし一覧に載っていてタグもつけているのにハイライトされない場合、ハイライトの設定がなされていないのかもしれません。設定を確認の上、メタへ要求をご投稿ください。

また、複雑なコードには上手く色がつきません。もともと Prettify は複雑なコードをハイライトしようとしていないことにご注意ください。

ハイライトのバグ報告や機能要求はどこへ出せば良いですか?

ハイライトのバグを見つけた場合、それが既に issue として報告されていないか確認してください。報告されていない場合、Prettify へご報告ください。既に Prettify 側で修正されているものの Stack Exchange に反映されていない場合、Meta へご報告ください。

新しい言語を追加したい場合も、issuepull request をご参照ください。Stack Exchange は Prettify を使っているだけであり、それ自体のメンテナンスはしていないことにご注意ください。

またご報告の際には、目的のハイライト機能が効いていることをよく確認してください。

どの言語のハイライト設定を使うのかはどう決まっていますか?

Stack Exchange では、どのプログラミング言語が使われているのかを質問のタグ情報から推測しています。ただしハイライト設定されたタグが 2 つ以上つけられていた場合はデフォルト設定として扱い、どの言語にするのが良いか Prettify に推測させています。

どのタグに言語のヒントがついているのか知りたければ、タグ wiki のページをご覧ください。もしそのタグに言語のヒントがついていれば、タグ wiki の一番下の部分にそのことが書かれています。

タグ wiki 下部のスクリーンショットです。「コード言語」と書かれた行に lang-java と書かれています。

ハイライトの設定を明示的に上書きすることもできます。コードブロックの上に language コメントを書いてください。

<!-- language: ここに言語かタグを書きます -->

    ここがソースコードです

language: の後には、この投稿の下の方に書かれているキーワードか、タグの名前を書きます。たとえば下のように書けます。

コードブロックに言語のキーワードでヒントをつけてみます:

<!-- language: lang-js -->

    function greet(person) {
        return "Hello " + person;
    }
    var user = "John Doe";
    alert(greet(user));

続いてタグ名でヒントをつけてみます:

<!-- language: typescript -->

    var arr = [0, 1, 2];

シンタックスハイライトを付けたくない場合、lang-none を指定してください。

<!-- language: lang-none -->

また、全てのコードブロックのハイライトを一気に指定することもできます。この機能を使うとそれぞれのコードブロックにひとつずつ language コメントを書く必要がなくなります。

<!-- language-all: ここに言語かタグを書きます -->

キーワードによる言語指定について

以下のリストは、どのプログラミング言語としてハイライトさせたいか明示的にヒントを与えるときに使えるキーワードたちです。同じグループにある lang-** では同じハイライターが使われます。

コア部分で対応されているもの:

  • Default: Prettify がコードを読んで推測します
    default
  • None: シンタックスハイライトを行いません
    lang-none
  • Bash などのシェルスクリプト
    lang-bashlang-bshlang-cshlang-sh
  • C、C++、Objective-C など
    lang-clang-cclang-cpplang-cxxlang-cyclang-m
  • C#
    lang-cs
  • CoffeeScript
    lang-coffee
  • HTML、XML、XSL など
    lang-htmllang-xmllang-xsl
  • Java
    lang-java
  • JavaScript
    lang-jslang-javascript
  • JSON
    lang-json
  • Perl
    lang-pllang-perl
  • Python
    lang-pylang-pythonlang-cv
  • Ruby
    lang-rblang-ruby
  • 正規表現
    lang-regex

Extension として対応されているもの:

タグによる言語指定について

質問にはスタック・オーバーフロー上のタグを自由につけることができます。いくつかのタグには特定言語のキーワードが紐付けられていたり default が紐付けられていたりします。ハイライトの際にはこれら紐付けられたキーワードが使われます。

どんなタグも最初は特定言語のキーワードが紐付けられていないことに注意してください。


編集してくださる方へ:

この投稿は Stack Exchange Meta にコミュニティ wiki によって投稿されたこちらの投稿を元に和訳・編集したものです。 キーワードのリストを編集する際は、まず元投稿を確認してください。 元投稿にも書かれていない場合、そのキーワードは存在しないのかもしれません。キーワードとして無効なものが language コメントに指定されたとしても、default 扱いのハイライトがつきます。そのキーワードが確かに使えることを確認してから編集をお願いします。