Спочатку необхідно встановити плагін для підсвітки синтаксису. Для цього в терміналі, знаходячись у кореневій теці Eleventy, прописуємо наступну команду:
npm install @11ty/eleventy-plugin-syntaxhighlight --save-dev
Після цього відкриваємо файл налаштувань .eleventy.js
та в потрібному місці додаємо код:
const syntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight");
module.exports = function(eleventyConfig) {
eleventyConfig.addPlugin(syntaxHighlight);
};
У файлі шаблону перед закриваючим тегом body
вписуємо шлях до CSS-розмітки, наприклад, отак:
<link href="https://unpkg.com/prismjs@1.20.0/themes/prism-okaidia.css" rel="stylesheet">
Тепер можна додавати код за допомогою розмітки Markdown, Nunjucks або Liquid. Зазвичай я використовую розмітку Markdown, ось так:
``` js
блок із кодом
```
Прокоментувати
На сайті відображається лише твоє ім'я та коментар. Електронна пошта зберігається виключно для зв'язку з тобою за потреби та в жодному разі не передається стороннім особам.