rh日和(仮)

モノ、ゲーム、PCなどについてのブログ。

はてなダイアリーでタイトル横に広告などを置く方法

1. デザイン編集画面のヘッダに、置きたい広告などのコードを貼り付け、divで囲って任意のクラスを指定。さらにそのすぐ後に何も含まないdivを作る。

<div class="adtop">
〜
</div>

<div class="clear">
</div>

2. デザイン編集画面のスタイルシートで、タイトルであるh1要素にfloat:left(タイトルを右に置く場合はright)、幅、高さを指定。

h1{
 float:left;
 height          : 90px;
 width:286px;
}

3. デザイン編集画面のスタイルシートで、広告などに指定したクラスにfloat:right(同じく右に置く場合はright)、幅、高さを指定。

.adtop {
 float:right;
 width:728px;
 height:90px;
}

4. デザイン編集画面のスタイルシートで、1.で作った何も含まないdivにclear:bothを指定し、floatを解除する。

.clear{
 clear:both;
}


 以上。こう書くと簡単だが、この方法に至るまでに3時間くらいかかった。かかりすぎ。
 なお、GoogleAdsenseを置く場合、はてなモジュールのひとつであるadsenseモジュールだとなぜか上手くいかなかったので、別途コードを取得した方がいい。チャネルも使えるし。