Bước 1: Copy source CSS
Vào trang địa chỉ http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/SyntaxHighlighter.css và copy tất cả code CSS trong trang đó.
Bước 2: Dán code CSS vào template
Mở chế độ chỉnh sửa HTML (Từ trang chủ click Thiết kế ở góc trên bên phải click vào button Chỉnh sửa HTML ) Dán code Css vừa copy vào ngay trước dòng
]]--></b:skin>Bước 3: trỏ đường link tới file javascript
Copy toàn bộ nội dung sau
<!-- Add-in CSS for syntax highlighting -->
<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>
và Paste vào trước thẻ
</head>
Bước 4: Copy và past đoạn code sau vào trước thẻ </body>
<!-- Add-in Script for syntax highlighting -->
<script language='javascript'>
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>
Bước 5. Click "Xem trước" để kiểm tra xem liệu trang blog của bạn có bị hỏng bố cục hay không.
Bước 6: Sử dụng
Khi soạn thảo code , bạn vào chế độ soạn thảo HTML
...Your html-escaped code goes here...
Để hiển thị đúng thì các bạn phải dùng một chương trình để encode sourcode
ví dụ http://www.opinionatedgeek.com/dotnet/tools/htmlencode/encode.aspx
để encode của bạn về HTML rồi mới past vào (khi đang ở trong chế độ HTML)
Tips: Để đơn giản, các bạn paste code vào trang soạn thảo ở chế độ bình thường và chuyển qua chế độ HTML rồi thêm 2 tag mở và đóng ở đầu và cuối đoạn code là được
Để hiển thị các source code của các ngôn ngữ khác nhau các bạn có thể thay thế "cpp" bằng c, c++, c#, c-sharp, csharp, css, delphi, pascal, java, js, jscript, javascript, php, py, python, rb, ruby, rails, ror, sql, vb, vb.net, xml, html, xhtml, xslt
Chúc các bạn thành công!
"Nguồn: http://heisencoder.net/2009/01/adding-syntax-highlighting-to-blogger.html"
