Question

现在，在任何显示代码片段的网站中（即使在Stackoverflow中），代码很好地包含在GUI元素周围，该元素突出显示语法元素，提供行号等。我想在rails代码上显示一些ruby在我的博客中，我想在我的博客中使用这些视觉元素。

如何在博客博客上完成此操作？

Answer 1

点击Blogger中的“修改HTML”，然后在HTML的<head>部分插入以下内容：

<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shCore.js"></script>
<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushRuby.js"></script> <script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shLegacy.js"></script>
<link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/2.1.364/styles/shCore.css" />
<link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/2.1.364/styles/shThemeDefault.css" />     <script language="javascript">
window.onload = function () {
    dp.SyntaxHighlighter.ClipboardSwf = 'http://alexgorbatchev.com/pub/sh/2.1.364/scripts/clipboard.swf';
    dp.SyntaxHighlighter.HighlightAll('code');
    dp.SyntaxHighlighter.BloggerMode();
}
</script>

以及以下<body>您要放置代码的地方：

<pre class="brush: ruby" name="code"># Your Ruby Code</pre>

Answer 2

http://code.google.com/p/syntaxhighlighter/

http://www.pseudocoder.com/blog/javascript-code-highlighter-chili-vs-syntaxhighlighter

http://www.1stwebdesigner.com/resources/16-free-javascript-code-syntax-highlighters-for-better-programming/

Answer 3

SyntaxHighlighter是要走的路，但这里给出的所有链接对我都不起作用。

我找到了一个完整的2步指南，可以在Blogger中安装最新的3.x版本，该版本可以正常使用here。

Answer 4

使用Alex Reitbort提供的链接，您可以使用以下教程之一将其集成到Blogger博客中：

http://heisencoder.net/2009/01/adding-syntax-highlighting-to-blogger.html
  http://yacoding.blogspot.com/2008/05/how-to-add-syntax-highlight-to-blogger.html
  http://abhisanoujam.blogspot.com/2008/12/blogger-syntax-highlighting.html