格式化博客上的博客代码片段

我的博客托管在Blogger上,我经常在C / C# / Java / XML等中发布代码片段,但我发现代码片段被“破坏”了。

是否有任何网站,我可以用来事先解析代码片段,整理格式,将XML“<”转换为“&lt;”等。

在这个领域有很多关于SO的问题,但我找不到任何直接解决这个问题的问题。

Edit:对于@Rich答案,站点状态为为了在你的网站上显示格式化的代码,你需要得到这个CSS样式表,并在你的页面的<head>部分中添加对它的引用。。这就是问题所在——你不能在博客AFAIK上这样做。

163156 次浏览

这里是一个站点,它将格式化你的代码并输出html,它甚至包括用于语法着色的内联样式。可能不适合你需要的所有,但这是一个好的开始。我相信他已经提供了来源,如果你想扩展它:

实际上,我已经使用(还有什么;-))Vim:它有一个2html“插件”。看到这里的文档

所以当我编辑我的代码时,我只是把它转换成HTML,然后把结果粘贴到Blogger的HTML编辑器中。

注意:它不是那么漂亮的HTML(嵌入css会更好),但它只是工作。

哦:它有多种语言的语法文件,这使它非常有用。

我在我的博客中使用SyntaxHighlighter。实际的网站托管在我自己的服务器上,而不是博主的服务器上(博主可以选择将帖子发送到你自己的网站上),但拥有自己的域名和网络托管每个月只需要几美元。

我自己在f#中滚动(见问题),但它仍然不完美(我只是做正则表达式,所以我不识别类或方法名等)。

基本上,据我所知,如果你在撰写模式和HTML模式之间切换,博客编辑器有时会吃掉你的尖括号。所以你必须粘贴到HTML模式,然后直接保存。(我可能是错的,现在刚刚尝试,它似乎工作-依赖浏览器?)

当你有泛型时,这是可怕的!

SyntaxHighlighter 2.0看起来有一些变化,使它更容易与Blogger一起使用。

托管版本的样式和javascript在:http://alexgorbatchev.com/pub/sh/

我已经创建了一个博客文章条目,解释如何使用syntaxhighlighter 2.0向博客添加代码语法高亮显示

以下是我的博文:

http://www.craftyfella.com/2010/01/syntax-highlighting-with-blogger-engine.html

我希望这对你们有帮助。我对它的能力印象深刻。

以上链接停止工作。 尝试使用http://hilite.me/

使用SyntaxHighlighter可以很容易地做到这一点。我的博客上有在Blogger中逐步设置SyntaxHighlighter的说明。SyntaxHighlighter非常容易使用。它允许你以原始形式发布代码片段,然后将它们包装在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标记让您可以在其中放入几乎任何代码,而不用担心实体转义或其他代码博客的典型烦恼。

共享代码最简单的方法是使用公共主旨。只需编写一个并粘贴到嵌入代码。容易peasy。

http://gist.github.com < a href = " http://gist.github.com " > < / >

为了解决搜索引擎问题,可以在页面上使用隐藏的div,简单如下:

<div style="display:none"> content </div>

Emacs具体解答:就blogger而言,它允许内联css。基于javascript的荧光笔的问题是,你必须接受它们的配色方案,或者实现你自己的配色方案。但是,像我一样,如果您喜欢自己的emacs配色方案,那么您还有更好的选择。我已经黑了“htmlize”。El”包为emacs添加以下四个功能…

  1. blog-htmlize-buffer
  2. blog-htmlize-region
  3. blog-htmlize-buffer-with-linum
  4. blog-htmlize-region-with-linum

这些函数将在emacs中的新缓冲区中输出可复制粘贴的html(内联样式),您可以直接在您的博客文章中使用它。输出看起来与您在emacs中看到的代码完全相同(包括配色方案)。

这里是链接到我的博客,在这里你可以找到关于如何使用“blog- htmize”的详细信息。El "和emacs。这也消除了html编码的“小于”和“大于”符号。由于emacs负责所有的高亮显示和样式化,您不必担心js库是否支持代码片段的语言,也不必干预blogger中的模板代码。

你可以找到Elisp文件(将文件保存为blog-htmlize.el)

我使用了一个相当低技术含量的解决方案。我使用这个在线语法高亮显示工具格式化代码,然后将其粘贴到博客中

这个css脚本可能对所有人都有用-它不用于语法高亮显示,但用于以原始格式显示源代码:

 <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>

使用方法:

  1. 将此片段粘贴到文本编辑器中,
  2. 粘贴代码& lt; & lt; & lt; & lt; & lt; & lt; > > > > > >块。
  3. 复制全部和
  4. 粘贴到HTML视图在博客(或任何其他)后编辑器。

好处:简单易用,少配置,容易重新配置,不需要额外的软件

对于我的博客,我使用http://hilite.me/来格式化源代码。它支持许多格式和输出相当干净的html。但如果你有很多代码片段,那么你就必须做很多复制粘贴。对于格式化Python代码,我还使用了Pygments (博客)。

< a href = " http://formatmysourcecode.blogspot.co。英国/ noreferrer“rel = > http://formatmysourcecode.blogspot.co.uk/ 工作正常,你只需要复制,格式化,粘贴回来

1.首先,备份你的博客模板 之后打开你的博客模板(在编辑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.保存博主模板 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, javascript,c#和java,你应该转换特殊字符到html代码。作为'<'作为&lt;'>'&gt;等。

将这个链接代码转换器添加到iGoogle。这将帮助您转换特殊字符。

然后在博客中添加SyntaxHighlighter 3.0.83新版本来定制你的代码。但是你应该知道如何在你的博客模板中配置syntaxHighlighter。

我创造了一个工具来完成这项工作。你可以在我的博客上找到它:

免费在线c#语法高亮显示 .

除了给你的c#代码上色,这个工具还会处理所有的“<”和“>”符号,把它们转换成“<”和“>”制表符被转换为空格,以便在不同的浏览器中看起来相同。你甚至可以让语法高亮显示内联CSS样式,以防你不能或不想在你的博客或网站中插入CSS样式表。