TOP絵
さて、大手のブログさんではこういった感じに
TOP絵を設置してる所が非常に多いですよね?(さらに画像にブログトップのリンク貼り付けたり)
今回はそのようにTOP絵を貼り付ける方法をご紹介致します。
実は管理人はこれを設置するまでにかなりの苦労をしました。
それでは続きにて。
追記
ここ最近のlivedoorブログのデザインでは簡単にTOP絵設置が可能です。
ヘッダ画像かんたんアップロード機能のお知らせ|Blogger Alliance お知らせブログ
この記事の方法は結構大変なので手軽に変更したい方はこちらの記事へ移動してください。
ただしこの方法は古いlivedoorブログのデザインでは使用できません。


まずは新管理画面、旧管理画面がありますが、
現在旧管理画面のプレビューが消えてしまってる為
新管理画面メインに説明をしていきます。

※現在当ブログが使用しているlivedoorデザイン「Liquid Plant」を基準に説明していきます。
テンプレート(Liquid Plant)


というわけで新管理画面にて説明をしていきます。

まずはブログ設定をクリックします。
1


「基本設定」の「デザイン」をクリック。
2


「デザインカスタマイズ」をクリック。
3
※カスマイズ前に「保存」でバックアップをすることを強くお勧めします。


☆TOP絵を貼るだけの場合

スタイルシート(CSS)で「Ctrl+F」でjpgで背景画像を検索します。
3
Liquid Plantでは「03. Title - ブログタイトルエリア */」部分のみなので
この部分を指定したい画像を設定します。
他のデザインでも「#banner,#subbanner」の
{}内にあるbackground:urlの()内辺りを変更すればOKだと思います。

TOP絵の大きさ変更はwidth(横幅)、height(縦幅)の数値を変更するのですが、
widthの幅を増やした時は大きくした分他の箇所でズレが出る可能性があるので
大きくした分他の箇所も変更しないといけません。

http://knowledge.livedoor.com/10992
#container、#banner、、#blogcontainer、#wrapper、#content、#blog
といったこの箇所全ての変更をかけないといけません。(Liquid Pearlでは)


☆Liquid Pearlなら幅を広げたバージョンを公開しましたので良かったら↓
livedoorのカスタマイズ用テンプレートを公開しました- 気まぐれなブログ。


☆TOP絵にリンクする設定をする場合
1
先程の箇所の画像リンクを消去します。
※ここでTOP絵の画像リンクをつけてしまうと画像が二重になるケースがあります。


トップページ、個別記事ページ、カテゴリアーカイブ、月別アーカイブの部分にある
<h1 id="blog-title"><a href="<$BlogUrl$>" title="<$BlogTitle ESCAPE$> トップへ"><$BlogTitle ESCAPE$></a></h1>


<a href="<$BlogUrl$>"><img src="△△△△△△"></a>

にしてください。

なお、画像ランダムに表示させるためには以下のようなjava script を利用します。
<a href="<$BlogUrl$>">

<SCRIPT language="JavaScript">
<!--
// ランダムに画像を表示する
img = new Array();
img[0] = "△△△△△△";
img[1] = "▲▲▲▲▲▲";
n = Math.floor(Math.random()*img.length);
document.write("<img src='"+img[n]+"' border='0'>");
//-->
</SCRIPT>

<noscript><img src="△△△△△△" border="0"></noscript>
</a>

ユーザーによってはjava script を無効にしている人もいますので
無効にされてた場合の設定(noscript)を設定させます。
border="0"は画像を入れるときは必須です。これを入れないと枠線が表示されるので。
ランダムで表示させたい画像がもっとある場合はimg[2] =、img[3] =と増やします。


※livedoor公式方法の場合では画像ランダムに表示させることはできません。
自力でカスタマイズする必要があります。
なのでランダム表示したい場合こちらのタグを活用してみてはいかがでしょうか。



ちなみに当ブログのTOP絵はオリジナルではなく
イラストを描いてる方にお願いして作成して頂きました。
TOP絵大感謝です- 気まぐれなブログ。


■参考になりそうなリンク
ブログのタイトルをトップ絵にしたい
ブログのTOP絵について
ブログのトップ絵について
ブログタイトル画像を変更。画像クリックでTOPページに戻るには?
管理人もあまり細かいことは説明しにくいです。
「表示」→「ソース」にて当ブログや気になるブログなどを参照するのも1つの方法かもしれません。