Lekumo パーフェクトガイド : ブログタイトル部分を背景画像にして印象を大きく変える

会社のブログである以上、ぱっと見で「ビジネスっぽい印象」は出したいですよね。そのためにまずできることが、”トップのタイトル画像を変更する”です。

ブログのタイトル部分に（自分で用意した）背景画像を設定すると、ブログの印象を大きく変えることができます。

背景画像は、カスタムCSSウィザードのカスタムCSSで、以下のコードを貼り付けることで実現できます。

#banner {
padding:0;
margin:0 0 10px;
border:0;
-webkit-border-radius:0; -moz-border-radius:0; border-radius:0;
}

#banner-inner {
background:url("http://biz.typepad.jp/tbb/files/biz011chair.jpg") no-repeat scroll center top;
font-family:Georgia,"Hiragino Mincho Pro W3","ヒラギノ明朝 Pro W3",serif,"ＭＳ 明朝";
height:150px;
}

.banner-group{
margin-left:20px;
}

#banner h1 {
font-size:2.5em;
font-weight:bold;
display:block;
margin:40px 0 0 0;
}

#banner #banner-description {
color:#444;
}

#banner h1 a {
color:#333;
}

画像に関しては、上記ソースコード内の以下 URL になっているところを、独自で用意した画像に差し替えることで変更できます。

http://biz.typepad.jp/tbb/files/biz011chair.jpg

推奨画像
幅：960px
高さ：170px

※幅と高さは、「きっちりこのとおりでないとダメ！」とかではありません。自動でサイズ調整してくれるので、ご安心を。

画像については、あらかじめ用意してファイルマネージャでアップロードしておいてください。
ファイルマネージャにアップロードする手順は以下の通りです。

画面上部のメニューから、 [設定（歯車マーク）] - [ファイルマネージャ] をクリックする

Cl0501