小金持ちへの挑戦

アクセスカウンタ

zoom RSS ランダムに広告を表示するスクリプト

<<   作成日時 : 2005/09/29 00:37   >>

面白い ブログ気持玉 1 / トラックバック 0 / コメント 0

ブログの記事中に広告を埋め込むことってありますよね? それには広告タグを直接埋め込むわけですが、これが意外と面倒だったりします。また、プロモーション終了したら広告を外さなきゃいけないので、どこに何を入れたかを覚えておかなければなりません。

僕は生来のめんどくさがりやで、入れたり外したりを手作業でやるのがどうにも面倒だったんです。そこで、複数の広告からランダムに選んで自動で表示する簡単なスクリプトを作ってみました。バリューコマースなどのローテーション広告のようなものです。

右サイドバーの中央付近(Google AdSense広告の上)にバナーが出ていると思いますが、それがそうです。リロードするたびに変わると思うのでちょっと試してみてください。
※残念ながらウェブリブログの記事中では使えませんでした(フリースペース内でのみ表示されました)。

すごく単純な JavaScript ですが、単純な割には使えるし応用も利くと思うので、スクリプトとその使い方を公開します。

【スクリプト】
<script type="text/javascript">
<!--
txt = new Array();
txt[0] = ' 広告タグ ';
txt[1] = ' 広告タグ ';
txt[2] = ' 広告タグ ';

objs = document.getElementsByName("random_ads_area");
for (n = 0; n < objs.length; n++) {
    var i = Math.floor(Math.random() * txt.length);
    objs[n].innerHTML = txt[i];
}
//-->
</script>

【使い方(手順)】
  1. 上記のスクリプトをメモ帳などにコピー&ペーストします。

  2. 広告タグの箇所に適当な広告タグを張り付けます。上記例は3つまで書けますが、足りない場合は txt[n] の行を増やします。[]の中の数字も順に増やしてください。

  3. 広告タグは、必ず ’(シングルクォート)で囲んでください。

  4. できがったスクリプトを、htmlテンプレートの </body> の直前にコピー&ペーストします。ウェブリブログの場合は、フリースペースの一番後ろが良いです。

  5. 広告を表示したい場所に、<div id="random_ads_area"></div> を追加します。複数箇所に書くこともできます。
手順はこれだけです。
ウェブリブログでは無理ですが、FC2ブログなどで html テンプレート中に広告表示タグを埋め込んでおけば、あとは何もしなくてもいろいろな広告が表示されて便利なのではないでしょうか…。

【注意事項/免責】
  • 広告タグ中に改行が含まれるとスクリプトがエラーとなります。改行はとってしまいましょう。

  • 複数箇所に書くことはできますが、同じIDが1ページ中に複数あるのは好ましくありません(一意識別するためのものなので)。なので、複数箇所に書いた場合、上手く表示できないブラウザもあるかもしれません。

  • スタイルシート中で random_ads_area という id を使用していると、ページ全体の表示がおかしくなります。

  • このスクリプトを使う場合、自己責任で使ってください。使用により生じたいかなる損害についても、私は保証しないものとします。

【解説】
解説も何も、ソースにあるように広告タグを配列に入れて乱数で選択し、テキストを置換しているだけです。カスタマイズや改変はご自由におこなって構いません。というか、その方が使い勝手が良くなるでしょう。


データバインド機能Ajax を使用すれば、広告のみを別ファイル(CSVファイルなど)に入れてそこから読み込むことも可能だったんですが、前者(データバインド機能)は Internet Explore でしか使用できないので使うのをやめました。
Ajax の機構は Googleマップでも使用されており、とても便利なのですが・・・いろいろ実験したけどうまくいかなかったので、今回は諦めました。当初やりたかったことはできたので(^^;
ただ、広告を別ファイルにできれば、さらに便利だと思います。なので、Ajax についてもう少し勉強して、対応したスクリプトを作ってみたいと思います。できたらまた公開しますので…乞うご期待!

この記事が少しでも参考になりましたら、ランキングへ投票(クリック)していただけると嬉しいです♪

テーマ

関連テーマ 一覧


月別リンク

ブログ気持玉

クリックして気持ちを伝えよう!
ログインしてクリックすれば、自分のブログへのリンクが付きます。
→ログインへ
気持玉数 : 1
面白い

トラックバック(0件)

タイトル (本文) ブログ名/日時

トラックバック用URL help


自分のブログにトラックバック記事作成(会員用) help

タイトル
本 文

コメント(0件)

内 容 ニックネーム/日時

コメントする help

ニックネーム
本 文
ランダムに広告を表示するスクリプト 小金持ちへの挑戦/BIGLOBEウェブリブログ
文字サイズ:       閉じる