日の出

自由気ままに思ったことを書きます。

カラムの幅を変更 アドセンス用

今まで、記事カラムの幅が狭くて、グーグルアドセンスの広告(336✕280)が2つ横並びにできない状態でした。あんまり気にせず、縦に並べておけばいいかと思っていたのですが、余分なスクロールが必要でめんどくさいし、見た目も良くない気がしたのでカラム幅を変更しました。

 

アドセンスは広告の大きさでクリック報酬が変わっているとのこと(当然大きい広告ほど高い)。なので出来れば、336✕280が見栄え良く収まる形にしておこうと思いまして、カラム幅を680にして余裕を持たせて変更しました。

ちなみに記事が読み終わった後が1番クリック率高いらしいです。(そういうわけで、このブログでは記事下に2つ並べようと思いました)

 

 変更方法

以下の記事を参照にしました。

tkoyama1988.hatenablog.com

僕自身CSSやHTMLのことは実は全然知らないのですが、とりあえずいじっているうちに動けばいいかと思っている程度。

上記の記事を参考に、実際に僕のページは以下のようなコードをデザインCSSに追加しました。

 

#box2 {
float: right;
width: 280px; /* サイドバーの幅 */
}

#content {
padding: 0 10px 20px 10px;
}


#wrapper {
float: left;
width: 640px;
}

#main {
float: right;
width: 680px;
padding: 0 10px 0 10px;
min-height: 100px;
}

 

box2でサイドバーの幅を調整できます。

mainで記事のカラムの幅(width)を調整できます。

アドセンスは1つ336pxなので余裕を持って680に設定。

ここでのwrapperはよく分からんです。数値いじると何故か記事カラムとサイドバーカラムの間の距離がかわりました。まあ動けばとりあえずは何でもいいけど、そのうちちゃんと勉強してみようかな。