2005年12月06日

SeeSaaブログで、記事ページにだけ広告を表示する方法

このブログは SeeSaa ですが、トップページには、表示されていない広告が、記事を表示させると上部に広告が出てくるのが見えると思います。
まさか、私が、SeeSaa のテンプレの記事を書くことになるとは思いませんでした。でも、夢さんにコメントでご質問いただいたので、せっかくだから、紹介します。
もともと、記事の中にだけ、広告を表示する方法は、副業でアフィリエイトするなら無料Seesaaブログでしょ!のケンジさんが丁寧に説明されています。

実は、その中で記事の下にGoogleの広告を貼り付ける方法が説明されていますが、今回、記事の上に表示することにしたのでそれを紹介します。

1.まず、最初にやることは、マイブログにログインしてデザインのコンテンツで記事ページを確認します。何もカストマイズしていない状態なら、記事という名前で種類は記事(ページコンテンツ)というのが、表示するページは「全ページ」で、配置は、「メイン」になっていると思います。
ここで、今の、記事の表示するページを「全ページ」から「トップページ」に変えてしまいます。このままで保存して再構築すると、トップページにだけ記事が表示されて、記事ページ、過去ログページ、カテゴリページには、記事が表示されなくなります。それは大変ですよね(笑)
ご心配なく。次に、上の方にある、コンテンツの追加から、記事を、追加します。「記事ページ」「カテゴリページ」「過去ログページ」にそれぞれ同じように記事を追加します。配置はどれも元の記事と同じ「メイン」でよいと思います。

これで、記事は、4つの表示するページごとに別々に追加されていますので、この中の「記事ページ」に表示する記事だけを編集します。

2.表示するページが「記事ページ」になっている記事をクリックして編集画面に入ります。すると右上の方に「コンテンツHTML編集」というリンクがあるので、そこをクリックします。

