General Photographics: SyntaxHighlighter

Blogger に SyntaxHighlighter をホスティングで導入しましたが、細かいスタイルの変更はどうしたらよいのでしょうか？直接サーバにインストールして使用している場合は "shCoreDefault.css" を編集しているようです。しかしホスティングではそうはまいりません。Blogger ではどうするか？

テンプレート -> HTMLの編集

で解決しようと思いましたら、直接HTMLを編集するより、よかったらテンプレートデザイナーを使ってね、と出てきました。そこで

テンプレート -> カスタマイズ -> アドバンス -> CSSの追加

/* SyntaxHighlighter 行ごとの色の変更 */
.syntaxhighlighter .line.alt2 {
  background-color: #f7f7f7 !important;
}

/* SyntaxHighlighter 行番号とソースコードの間の線の幅と色*/
.syntaxhighlighter .gutter .line {
  border-right: 3px solid #ededed !important;
}

と記述しましたとさ。

ソースコードが見にくいので SyntaxHighlighter を Blogger で使えるようにします。

SyntaxHighlighter -> integration からここのサイトを参考にして Objective-C を加えたのが以下。デザイン-> HTMLの編集で <HEAD> の前に挿入。

<!--SYNTAX HIGHLIGHTER BEGINS-->
<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'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.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/shBrushCSharp.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/shBrushJava.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/shBrushPhp.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/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 src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'></script>
<script src='http://www.undermyhat.org/blog/wp-content/uploads/2009/09/shBrushObjectiveC.js' type='text/javascript'></script>
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>
<!--SYNTAX HIGHLIGHTER ENDS-->

int main (int argc, char const *argv[])
{
    printf("Hello world!");
    return 0;
}

Objective-C

#import <Cocoa/Cocoa.h>
@interface TestObject : NSObject
{
    NSMutableArray *testArray;
}
@property (readonly) NSMutableArray *testArray;
- (void)setTestArray:(NSMutableArray *)array;

行ごとに色を変る方法は確認中。

General Photographics

2011年10月31日月曜日

SyntaxHighlighter on Blogger

2011年7月19日火曜日

SyntaxHighlighter on Blogger

ラベル