ブログFC2ブログ
日本で一番使われているFC2ブログで あなたもブログをはじめよう!
FC2動画 FC2動画
自分で撮った動画を公開!共有!携帯でも利用できる!!
FC2プロフFC2プロフ
自己紹介ページをすぐに公開できるサービス。 今すぐプロフを作ってみんなに見てもらおう!
FC2アフィリエイト
FC2ブログを紹介してお金がもらえる
FC2アフィリエイトに登録しよう!

TOP > 大きな疑問コーナー > title - ランダム画像・バナーを作るには?

ランダム画像・バナーを作るには?

バナーをランダムにさせるとはどういう事を説明するために見本を作ってみました。このままでは本当にランダム表示されているのかわからないと思うのでブラウザを更新(F5を押す)してみて下さい。


更新すると表示されるバナーの種類が色々と変わりますよね。この様に読み込むごとに変わるバナーをランダムバナーといいます。

ランダム画像・バナーを作る方法紹介

管理画面の[テンプレートの設定]→[編集]の[HTMLの編集]を見てください。そして</head>と言う所を探します。「Ctrl+F」を押して検索するとすぐに見つかると思います。

<script type="text/javascript">
<!--
function RandomBanner(){
var url = "http://あなたのブログのURL" + Math.ceil
(Math.random()*1000000); location.replace(url);
}
// -->
</script>
</head>

見つかったらこの様に</head>のすぐ上に、上記のタグを入力します。
その時にあなたのブログのURLの部分を書き換えるのを忘れないで下さい。

できましたら次はバナーを置きたい場所(フリーエリアなど)に以下のタグを入力します。

<script language="JavaScript">
<!--
  var rNam;
  rNam = Math.ceil(Math.random()*100000);
  if(rNam % 5 == 0){
  document.write('バナーのタグ');
  } else if(rNam % 5 == 1){
  document.write ('バナーのタグ');
  } else if(rNam % 5 == 2){
  document.write ('バナーのタグ');
  } else if(rNam % 5 == 3){
  document.write ('バナーのタグ');
  } else if(rNam % 5 == 4){
  document.write ('バナーのタグ');
  }
//-->
</script>
<noscript>
バナーのタグ(JavaScript非対応のパソコンのために)
</noscript>

バナーのタグは<a href="http://~~~"><IMG SRC="http://~~~" width="数字" height="数字" border="0"></a>この様になっていると思いますが、このタグをそのまま該当箇所に入れます。これで出来上がりです。

注意点

※前後の「 ' 」を間違えて消さないで下さい。小さいので気をつけてください。
※バナーのタグは改行しないで下さい。
※バナーの大きさはバラバラでも大丈夫です。

フリーエリアなどの変更や編集の画面でこの作業をやろうとすると、細かい作業が多くやりづらいと思うので、メモ帳などにコピーして作業して出来た物をフリーエリアなどに貼り付けた方がいいと思います。

JavaScript非対応のパソコンのためにというのは、JavaScript非対応だとランダムバナーそのものが全く表示されなくなって、変なスペースが空いてしまうので、非対応の時でも表示されるようにするためにこの部分があります。好きなバナーを1つだけ選んでこの部分にタグを入力してください。

数を変える方法

