アメブロ (旧)ヘッダー画像を挿入する(タイトルを画像化)


旧カスタム可能デザイン【ベーシック】でブログタイトル、説明文を非表示にし(タイトルや説明文も画像として埋め込)、ヘッダーをクリックしたときにトップページへ移動するリンクをはるようにします。

スキンCSSの編集で、一番最後に次を追加します
※ヘッダー画像が800px×300pxの場合

/*ヘッダー画像*/
#header{
background:url(画像URL) no-repeat; /*背景*/
height: 300px!important;/*高さ*/
}
/*ブログタイトル、説明文位置初期化*/
#header h1,#header h2{
margin:0; /*マージン*/
padding:0; /*余白*/
}
/*ヘッダー画像のリンク設定*/
#header h1 a{
width:800px;/*画像の横幅*/
height:300px;/*画像の高さ*/
display:block; /*表示設定*/
position:absolute; /*位置設定*/
text-indent:-9999px; /*テキストインデント*/
text-decoration:none; /*文字装飾*/
}
/*ブログ説明文を非表示*/
#header h2{
display:none; /*表示設定*/
}

ヘッダー画像の大きさに合わせて、高さと横幅は変更します。
画像URLは、アメブロにアップロードした画像URLにしてください

2017年3月からのアメブロ常時SSL化に際しまして、「フリープラグイン」を使ったカスタマイズが利用できなくなる可能性があります
【追記あり】アメーバブログの常時SSL化に伴う仕様変更について|スタッフブログ
フリープラグインを使ったカスタマイズはせずに、CSSを使ったカスタマイズを行ってください