使い方

何もする必要はありません。プラグインは既定でアクティブです。このプラグインを読み込むと、コード内のすべてのマークアップが残されます。

ただし、特定のコード要素に対してプラグインを無効にするには、no-keep-markup クラスをそのコード要素に追加します。ページのボディに no-keep-markup クラスを追加してプラグインをページ全体で無効にすることもできます。その後、コード要素に keep-markup クラスを追加してそのコード要素についてプラグインを再び有効にすることができます。

二重ハイライト

一部のプラグイン（たとえば Autoloader）ではコードブロックを再ハイライトする必要があります。Keep Markup の場合、これは問題です。これは最初のハイライトのパスでマークアップを保持するため、不要な多くの DOM ノードが生成され、テーマや他のプラグインに問題が生じるからです。

この問題は、コードブロックまたはその祖先に drop-tokens クラスを追加することで修正できます。drop-tokens が存在する場合、Keep Markup は Prism によって作成されたすべての span.token 要素を無視します。

例

次のソースコード

<pre><code class="language-css">
@media <mark>screen</mark> {
	div {
		<mark>text</mark>-decoration: <mark><mark>under</mark>line</mark>;
		back<mark>ground: url</mark>('foo.png');
	}
}</code></pre>

は以下のようにレンダリングされます

@media screen {
	div {
		text-decoration: underline;
		background: url('foo.png');
	}
}

インラインコードでも機能します: var bar = function () { /* foo */ };