SyntaxHighlighter 3: fix scroll height in chrome and install to blogger

I desided to add SyntaxHighliter to my blog. All how-tos I found in Internet was about depricated 1.7 version (2007) but current version is 3.*.

There are 2 ways to install - if you have your own fileshosting you should upload js and css files from developers site to your server. Another way - is to use cloudhosting (Amazon) which author gives us.

Here we are implementing the second approach. All we need to do is to include css and js files. Open edit html template and before closing tag body add following code:

<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript">
</script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shAutoloader.js" type="text/javascript">
</script>
<script type="text/javascript">
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.autoloader(
   'xml http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js',
   'sql http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js',
   'php http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js',
   'js http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js',
   'java http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js',
   'groovy http://alexgorbatchev.com/pub/sh/current/scripts/shBrushGroovy.js',
   'css http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js'
);
 
SyntaxHighlighter.all();

</script>

Read more about autoloader and configuration on developers site.
And at the top of head tag include css resources:

<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> 
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>

Now try too look how it works.

SyntaxHighlighter Chrome vertical scroll bug 

And now take a look your page in Chrome browser. If you see an vertical scrollbar - you found a known bug. To fix it just add in css under including shCore.css (thats why we move thouse files on top of the head) next line:

.syntaxhighlighter {overflow-y: hidden !important;}

You can add it manually the same way as we include js and css or use template designer -> advanced -> add css.