3.コンテンツ名「記事(ページコンテンツ)」と書かれていて、その下に、HTMLのところが編集できるように表示されるはずです。このHTMLを編集していきます。
心配な人は、この段階で編集をする前に、HTMLを全部コピーして(HTMLが表示されているところを適当にクリックして、コントロールキーを押しながらアルファベットのAを押す(CTRL+A)とHTMLの全体が反転します。次にコントロールキーを押しながらアルファベットのCを押す(CTRL+C)と反転した全体がコピーされます。それをメモ帳などに貼り付けておくとよいと思います。

ただし、今まで一度も、この記事の HTML 編集をしていない人の場合は、初期値に戻すとすれば、編集する前に戻りますので、わざわざ保存しておく必要は無いと思います。(私が最初に Google を埋め込んだときがそうでした)

4.編集する箇所は、 <div class="blogbody">というところ(1ページ分くらいスクロールしたあたり、HTML全体の真ん中より少し上)のすぐ下に、
<h3 class="title"><a href="<% article.page_url %>" class="title"><% article.subject %></a></h3>
<% if:page_name eq 'article' -%>

という表記がありますので、探してください。ここが、記事のタイトルを表示しているところです。
この部分の最後の<% if:page_name eq 'article' -%>は、'article'が記事ページのことで、表示するページが記事ページなら、これに続く HTML を処理して表示しなさい、って言ってるんです。ついでにいうと、そこから少し下に、<% else -%>というのがあって、もし、記事ページでなければ(else ってそれ以外っていう意味ですよね)この<% else -%>に続く箇所を実行しなさいっていうことです。そういう条件文がどこまで続くかというと<% /if -%>までです。

この部分は、 <% if:条件文 -%>で始まって、条件に合えばこの間 <% else -%>条件に合わなければこの間<% /if -%>これで条件文終わり。という構造をしています。どうも、こういうのを説明したことが無いのでわかりにくくてゴメンナサイ。

☆一番上に Google Adsense を表示する
さて、話は戻って、<% if:page_name eq 'article' -%>は、ここから記事ページの記事が始まりますってことですから、この直後に Google Adsense の HTML を貼り付ければ、広告は記事ページだけ、しかも一番上に表示されます。

☆一番下に Google Adsense を表示する
ちなみに一番上でなくて一番したに表示する方法も紹介しておきます。先ほどの<% /if -%>よりも少ししたに、
<div class="posted">posted by <% article.nickname %> at <% article.createstamp | date_format("%H:%M") -%>

というところが見つかると思います。これは、投稿者のニックネーム(私ならあがさ)を表示しているところです。「posted by あがさ」って記事の下のほうにありますよね。あれです。
そのすぐ上に Google Adsense の HTML文を入れれば、記事の一番下に表示されます。

5.ここまでできたら、下の方にある「保存」をクリックして変更を保存します。「保存」のすぐ右横に「初期値に戻す」というチェックボックスがありますが、このチェックボックスをチェックして「保存」を押すと、すべて初期値に戻ります。
「保存」のすぐ上には、「初期値との差分」「見る」というクリックがありますが、これをクリックすると何を編集したか、編集したところだけを表示してくれます。こういうところは SeeSaa は初心者に親切ですね。

後は、すべてを再構築すれば終わりです。(のはずです)
もちろん、ここには、Google Adsense コードだけでなく、ランキングの応援なども入れることができます。私もそうしてます。

最近はSeeSaa は少し少なくなった気がしますけど、それでもアフィリエイトをするにはやりやすいブログだと思います。
SeeSaa を使っている方はお試しあれ。


追記
Livedoor ブログの場合
コメントいただいた★家に居ながら副収入★の管理人のぞみさんがライブドアらしいので、たまたま私もライブドアブログのアカウントを持っていたので試してみました。

Livedoor の場合は、上に並んでいる「ブログの設定/管理」をクリックして設定画面に入ってさらに左側に並んでいる「デザインの設定」をクリックします。
するとデザインの一覧が出てきますが、一番したの方に「カスタマイズ」があるのでこれをクリックします。
すると、SeeSaa と同じように、スタイルシート、トップページ、個別記事ページ、カテゴリアーカイブ、月別アーカイブと出てきますので、個別記事ページを選びます。
そこに今使っているデザインのHTMLが記述されているはずです。
HTMLはいくらでも書き方があるので、どれも同じかどうかわかりませんが、私が使っているデザインでは、真ん中より少し上のあたりに、記事本体(&ArticleBody$)を表示する部分が見つかりました。

<div class="main"><$ArticleBody$><br clear="all"></div>

このすぐ上に Google Adsense のコードを置けば、記事を開いたときだけ、Google が記事本文の上に表示されます。

またその少し下には、SeeSaaと同じように、投稿者($ArticleAuthor$)を表示する部分がありました。

<div class="posted"><$ArticleAuthor$> at <$ArticleTime$><IfArticleAllowComment>│<a href="#comments">Comments(<$ArticleCommentCount$>)

このすぐ上に Google コードを置けば、記事本文の下に表示されると思います。
ついでに、トップにも表示される記事の前半部分と、記事ページを開いて表示される追加部分の間にもおくことができそうです。上の二つのHTMLの間に、次のようなHTMLで、追記部分があれば表示するところがあります。

<div class="main"><$ArticleBody$><br clear="all"></div>
<a name="more"></a>

この2行の間に Google を挟めば、多分、前半と後半の記事の間に挟まれて表示されると思います。

ランキング参加中。応援していただけるとうれしいです

この記事へのコメント
あがささんおはようございます!
うちのテンプレは画面最大化するときちんと広がるんですが、あがささんのテンプレはいつでもしっかりしてますね。どうしたら直るんでしょう?
テンプレ変えるしかないんですかね?

他のブログを試しに使ってみてシーサーはやっぱり使いやすいと思いました。
もっとみなさんに使って欲しいですね!
Posted by きくっちー at 2005年12月07日 10:43
こんにちは^^
どうやっていいのか解からなかったので・・・
凄い参考になりました。

ちなみに私はlivedoorなのですが、なんとなくコツがつかめた様な・・・(笑)
後でよく読んでやってみます♪
いい情報ありがとう♪(#^ー゚)vございました♪
また来ます♪
Posted by のぞみ at 2005年12月07日 13:32
あがささん こんにちは♪
シーサーブログ 使いやすいですか??
いろいろ試してみようかな〜 アメブロも最近やっとなれた!
ライブドアも気になるし! 全部とりあえず つくちゃおうかな〜 
できたらね☆
またきま〜す!
アドの広告 目立ってます(*^ー゜)v
Posted by るる at 2005年12月07日 15:38
こんばんわ。
変な質問のため無駄な時間を取らせてしまってごめんさい<(_ _)>
また、丁重に記事にしていただきありがとうございました。
とても勉強になり感謝です^^
Posted by at 2005年12月07日 18:27
こんばんわ。
こういう情報はありがたいですね。
シーサーは使いやすいブログだと思います。
もうちょっとかっこいいテンプレートを
用意してくれると更にうれしいですが(笑)
Posted by ひま太郎 at 2005年12月07日 19:37
きくっちーさん、こんばんは。

横幅の広いバナーをいれると、横にはみ出してその分、横にあったものが下に落ちるみたいですね。

SeeSaa の欠点は毎回再構築するので、時間がかかるのと、夜になると異常に遅くなることくらいですよね。それからテンプレがあまりにお粗末ですよね。私のようにデザインセンスのかけらもない人には、もともとのデザインがそろっていないと手が出ません。
それいがいは言うこと無いんですけどね。(これだけ言えば十分?笑)
Posted by あがさ at 2005年12月07日 20:43
のぞみさん、こんばんは。

サイトで紹介していただいてありがとうございます。
Livedoor のアカウントを私も持っていたので、試して見ました。追記部分に記載してますので、見てくださいね。
Posted by あがさ at 2005年12月07日 21:37
るるさん、こんばんは。

SeeSaa は私のような初心者にはうってつけと思います。ちょっと遅いのが玉に瑕ですけどね。

アドの広告目立ちすぎですよね。あんまり効果が無かったら元に戻します。本当はこのサイトではなくて、FC2でやりたかったんですけどやり方がわからないんですよ(笑)
Posted by あがさ at 2005年12月07日 21:39
夢さん、こんばんは。

トンでもないです。おかげでひとつ記事が増えました(笑)
どの程度効果があるかはわからないので、しばらく様子を見てますけどね。
Posted by あがさ at 2005年12月07日 21:40
ひま太郎さん、こんばんは。

本当にそうです。私のサイトもず〜っと、SeeSaa のもともとのテンプレで何とかしなきゃって思ってましたけど、ほかに選びようが無いんですよね。
Posted by あがさ at 2005年12月07日 21:41
大人向けアダルトちっくな個人日記BLOGなんで興味あれば見に来てくださったら嬉しいです★(・∀・)
Posted by jesie at 2006年01月14日 01:52
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

この記事へのTrackBack URL

×

この広告は1年以上新しい記事の投稿がないブログに表示されております。