Как я могу использовать фрагменты, чтобы сделать номера строк уценки?

Question

Я знал номера строк жидкокристаллического дисплея, например:

{% highlight java linenos %}
    public class Test {

    }
{% endhightlight $}

Но я не знаю, как я должен позволить уценке выделять номера строк дисплея?

```java
    public class Test {

    }
```

Таким образом, он не будет отображать номера строк. Должен ли он добавить параметр options?

Answer 1

Простой способ добавить номера строк и форматирование - использовать css/javascript. Проверьте Prettify

Генератор Markdown будет создавать только HTML-теги <div class="highlight"><pre><code></code></pre></div> вокруг вашего контента.

В разделе заголовка вашей страницы добавьте ссылку на скрипт prettify, передавая необходимые параметры (или сохраните скрипт локально на вашем сайте)

<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?lang=css&skin=sunburst"></script>

Затем используйте jQuery, чтобы добавить класс "prettyprint" в тег pre. Это должно быть все, что вам нужно, чтобы заставить Prettyprint работать

<script>
$( document ).ready(function() {
    $(this).find( ".highlight" ).each(function(){ 
        $(this).find("pre").addClass("prettyprint"); 
    })
});

</script>

Выберите тему, которая вам нравится, или используйте значения по умолчанию и добавьте класс "linenums", чтобы получить нумерацию строк

<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?lang=css&skin=sunburst"></script>
<script src="/javascripts/jquery-1.8.3.min.js"></script>
<script>
$(this).find("pre").not('.prettyprint').each(function(){
   $(this).addClass("prettyprint linenums");
   prettyPrint();
})
</script>

Ваш вопрос об использовании фрагментов. Если это то, что вы хотите использовать, то сохраните код жидкого шаблона, чтобы позволить фрагментам размечать ваши блоки кода и использовать таблицу стилей фрагментов. Мне лично не нравится добавлять шаблоны в мои сообщения. Может быть возможно настроить Jekyll для использования генератора уценки, который генерирует более дружественный к коду HTML, но я этого не видел.