iPhone、iPod、Mac、PHP、WordPress、動画、その他いろいろ
2月 24th, 2008
アクセス解析とリスティング広告の設定
せっかくブログを新設したので、WordPressにAnalyticsとAdsenseも設定しよう。
Google Analyticsは、サイトへのアクセスを詳細に分析してくれる無料サービス。
Google Adsenseは、広告を表示することで収入が得られるサービス。
両方とも、GoogleのサイトからJavaScriptのコードを取得して、自分のサイトに貼り込まなければならない。
フッタにGoogle Analyticsを貼り込む
Analyticsのコードは、HTMLの最後にある、
管理画面に入って、メニューバーの「表示」→「テーマエディタ」を選び、右サイドメニューから「フッター」を選ぶ。
の直前にコードを貼り込んで、「ファイルを更新」をクリックする。
ヘッダにGoogle Adsenseを貼り込む
Adsenseの広告は、タイトルロゴの下に728×90ドットのテキスト広告を入れることにする。
（Adsenseは、記事中に紛れ込ませるよりも、広告であることをしっかり明示したほうが、収益が向上する。）
テーマファイルの「ヘッダー」を選んで、<div id=“header”>ブロックの終わりの</div>の直前にコードを貼り込む。
さて、実際のページを見ると……。
表示場所は間違いないが、はみ出している。
こういうときは、慌てず、CSSを調べて、修正する。
今は、Firefoxのおかげで、こういった作業も効率よく行える。
FireBugをインストールしたFirefoxで該当ページを開き、FireBugのペインを表示させる。
「HTML」タブを選んで、HTMLの階層構造を開いていくと、<body> → <div id=“header”> の高さ（height）はCSSの167行目以降に定義されていることがわかる。
そこで、テーマファイルの「スタイルシート」を選んで、いったん行番号を表示できるテキストエディタ（ここではJEdit X）にコピー。
169行目を
height:75px;
↓
height:150px;
と書き換える。
続いて、「WEBプログラミング、MAC、IPOD…」という説明書きの下に15pxの余白を作る。
#header div.descriptionの定義の最後（191行目）に、
margin-bottom:15px;
を追加する。
これを再び、テーマファイルの「スタイルシート」の編集画面に書き込む（元のソースを完全に置き換えるよ）。
「ファイルを更新」をクリックして、ページを確認すると、きっちり広告が収まっている。
カテゴリー: Adsense, Analytics, Firebug, Firefox, WordPress
http://www.zubapita.jp / WordPressにAdsenseとAnalytics
