Thứ Hai, 19 tháng 7, 2010

Thêm blogger Syntax hightlighter 3.0.83

How to add syntax highlighting to Blogger with Alex Gorbatchev's open-source SyntaxHighlighter.
  • Đăng nhập vào tài khoản. Chọn Thiết kế->Chỉnh sửa Html.
  • Nhấp vào "Tải xuống Mẫu đầy đủ" (Download Full Template) để làm bản sao lưu dự phòng mẫu thiết kế của bạn.
  • Bạn có thể thêm đoạn code sau vào đâu miễn là nằm trong thẻ <body></body> hoặc trước thẻ .
    Lưu ý: Để dễ tìm kiếm, bạn nên copy mã nguồn vào 1 editor nào đó, như Notepad++ hay word, rồi dùng chức năng tìm kiếm.
  • <link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
    <link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
    <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
    <!-- add brushes here -->
    <script type='text/javascript'>
    SyntaxHighlighter.config.bloggerMode = true;
    SyntaxHighlighter.all();
    </script>
  • Sau chú thích Add brushes here, bạn thêm vào ngôn ngữ mà bạn dự định dùng. Ở đây ví dụ là Javascript, Java, Xml/Html, Css, C++, C#, PHP, Delphi, SQL.
<!-- add brushes here -->
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js" type="text/javascript">
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDelphi.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>

Bạn có thể xem và lấy đầy đủ đường dẫn các ngôn ngữ ở đây: Syntax Hightlighter-Hosting
Download mã nguồn đầy đủ tại đây
Một số ví dụ:
SQL:
<pre class="brush:sql">
SELECT * FROM users WHERE user_id = 1212;
</pre>
SELECT * FROM users WHERE user_id = 1212;
C++
<pre class="brush:cpp">cout<<"Hello World";
</pre>
cout<<"Hello World";

Không có nhận xét nào:

Đăng nhận xét

Bài đăng phổ biến