Thêm Syntax Highlighter vào Blogger/Blogspot


Hiện tại có rất nhiều dạng Syntax Highlighter được chia sẽ rộng rãi trên mạng internet, Syntax Highlighter thường được sử dụng ở những blog chia sẻ về tin học đặc biệt là về lập trình, nó giúp người dùng dễ dàng nhận biết các đoạn mã có trong bài viết đó bằng việc cho vào những màu sắc đặc trưng của từng mã và hôm nay mình xin hướng dẫn các bạn sử dụng "Syntax Highlighter" :

Các bước thực hiện thêm Syntax Highlighter rất đơn giản. Bạn thực hiện theo các bước sau :

Bước 1 : Truy cập Blogger > Mẫu > Chỉnh sửa HTML
Bước 2 : Tìm đoạn code

]]></b:skin>

Bước 3 : Dán đoạn mã dưới đây vào sau nó

<!--SYNTAX HIGHLIGHTER BY GAME4CSM STARTS-->
<link href="http://alexgorbatchev.com/pub/sh/2.1.382/styles/shCore.css" rel="stylesheet" type="text/css"></link>
<link href="http://alexgorbatchev.com/pub/sh/2.1.382/styles/shThemeDefault.css" rel="stylesheet" type="text/css"></link>
<script src="http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shCore.js" type="text/javascript">
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCss.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shYouBrushJava.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPython.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushRuby.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushVb.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushXml.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPerl.js' type='text/javascript'/>
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/2.1.382/scripts/clipboard.swf&#39;;
SyntaxHighlighter.all();
</script>
<!--SYNTAX HIGHLIGHTER BY GAME4CSM ENDS-->

Bước 4 : Lưu mẫu lại và kiểm tra lại kết quả
Cách sử dụng :
Trong lúc viết bài, bạn sử dụng đoạn code sau :

<pre class="brush:css, brush:html, brush:js, brush:php, brush:sql, brush:python">
Nội dung đoạn code
</pre>

Tôi đã tối ưu, tổng hợp lại các đoạn code để các bạn thực hiện thao tác được dễ dàng hơn.
Hy vọng các bạn thích nó.


CONVERSATION

Back
to top