アメブロのタイトル（ヘッダ）上の広告を目立たないようにする工夫

※カスタム可能/CSS編集用デザイン（新スキン）用です


・サンプル１は、背景を設定するだけで実現可能です。
・サンプル２は、サンプル１にヘッダ広告を少し横にずらして、左側にロゴ（画像）をおいています。

サンプル１

デザインの変更のCSSの編集の最後に追加してみてください

.skinFrame{
 background:#F2EFEA url(背景画像のURL) left top repeat-x;
 z-index: 2;
}

サンプルに使用している背景画像です。
広告のサイズは、縦が90pxなので縦110px程度の背景画像を使用しました。
背景色は#F2EFEA　の部分ですので、これを変更することで背景色を変更できます。

サンプル2

サンプル１に以下を追加することで実現可能です。

.headerBnr{
width:980px;
 background-image: url(ロゴ画像のURL);
background-repeat: no-repeat;
z-index: 3;
}

/*広告を横に移動*/
.headerBnrArea .ad_frame{padding-left: 225px;
}

サンプルに使用したロゴ画像はこれです。
横幅は200pxです。200px程度の大きさの画像がおけます。透過PNG（GIF）で作成して背景と重ねることもできます。

目立たなくするには？

1.広告自体をタイトルロゴに埋め込む
2.広告よりも大きいタイトル枠を広告下に設置

ビジネス系で使ってる人は、２番が多いようです。