Мой блог размещен в Blogger, и я часто публикую фрагменты кода в C/C#/Java/XML и т.д., но обнаружил, что фрагмент получает "искалеченный".
Существуют ли какие-либо веб-сайты, которые я мог бы использовать для предварительного разбора фрагмента и сортировки форматирования, преобразования XML "<" в "<" и т.д.
В этой области есть множество вопросов по этой области, но я не мог найти ответ на этот вопрос напрямую.
Edit: Для @Rich ответьте на сайт: "Чтобы отобразить отформатированный код на вашем сайте, вам нужно получить эту таблицу стилей CSS и добавить ссылку на это в разделе <head> на вашей странице". Это проблема - вы не можете сделать это в Blogger AFAIK.
Я создал запись в блоге, в которой объясняется, как добавить подсветку синтаксиса кода в блоггер, используя syntaxhighlighter 2.0
Здесь мое сообщение в блоге:
http://www.craftyfella.com/2010/01/syntax-highlighting-with-blogger-engine.html
Надеюсь, это поможет вам, ребята. Я очень впечатлен тем, что он может сделать.
Самый простой способ совместного использования кода - с публичной точки зрения. Просто напишите и вставьте код для вставки. Легкий peasy.
Чтобы устранить проблему с поисковой системой, можно скрыть div на странице так же просто, как:
<div style="display:none"> content </div>
В моем блоге я использую http://hilite.me/ для форматирования исходного кода. Он поддерживает множество форматов и выводит довольно чистый html. Но если у вас много фрагментов кода, вам нужно сделать много копий. Для форматирования кода Python я также использовал Pygments (сообщение в блоге).
Этот css script может быть полезен для всех - это не для подсветки синтаксиса, но хорошо работает для представления исходного кода в оригинальном формате:
<pre style="font-family: Andale Mono, Lucida Console, Monaco, fixed, monospace;
color: #000000; background-color: #eee;
font-size: 12px; border: 1px dashed #999999;
line-height: 14px; padding: 5px;
overflow: auto; width: 100%">
<code style="color:#000000;word-wrap:normal;">
<<<<<<<YOUR CODE HERE>>>>>>>
</code>
</pre>
Как использовать:
ПРЕИМУЩЕСТВА: Простая и простая в использовании, менее конфигурируемая, простая для перенастройки, без дополнительного программного обеспечения
Это можно сделать довольно легко с помощью SyntaxHighlighter. У меня пошаговые инструкции по настройке SyntaxHighlighter в Blogger в моем блоге. СинтаксисHighlighter очень прост в использовании. Он позволяет отправлять фрагменты в необработанном виде и затем обертывать их в pre, например:
<pre name="code" class="brush: erlang"><![CDATA[
-module(trim).
-export([string_strip_right/1, reverse_tl_reverse/1, bench/0]).
bench() -> [nbench(N) || N <- [1,1000,1000000]].
nbench(N) -> {N, bench(["a" || _ <- lists:seq(1,N)])}.
bench(String) ->
{{string_strip_right,
lists:sum([
element(1, timer:tc(trim, string_strip_right, [String]))
|| _ <- lists:seq(1,1000)])},
{reverse_tl_reverse,
lists:sum([
element(1, timer:tc(trim, reverse_tl_reverse, [String]))
|| _ <- lists:seq(1,1000)])}}.
string_strip_right(String) -> string:strip(String, right, $\n).
reverse_tl_reverse(String) ->
lists:reverse(tl(lists:reverse(String))).
]]></pre>
Просто измените имя кисти на "python" или "java" или "javascript" и вставьте код по вашему выбору. Пометка CDATA позволяет вам размещать практически любой код там, не беспокоясь об эвакуации объекта или других типичных неприятностях в блогах.
1. Сначала сделайте резервную копию своего шаблона Blogger
2. После этого откройте свой блоггерский шаблон (в режиме редактирования HTML) и скопируйте все css указанные в этой ссылке перед тегом </b:skin> < ш > 3. Вставьте следующий код перед тегом </head>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js' type='text/javascript'></script>
4. Вставьте следующий код перед тегом </body>.
<script language='javascript'>
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>
5. Сохранить шаблон Blogger.
6. Теперь подсветка синтаксиса готова к использованию, вы можете использовать ее с тегом <pre></pre>.
<pre name="code">
...Your html-escaped code goes here...
</pre>
<pre name="code" class="php">
echo "I like PHP";
</pre>
7. Вы можете избежать вашего кода здесь.
8. Здесь - список поддерживаемых языков для атрибута <class>.
Здесь один сайт, который отформатирует ваш код и выплевывает html, и даже включает встроенные стили для раскраски синтаксиса. Можете не работать для всех ваших нужд, но это хорошее начало. Я считаю, что он сделал доступным источник, если вы хотите его расширить:
http://formatmysourcecode.blogspot.co.uk/ отлично работает, вы просто копируете, форматируете, вставляете назад.
Я создал инструмент, который выполняет эту работу. Вы можете найти его в моем блоге:
Бесплатный графический редактор С#
Помимо раскрашивания вашего кода на С#, инструмент также заботится обо всех '<' и ' > ' символы, преобразующие их в '& lt;' и '&gt;'. Вкладки преобразуются в пробелы, чтобы выглядеть одинаково в разных браузерах. Вы даже можете сделать раскраски встроенными стилями CSS, если вы не можете или не хотите вставлять таблицу стилей CSS в свой блог или веб-сайт.
Я использую SyntaxHighlighter с помощью моего блога Blogger. Фактический сайт размещен на моем собственном сервере, а не в Blogger, хотя (у Blogger есть опция для сообщений ftp на ваш собственный сайт), но наличие собственного домена и веб-хостинга стоит всего пару долларов в месяц.
Похоже, что произошли некоторые изменения с SyntaxHighlighter 2.0, которые упрощают использование с Blogger.
Есть размещенные версии стилей и Javascripts по адресу: http://alexgorbatchev.com/pub/sh/
На самом деле я использовал (что еще;-)) Vim для этого: у него есть 2html "плагин". См. документы здесь.
Итак, когда я редактирую свой код, я просто конвертирую его в HTML и вставляю результаты в HTML-редактор Blogger.
Примечание: это не так красиво HTML (встроенный CSS был бы лучше), но он просто работает.
О: и у него есть синтаксические файлы для нескольких языков, что делает его довольно полезным.
Я использую довольно низкотехнологичное решение. Я отформатирую код, используя этот интерактивный синтаксис, затем просто вставьте его в блог
Специальный ответ Emacs: Что касается блоггера, он позволяет встроить css. Проблема с подсветкой на основе javascript заключается в том, что вам нужно жить с их цветовой схемой или реализовывать свои собственные. Но, как и я, если вы поклонник вашей собственной цветовой схемы emacs, у вас есть гораздо лучший вариант. Я взломал пакет "htmlize.el" для emacs, чтобы добавить следующие четыре функции...
Эти функции выведут готовый html файл для копирования-вставки (встроенный стиль) в новый буфер в emacs, который вы можете напрямую использовать в своем сообщении в блоге. Результат выглядит точно так же, как вы видите код в emacs (включая цветовую схему).
Вот ссылка в мой блог, где вы можете найти подробную информацию о том, как использовать "blog-htmlize.el" с emacs, Это устраняет html-кодирование символов "меньше" и "больше". И поскольку emacs делает все выделение и стиль, вам не нужно беспокоиться о том, поддерживает ли библиотека js язык ваших фрагментов, и вам не нужно вмешиваться в код вашего шаблона в блогере.
Здесь вы можете найти elisp файл (сохраните файл как blog-htmlize.el)
Я перевернул свой файл в F # (см. этот вопрос), но он все еще не идеален (я просто делаю регулярные выражения, поэтому я не признаю классы или имена методов и т.д.).
В принципе, из того, что я могу сказать, редактор blogger иногда будет использовать ваши угловые скобки, если вы переключаетесь между режимами Compose и HTML. Поэтому вам нужно вставить HTML-режим, а затем сохранить его напрямую. (Возможно, я ошибаюсь, просто попробовал сейчас и, похоже, работает - зависит от браузера?)
Это ужасно, когда у вас есть дженерики!
Чтобы разместить html, javascript, С# и java, вы должны преобразовать специальные символы в HTML-код. как '<' как < и '>' до > и e.t.c..
Добавьте эту ссылку Конвертер кода в iGoogle. Это поможет вам преобразовать специальные символы.
Затем добавьте SyntaxHighlighter 3.0.83 новую версию, чтобы настроить ваш код в блогере. Но вы должны знать, как настроить синтаксисHighlighter в вашем шаблоне блоггера.