ランダムで画像を表示する
 
ともきちのみかんばたけTOPにもある訪問orりろーどするたびに画像が入れ替わる表示領域を作ります。
画像がランダムに入れ替わる表示の手法はいろいろとあり検索すればCGIやJavaスクリプトで記述するものを良く見ます。
ですがめんどくさがりなおいらは更新に手間をかけたくないので(Javaが良く分からなかったという説もあり…)
rotate.php を使わせていただきました。
おそらく一番手軽な方法はこれではないでしょうか?

rotate.php の作者の方はA List ApartDan Benjamin さん。サイトは英語です…
中学の英語のテストで100点満点中、奇跡の1桁点をたたき出したおいらには厳しすぎる試練です。
というわけでいろいろなサイトを参考にさせていただきました。
参考にさせていただいたサイトは最後に記載しておきます。
ともきちのつたない説明では分かりにくいかもしれませんので参考にして下さい。

それではともきちが設置した方法を説明します。

まずは自分のホームページを置かせてもらっているサーバで.phpが使用可能かどうかを確認します。
ともきちが使わせてもらっているFC2ではCGI・PHP・SSIが使えません…(レンタルサーバーを除く)
そこで今回は.phpが使用可能な@PAGES(アットページズ)の無料ホームページスペースを使わせてもらいました。

さくさくっと会員登録を済ませてTOPページ左側メニューの中の簡単FTPからログインします。
まずそこで新規ディレクトリを作成します。ともきちはrandomにしました。
で、ココでひとまず中断です。

次は、A List ApartRandom Image Rotationからrotate.phpを頂きましょう。
Random Image Rotationからページの下の方にYou can download the PHP source right hereとあります。
PHP source right hereをクリックするとテキストファイルが開きます。
これを保存するのですがともきちはデスクトップに新規テキストファイルを作って本文をコピーしました。
そしてその本文の中断辺りに
------------------------- CONFIGURATION -----------------------


      Set $folder to the full path to the location of your images.
      For example: $folder = '/user/me/example.com/images/';
      If the rotate.php file will be in the same folder as your
      images then you should leave it set to $folder = '.';

*/


      $folder = '.';

こう書かれた部分を見つけてください。
この赤字(実際は赤くないです)の部分にサーバーのフルパスを指定します。
@PAGES(アットページズ)の場合だとこうなります。
$folder = '/usr/local/www/htdocs/アカウントID/public_html/random/';
最後のrandomはフォルダ名ですので新規ディレクトリを作る時に違う名前で作った場合は変えてください。
ここのフルパスを間違えると画像を呼び出して来れません。
アットページズの場合だと同じように書けばOKだと思いますがその他のサーバはよく確認してください。
.phpが使えるサーバならどこかに記載してあるとは思いますが分からない場合は
サーバの管理者に聞いてください。

フルパスの指定が終わったらこのファイルに名前をつけて保存します。
ともきちと同じ手順でやった場合、新規テキスト ドキュメント.txtになっているのでこれを
rotate.phpに変えて保存してください。
で、こちらは終了です。

次は、先程中断していた簡単FTPに戻ります。
簡単FTPの画面から先程作った新規ディレクトリ randomをクリックしてフォルダに入ります。
そこからアップロードボタンをクリック、するとファイルを指定する窓が出るので参照から先程保存したrotate.phpを指定し、
緑のチェックマークを押して送信!
これでrotate.phpの設置は終わりです。
後はrotate.phpを設置したフォルダ(random)にランダムに表示させたい画像をアップロードします。

画像のアップロードはrotate.phpをアップロードしたのと同じなので端折って
ともきちが使っている画像サイズ縮小ソフトをご紹介。

作者:
Matsumoto KさんのDownsizeAll 
HPはこちら↓
http://hp.vector.co.jp/authors/VA020245/
フリーウェアで使い方も簡単!
インストール後に縮小したいファイルを選んで(複数可)右クリック
画像を縮小を選んでサイズなどを指定してやれば一括変換完了!
ソフト本体からデフォルトの変更も出来て本当に簡単です!

話がそれましたが、ランダム画像に戻ります。
画像ファイルのアップロードが終わったらあとは表示したいスペースからrotate.phpにアクセスしてやるだけです。
ともきちの場合index.htmlのテーブルに
<img src="http://アットページズで作ったHPのURL/random/rotate.php" />
こう設置しました。
rotate.phpへのアクセスは.phpに対応していないFC2でも大丈夫です。
これでrotate.phpにアクセスしたスペースにランダムで画像が表示されるようになったはずです。
ともきちは試していませんがrotate.phpへのアクセスはHTMLだけでなくCSSにも使えるようでいろいろと使い道がありそうです。

表示させたい画像が増えたらアットページズのrandomフォルダにアップロードするだけで
表示スペースのタグ記述を変更する必要が無いのでお手軽ですよ!

参考サイト
ロックフィッシュに燃えた!!
http://rkm.naturum.ne.jp/e698338.html

chocobit
http://chocobit.com/2007/03/19.php

有難うございます。

 TOP Pageへ
inserted by FC2 system