How to Use/Add Syntax Highlighter to Blogger ?

Syntax Highlighter is a open source  java script client side code syntax highlighter.
It is a combination of javascript & CSS code.It is used to highlighting code syntax in
blog,Just like in this blog.

To use it just Follow the steps :-
1. Go to your Blogger Dashboard & click on "Design" ,then click
    "Edit Html".

2. Now Go to http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/SyntaxHighlighter.css.
    Then "Select all"  & "copy" on that page.

3. Paste the copied code at the end of the css section of your blogger
    html template (i.e., after <b:skin><!--[CDATA[/* and before ]]--></b:skin>).

4. Then Paste the following code before the </head> tag.
 Code Follows :-
  
  
  
  
  
  
  
  
  
  
  
  
  
   

    You can remove any <script> line for languages you'll never use.
    (For example you will never use "python" language then delete that
     <script></script> line contains "shBrushPython.js"). Remove requires
    for faster loding .
5. Insert the following code before the </body> tag.
 Code Follows :-
  

  Now click "Save" to save customized the template.

6. When composing a blog entry that contains source code, click the "Edit Html"
    tab on the "Posting"and put your source code (with html-escaped characters)
    between these tags:(<pre></pre>) or (<textarea></textarea>) just as below.
 Code Follows :-

...Your html-escaped code goes here...
OR
  
Substitute "cpp" with whatever language you're using (full list). (Choices: cpp, 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)


0 comments: (+add yours?)

Post a Comment