ランダムバナー

提供: GeeklogJpWiki

[3]管理方法 > 管理者が導入後すぐ試せる簡単カスタマイズ > テーマをカスタマイズする > ランダムバナー

バナープラグイン(banner)でランダムバナーを作成する

  • ダウンロード:Geeklog Japanese(Geeklog1.5.2以上)
  • 作者 hiro

バナープラグインをインストールし,ヘッダにテーマ変数{banner}を記述することで,ランダムバナーが可能です。

自動タグは,[randombanner:<カテゴリid>]で設置します。


JavaScriptでランダムバナーを作成する

ヘッダ部分に、ランダムにバナーを表示させるためのJavaScriptを紹介します。

参考サイト:eWeb(http://www.eweb-design.com/index.html)画像をランダムに表示する

ヘッダにバナーを置く場合は、header.thtmlの<body>内に、以下のJavaScriptを記述するだけです。

ブロックエリアに置く場合は、ブロックノーマルブロックを追加して、以下のJavaScriptを記述するだけです。

<SCRIPT language="JavaScript">
<!--
// ランダムに画像を表示する
jmp = new Array();
img = new Array();
// ジャンプ先のアドレス(数字は画像と対応)
jmp[0] = "http://www.domainA.foo/";
jmp[1] = "http://www.domainB.foo/";
jmp[2] = "http://www.domainC.foo/";
jmp[3] = "http://www.domainD.foo/";
jmp[4] = "http://www.domainE.foo/";
// 画像のアドレス(数字はジャンプ先のアドレスと対応)
img[0] = "img/img0.jpg";
img[1] = "img/img1.jpg";
img[2] = "img/img2.jpg";
img[3] = "img/img3.jpg";
img[4] = "img/img4.jpg";
n = Math.floor(Math.random()*jmp.length);
document.write("<a href='"+jmp[n]+"'>");
document.write("<img src='"+img[n]+"' border='0'>");
document.write("</a>");
//-->
</SCRIPT>

解説・注意点など

ジャンプ先、画像は追加することができます。

その際は、jmp[5],jmp[6],jmp[7]...というように、数字を1ずつ増やしてください。

個人用ツール