[blog] Вставка раскрашенных фрагментов кода в блог

В комментарии к предыдущей заметке ув.тов.Eugeniy спросил о том, как я вставляю раскрашенные фрагменты кода в блог. Решил ответить в виде отдельной заметки на случай, если кому-то еще это пригодится.

Для написания заметок я использую Windows Live Writer. Когда мне нужно вставить фрагмент кода, то использую редактор vim + следующий заготовленный фрагмент HTML:

<table width="100%" bgcolor="#000040"><tbody> <tr> <td><font color="#c0c0c0" face="monospace"> </font> </td> </tr> </tbody></table>

Этот фрагмент я добавляю в HTML-код заметки. После чего набираю в vim-е фрагмент исходного кода и даю vim-у команду TOhtml:

Далее выделяю нужный мне кусок сгенерированного vim-ом HTML-я и вставляю его в заранее заготовленный HTML-ный фрагмент в тексте заметки. Получается что-то вроде:

<table width="100%" bgcolor="#000040"><tbody> <tr> <td><font color="#c0c0c0" face="monospace"> <font color="#ff80ff">#include&nbsp;</font><font color="#ffa0a0">&lt;iostream&gt;</font><br> <br> <font color="#60ff60">int</font>&nbsp;main() {<br> &nbsp;&nbsp; std::cout &lt;&lt;&nbsp;<font color="#ffa0a0">&quot;Hello, colorfull World!&quot;</font>&nbsp;&lt;&lt; std::endl;<br> } </font> </td> </tr> </tbody></table>

И это все в результирующем виде будет выглядеть так:

#include <iostream> int main() {    std::cout << "Hello, colorfull World!" << std::endl; }

Цветовая гамма, в которой vim генерирует HTML, соответствует обычной цветовой гамме, которую я vim-у задал для себя (т.е. именно такие цвета я использую в повседневной работе).

Теперь о том, почему я остановился именно на таком способе оформления фрагментов кода. Когда озадачился этой темой, то погуглил по Интернету. И нашел, что самые красиво выглядящие способы требуют изменения CSS-ов и подключения каких-то JavaScript-овых инструментов. Чего мне совсем не хотелось, т.к. лень было разбираться с правкой CSS в blogger-е, да и не хотелось, чтобы вместе с моими заметками к пользователю грузились еще какие-то JavaScript-ы. Мне показалось, что сделать раскрашенный фрагмент вручную намного проще и дешевле ;)