アメブロのヘッダ背景に画像をはめ込んだ後、タイトルと説明文を表示しないようにする。ついでに、画像をクリックするとトップページに戻るようにする。
アメブロのヘッダ背景に画像をはめ込むと、タイトルと説明文が画像に重なってしまいます。 レイアウト上、それでいい場合は気にしないでいいのですが、下の例のように、作った画像とタイトル説明文がかぶってしまうデザインだと困ります。
これを避ける手段のひとつは、タイトルと説明文が表示されるあたりの画像を無地にすることです。
もうひとつは、タイトルと説明文を、いっそ、表示しないようにしましょう。ついでに、ヘッダ画像をクリックするとトップページに戻るようにしますね。
カスタマイズ実例:ここからリンク
CSSの
/* (3-2) ブログヘッダー
--------------------------------------------*/
(省略)
/* skinTitleArea ブログタイトルのエリア */
.skinTitleArea{
padding-bottom:4px;
}
/* skinDescriptionArea ブログの説明エリア */
.skinDescriptionArea{}
ここをこのように書き換えます。
/* (3-2) ブログヘッダー
--------------------------------------------*/
(省略)
/* skinTitleArea ブログタイトルのエリア */
.skinTitleArea{
text-indent: -9999px;
}
.skinTitleArea a.skinTitle {
width: 980px;
height:240px;
display: block;
}
/* skinDescriptionArea ブログの説明エリア */
.skinDescriptionArea{
text-indent: -9999px;
}
これは右に書いてあるような意味の作業をしています。
タイトルや説明文は消してしまったわけではないのでSEO上は問題ありません。(の、はずです)
自分でできない!と思ったらご相談ください。
貴方と一緒に相談しながら目の前でヘッダ背景を作る、載せる、タイトルや説明文を表示しないようにする。ブログの色もカスタマイズする。セットで90分15,000円!