Wednesday, July 27, 2011

Add Syntax Highlighter for Blogger

Syntax Highlighter are generally used for blogs, which mainly focus on scripting tutorials. We could have seen in many popular blogs using script highlighter to highlight the script. It not only highlight the 
script, but also give us a clear idea, how the script was formulated. This javascript can be capable of displaying css, xml, jscript, python, c# and much more supported programing languages.


Before you could start registration JS for your blog, I recommend you to back up your template.

Step 1:  Download syntax highlighter from here
Step 2:  Add this javascript files to any free host (I have uploaded to www.byethost.com)
Step 3:  Search for <head> and replace it with the below code:

<link href="http://vmustafayev.byethost7.com/blog/SyntaxHighlighter.css" rel="stylesheet" type="text/css"/>
<script src="http://vmustafayev.byethost7.com/blog/shCore.js" type="text/javascript">
<script src='http://vmustafayev.byethost7.com/blog/shBrushJava.js' type='text/javascript'/>
<script src='http://vmustafayev.byethost7.com/blog/shBrushJScript.js' type='text/javascript'/>
<script src='http://vmustafayev.byethost7.com/blog/shBrushSql.js' type='text/javascript'/>
<script src='http://vmustafayev.byethost7.com/blog/shBrushVb.js' type='text/javascript'/>
<script src='http://vmustafayev.byethost7.com/blog/shBrushXml.js' type='text/javascript'/>

<script language='javascript'>
 window.onload = function () {
    dp.SyntaxHighlighter.BloggerMode();
    dp.SyntaxHighlighter.ClipboardSwf = 'http://vmustafayev.byethost7.com/blog/clipboard.swf';
    dp.SyntaxHighlighter.HighlightAll('code');
 }
</script>


Step 4:  Write your code in 


That is all u need :)

No comments:

Post a Comment