SyntaxHighLighterの改行アイコンを消す方法

以前こちらの記事でSyntaxHighLighterの導入方法を書きました。

初期設定でも問題なく使えるのですが、改行アイコンが邪魔だったため消しました。

改行アイコンを消すことでツールバーのアイコンが消えてしまいます。

少しそこでつまずいたのでメモします。

（１）bloggerの「テンプレート⇒HTMLの編集⇒続行」に貼り付けたSyntaxHighLighterのコードから下記1行を消去して「テンプレートを保存」。

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

（２）http://alexgorbatchev.com/pub/sh/2.0.320/styles/shCore.cssにアクセスしてcssの内容をコピー。

（３）bloggerの「カスタマイズ⇒アドバンス⇒（スクロール下）CSSを追加」からコピーしたcssの内容を貼り付け。

（４）cssの下記箇所を修正。
　display～の行を修正するだけでも問題ありません。
padding～、text～は改行テキストのパディングとインデントの指定になるため必要であれば残してください。

・修正前

.syntaxhighlighter .line .content .block
{
    display: block !important;
    padding-left: 1.5em !important;
    text-indent: -1.5em !important;
}

・修正後

.syntaxhighlighter .line .content .block {
 background: none !important;
}

（５）urlの相対パスを、以下のように絶対パスに修正（4箇所）。
cssをbloggerに記述したことによって、ツールボックスのアイコン（png）が表示されなくなります。
pngファイルを読み込む際にcssと同ディレクトリを参照しますが、bloggerには該当のpngファイルが存在しないためです。

・修正前

 background-image: url(magnifier.png) !important;

 background-image: url(page_white_code.png) !important;

 background-image: url(printer.png) !important;

 background-image: url(help.png) !important;

・修正後

 background-image: url(http://alexgorbatchev.com/pub/sh/2.0.320/styles/magnifier.png) !important;

 background-image: url(http://alexgorbatchev.com/pub/sh/2.0.320/styles/page_white_code.png) !important;

 background-image: url(http://alexgorbatchev.com/pub/sh/2.0.320/styles/printer.png) !important;

 background-image: url(http://alexgorbatchev.com/pub/sh/2.0.320/styles/help.png) !important;

【参考サイト】
SyntaxHighlighter2.0の使い方 | Web制作支援 | ShanaBrian Website