There are a lot of stuff is available for syntax highlighter on google but this one I find better suited for my requirement so feels like sharing with you.
You can get reference here...
When you get logged in in your blogger account follow this step.
Template ----> Edit HTML
Inside the HTML code just before </b:skin> tag paste the following CSS code.
You can also change the above properties according to your requirement.
How to use this class...?
To use other highlighter paste the following scripts in your Template right before the end of <head>...
Here is code to show this highlighter...
You can get reference here...
When you get logged in in your blogger account follow this step.
Template ----> Edit HTML
Inside the HTML code just before </b:skin> tag paste the following CSS code.
.code { background:#f5f8fa; background-image:none; background-repeat:no-repeat; border: solid #5C7B90; border-width: 1px 1px 1px 20px; color: #000000; font: 13px 'Courier New', Courier, monospace; line-height: 16px; margin: 10px 0 10px 10px; max-height: 200px; min-height: 16px; width: 00px overflow: scroll; padding: 28px 10px 10px; width: 90%; } .code: hover { background: #FAFAFA; background-image:none; background-repeat:no-repeat; }
You can also change the above properties according to your requirement.
How to use this class...?
<pre class=
"code"
>
//code goes here
</pre>
To use other highlighter paste the following scripts in your Template right before the end of <head>...
<!-- REQUIRED JAVASCRIPT LIBRARIES --> <link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shCore.css' rel='stylesheet' type='text/css'/> <link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> <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/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 = 'http://alexgorbatchev.com/pub/sh/2.1.382/scripts/clipboard.swf'; SyntaxHighlighter.all(); </script>
Here is code to show this highlighter...
No comments:
Post a Comment