Намагаюся зробити одну дуже збочену фігню́. Так, поди́вимось…
Я рік тому зробив мінімальну підтримку OpenGraph. Відто́ді всі пости мають якусь заставку «за замо́вчанням». Це добре, але мало.
В деяких постах я руками вказую окрему картинку, і це зазвичай непогано. Це буває в постах, де вже і так є якісь зображення. Наприклад, ось тут є знімок екрану, і я в тому пості́ використовую для заставки OpenGraph зображення, згенеро́ване зі знімку екрану (відмасштабо́ване і обрі́зане до стандартного розміру 1200×630). Це все трохи незручно, але воно того варте.
Але що робити для пості́в без картинок? Іноді хочеться щось утну́ти.
Хочеться написати у front matter поста якусь фігню́, типу такого:
opengraph_generator:
template: clickbait01.svg
label_row1: Погана магія
label_row2: OpenGraph
key_color: ff0
…і щоб далі Jekyll та Makefile та мої скрипти магічним чином з шаблона і цих змінних створили файл, скажімо, opengraph/_svg/2023-11-28-opengraph-bad-magic.svg
(далі вже просто). Ви ж в курсі, шаблони ж не тільки для HTML? Ними можна генерувати будь-що текстове — RSS, JSON, можна і SVG.
Але я поки не придумав, як би це зробити. Зокрема, велике западло́ у тому, що все що робе Jekyll потрапляє у вихідний підката́лог _site
, а це зовсім не те що треба.
Оновлення від 30 листопада: наче щось придумав!
Три різних Jekyll’а
Це серйозне збочення, але я щось придумав.
Так от. У мене є нормальний _config.yml
. З ним все добре, нічого не міняється, він використовується для збірки сайту командою jekyll build
і саме з ним працюватиме GitHub Pages.
А додатково є два інших конфігураційних файли Jekyll’а, _og_prepare.yml
та _og_generate.yml
для двоета́пної генерації SVG. Це тепер робиться командою make badmagic
.
Етап 1 з 2: підготовка
Перетво́рюємо Markdown в Markdown!
На цьому етапі з усіх пості́в сайту створюються відповідні їм вихідні файли у opengraph/_tmp
.
При цьому відтворюється іменування джерельних файлів Jekyll’а. Зокрема, з поточної сторінки генерується файл з іменем /opengraph/_tmp/2023-11-28-opengraph-bad-magic.md
з отаким front matter:
permalink: '2023-11-28-opengraph-bad-magic.svg'
layout: og_clickbait01.svg
label_row1: Погана магія
label_row2: OpenGraph
key_color: ff0
Секції з контентом немає, тільки front matter. Нам цього цілком і повністю має вистачити, щоб згенерувати SVG на наступному етапі.
Для інших сторінок (тобто тих, у яких немає opengraph_generator
) генерується якась тупа заглушка.
Етап 2 з 2: генерація
Хоч дуже збочено, але ми зібрали все що треба на попередньому етапі. Далі все просто: перетво́рюємо Markdown в SVG.
Етап 3 з 2: конвертація SVG в PNG
Це у мене і так робиться при кожному запуску make
. Я тільки додав спеціальні правила для обробки підкаталога opengraph/_svg
.
Така особливість мого сайту, що результу́ючі сконвертовані картинки я додаю́ в свій репозиторій. Так, їх можна згенерувати знову, якщо зміниться першоджерело. Так, я в репозито́рії поруч з джерелом зберіга́ю згенерований біна́рнік. Це не дуже красиво, але зручно. Я колись давно став так робити для іко́нки сайту і, в принципі, мене не сильно бісить.
Так. Ладно. Все похуй.
Воно працює!