Syntax highlighting is a feature of text editors that are used for programming or scripting, such as HTML. The feature displays text, especially source code, in different colors and fonts according to the category of terms. Highlighting does not affect the meaning of the text itself; it is intended only for human readers.
Syntax highlighting allows code in your posts to be highlighted based on the language it's written in, to make it easier to read. A blogger will have to display some code segments or scripts as a part of his or her posts when they are describing a tutorial, tips or a hack. And so it is important to show these code segments in a highlighted part, with colors, line numbers, etc. The version that we are using is Syntax Highlighter 3 developed by Alex Gorbatchev.
Place this code just above your
How to use in your blog post:
That's it! If you are having any problem in implementing this script, feel free to make a comment with your problem!
Syntax highlighting allows code in your posts to be highlighted based on the language it's written in, to make it easier to read. A blogger will have to display some code segments or scripts as a part of his or her posts when they are describing a tutorial, tips or a hack. And so it is important to show these code segments in a highlighted part, with colors, line numbers, etc. The version that we are using is Syntax Highlighter 3 developed by Alex Gorbatchev.
Place this code just above your
</body> tag I have put a conditional tag for better faster page load. The script will only load on post page only and not on other pages.
<b:if cond="data:blog.pageType == "item""> <!-- SyntaxHighlighter starts --> <link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css"></link> <link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"></link> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushAS3.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushColdFusion.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDelphi.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDiff.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushErlang.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJavaFX.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPowerShell.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushScala.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js" type="text/javascript"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.all(); </script> <!-- SyntaxHighlighter ends --> </b:if>
How to use in your blog post:
<pre class='brush:xml'>
Your HTML Code here
</pre>
That's it! If you are having any problem in implementing this script, feel free to make a comment with your problem!
Post a Comment