2014-12-08 3 views
2

Я пытаюсь получить подсветку кода, чтобы работать для простого блога, созданного с помощью jekyll. Я хочу иметь возможность делать выделение кода в сообщениях, написанных в методе уценки, поэтому я включил redcarpet в качестве языка разметки. Это отлично работает, код отформатирован в тегах <pre></pre>, и все различные элементы кода получают соответствующие классы. напримерПодсветка синтаксиса в jekyll с помощью redcarpet

<span class="n">function</span> 
<span class="n">saySomething</span> 
<span class="p">()</span> 
<span class="p">{</span> 

etc. 

Это замечательно, но это не дает нам актуальной подсветки (цвета). Поэтому я предполагаю, что некоторые css готовы скопировать и вставить, что на самом деле делает стиль для разных элементов кода. Или я чего-то не хватает?

Я изучил некоторые библиотеки подсветки кода, такие как prettify или prism, но они делают свое собственное форматирование с помощью javascript в браузере. Но поскольку redcarpet уже делает тяжелую работу по форматированию кода, это не нужно делать снова.

Любые подсказки?

+0

Есть ли причина, по которой вы выбрали для этого красную ковровую дорожку? Jekyll делает очень легко сделать подсветку синтаксиса, как показано [здесь] (http://jekyllrb.com/docs/templates/#code-snippet-highlighting) – Anthony

+0

@ Энтони О, я не понимал, что могу использовать этот способ выделения в сочетании с уценкой. Но фактическая подсветка, очевидно (окраска кода) по-прежнему отсутствует. Любые идеи о том, как я могу это достичь? – Flavio

ответ

3

Вам нужно немного CSS магии. Используйте this one или pick one from here.

+0

Aalright, похоже, именно то, что я искал, большое спасибо :) – Flavio

3

Вы можете создать CSS с маркером сам

rougify style > rouge.css 

Или

coderay stylesheet > coderay.css 
+0

Спасибо! Это похоже на то, что я пытаюсь сделать. Я все еще не уверен, как это сделать с помощью jekyll ... Я не знаю ни одного рубина или как интегрировать rouge с интегрированным форматированием кода jekyll. – Flavio

Смежные вопросы