- ランダムバナー -

ランダムバナー

	( 1 / 1 )

ランダムバナーについて

ランダムバナーは、ページにアクセスするたびにランダムにバナーが入れ替わって表示されるという、とても便利なものです。

バナーに限らず、テキスト、画像、リンクなど同じ手法でいろいろなコンテンツを表示することができます。

ここでは、外部ファイルに記述した複数のバナーをＰＨＰスクリプトでランダムに読み込んで表示する方法をお教えします。

※無料ブログではＰＨＰスクリプトを使用することができません。
　また、ＰＨＰが使えないサーバーもあります。
　そのような場合は、ＪＡＶAスクリプトを使ってランダムバナーを作成することができます。
　JAVAスクリプトを使ったランダムバナーの作成ツールがありますので、以下からダウンロードしてご利用ください。
　ランダムくん

※ランダムバナーの仕組みは、ランキング攻略などにもご利用になると有用ですが、ＪＡＶAスクリプトを使った場合は、ランキングサイトのプログラムではじかれる場合がほとんどです。
　管理のしやすさから言っても、ＰＨＰが使える環境であればＰＨＰスクリプトを使うことをお勧めします。

ランダムバナーの作り方　１

このホームページには、ヘッダー、それぞれの記事下部、サイドバーにランダムバナーが使われています。

画面を更新するたびにバナーや画像が入れ替わっています。

今回は例として、ＤＵＧＡくん７を使ってサイドバーのようなサムネイル画像のランダムバナーを作成してみましょう。

ランダムバナーの作成　２

外部ファイルの作成

まず、外部ファイルを作成します。
ファイル名は自由に付けてください。（ここでは「pr_1.txt」とします）

ＤＵＧＡくん７で、「サムネイルバナー」を選択し、画像サイズを指定して「データ取得」ボタンを押してください。

※サムネイルのサイズは、ＨＰくんＳＰで作成する場合、２カラムなら幅240px, ３カラムなら幅180pxでちょうど良いサイズになるようにしてあります。
　その他の場合は、ご利用になるテンプレートなどのサイドバーの幅に入る大きさを指定してください。

書き出されたバナーのデータを全てコピーし、先ほど作成した「pr_1.txt」に貼り付け、おまじないとして最後の改行を削除してください。

このテキストファイルを、ご利用になるサイトの文字コードで保存してください。

※文字コードは、ＨＰくんＳＰの場合は「ＳＨＩＦＴ－ＪＩＳ」、ワードプレスの場合は「ＵＴＦ-８」です。

完成したファイルを、サーバーにアップロードしてください。

ランダムバナーの作成　３

作成した外部ファイルのバナーのコードを１行ごとにランダムに読み込むスクリプトを、バナーを表示させたい個所に記述してください。

例に挙げたホームページでは、ＨＰくんＳＰの「左サイドバー」の２番目のコンテンツの所になります。

「pr」というフォルダの中に「pr_1.txt」を入れた場合、スクリプトは以下のようになります。

<?php $Array=file("pr/pr_1.txt"); $Max=sizeof($Array)-1; $n=rand(0,$Max); print $Array[$n]; ?>

例示のホームページのように、縦にずらっとサムネイルバナーを並べるには、このスクリプトを改行タグでつないで表示したい数だけ記述します。

サイドバー内でのセンタリングは、ＤＩＶタグにＣＳＳで指定すればよいでしょう。
例えば、以下のようになります。

これでランダムバナーの完成です。

※ＰＨＰスクリプトで記述された部分は、ローカルのＰＣでは表示されません。
　サーバーにアップロードすると確認することができます。

※外部ファイルと表示するサイトのファイルが同じサーバーやディレクトリにない場合であっても、スクリプトのファイル名をフルパスで指定してやることで読み込むことができます。

ワードプレスでも通常はＰＨＰスクリプトを記事中やサイドバーで使用することはできません。
ＰＨＰを使えるようにするプラグインをインストールする必要があります。
以下のレポートで詳しく説明していますので、よろしければダウンロードしてお読みください。

ワードプレス導入編

	( 1 / 1 )