この形だと5個までランダムさせる事が出来るのですが、もし6個に増やしたいのであれば・・・

} else if(rNam % 数字 == 数字){
document.write ('バナーのタグ');

この部分を1つ増やして、左側の5の数字を6に全部なおして、右側の数字を上から順番に0.1.2.3.4の部分はそのままで、増やしたところの数字は5にして下さい。

また逆に4個に減らしたい場合は・・・

} else if(rNam % 5 == 4){
document.write ('バナーのタグ');

ここの部分を削除して、左側の5の数字を4に全部なおして、右側の数字はそのまま触らなくてもいいです。

画像の場合

バナーじゃなくて画像の場合も全く同じです。ただ画像をランダムさせたい時にバナーのタグの部分を
<a href="http://~~~" target="_blank"> <IMG SRC="http://~~~" alt="~" border="0"> </a><br clear="all">
この様に画像のタグにするだけです。

このままだと画像がリンクの状態になってしまうので、それが嫌な人は赤字の部分を削除してください。


◆FC2ブログの事でどうしても疑問が解決しない人はFC2ブログ ユーザーフォーラムへ。
★アフィリエイト人気ランキング★  [アフィリエイトとは?]
リンクシェア
の詳細はこちら
エーハチネット
の詳細はこちら
バリューコマース
の詳細はこちら
アフィリエイト リンクシェア ブログ 携帯対応 成果報酬 広告 テンプレート ブログパーツ
コメント
助かってます>^_^<
いつも困ったときには訪問させていただいてます!!
それでも、ブログってやり出したら止まらないというか・・・
色々変えても納得いかなかったり、難しくてわからなかったりしますよね~。
ちょこちょこ自分の満足いくようなブログにしたいと思ってます!
これからも頼りにしてますよ(*^_^*)
あと、こちらを私のブログでリンクさせていただきますm(__)m
リンクありがとうございます。
本当にブログってやり出したら止まらないですよね。
色々やってみたくなっちゃいます。
それでうまくできたら嬉しくて、どんどんいじりたい気持ちになるんですよね。

僕も日々勉強しながら、このブログを作っています。
期待に応えられるよう頑張ります。
もしこのブログで触れていないわからない事があれば、なるべく答えたいと思いますのでよろしくお願いします。
firefoxでの表示
こんにちは。前回はユーザータグでお世話になりました。

今回はランダムバナーの事で教えていただきたいのですが・・・。

私のブログのトップページにランダムバナーを設置しているのですが
firefoxで見ると、1つ目のバナー以外全部表示されてしまいます。
IEではちゃんとランダム表示されるのでそれ程問題視していませんが
気になってしまったのでるんばば様にご相談しました。
こちらのページのるんばば様のランダムバナーはfirefoxでもちゃんとランダム表示されています。
もしも私の間違いがお分かりでしたら、教えていただけないでしょうか?
お忙しいとは思いますが、どうぞ宜しくお願いします。
あみさんへ
firefoxで見させてもらいました。バナーが全部とタグも見えちゃってますね。
何か違うところがあるのかなとじっくり見てみたら、どうやらこのやり方のランダムはバナーのタグが単純なアンカーリンク(a hrefのタグ)ではfirefoxでもIE正常に動くけど、scriptのバナーのタグではfirefoxの場合、上手くいかないみたいです。

もしあみさんのブログへの訪問者がfirefoxを使った人が多いようであれば、違う方法でランダムになるものにした方がいいかもしれません。
お返事ありがとうございます。
スクリプトバナーが原因だったんですね!
早速削除したところ、正常に表示されました。

別の方法を探してはみたものの、やはりスクリプトバナーだと全て表示されてしまいました。
特に重要なものでもないので削除=解決という形にしました。
今回もご親切に回答ありがとうございました。
これからも応援させていただきたいと思います。
頑張ってください♪
参考にさせていただきました。
ブログランキングのバナーを交互に入れ替えたかったんで、色々探してやってみたのですが、上手く作動しない。
そこで、るんばばさんのこのブログを思い出し、記事を検索。

あったあったと、このスクリプトを利用させていただきました。以前に比べて、私もずいぶんカスタマイズできるようになれたのも、この解説ブログがあったからだと思います。ありがとうございます。

これからも参考にしますね。では。
前回、ツリー化の事でるるんばさんに質問したバーバリーです。
前回はどうもありがとうございました(★^▽^)V

今日はランダムバナーの事でちょっと伺いたいのですが、
全部に<a href>で始まって</a>で終わるバナー広告を入れてると問題なく
表示されるのですが、例えばA8.netのバナーのように<a href>で始まるけど
</a>で終わらないバナー広告や、<a href>で始まらないバナー等を1つでも混ぜると
エラー表示になってしまいますo(TヘTo)

もしなにか解決方法があったら、お時間のあるときにでも
教えていただけたら嬉しいです☆

それでは失礼しました応援☆∩(*・∀・*)∩ファイト♪
あれはんどろさんへ
あれはんどろさんはご自分でテンプレを作られたのですね!ブログを拝見させていただきました。すごいですね!!
ほぼ完全にFC2ブログの変数なども理解されていないとできないテンプレだと思います。しかもスタイリッシュですね!!自分もあれはんどろさんの様なデザイン力が欲しいです!!
バーバリーさんへ
この方法を使ってのランダム表示は<a href="http://~~~"><IMG SRC="http://~~~" width="数字" height="数字" border="0"></a>でないと使えないものなので、「ランダムバナー」などで検索してみて、色々な制約がないものを紹介してくださっているサイト様のスクリプトを使ってみてください。お力になれず申し訳ないです。
こんばんは☆

るるんばさんに言われたとおり、いろいろ〔ランダムバナー〕で
検索してみたのですが、どれも初心者の僕にとっては難しい
用語だらけでチンプンカンプンです。・゚・(*ノД`*)・゚・。
お世辞じゃなく、るるんばさんの説明が一番初心者の事を
意識して書いてくださってあってわかりやすいです(★^▽^)V

これからまた初心者にもわかりやすく説明してくれてる
ランダムバナーのサイトを探してみたいと思います☆
いろいろありがとうございました☆
バーバリーさんへ
こんばんは。スクリプトはそのまま張る形のものが多いと思うので、探せば簡単に設置できるものが必ずあると思うので、頑張ってみて下さい!!
この記事のトラックバックURL

http://rgrg.blog61.fc2.com/tb.php/104-1beb6f47   

Template Designed by DW99