シンプルな画像ギャラリーサイトの作り方[PHP]

トップページ。画像一覧を表示させるページ。

<?php
$f = fopen("data.csv","r");
while($line = fgetcsv($f)){
echo <<< eof
<a href="prev.php?id={$line[0]}"><img src="images/{$line[0]}.jpg" title="{$line[1]}"></a>
eof;
}
fclose($f);
?>

while($line = fgetcsv($f)){
}

これでカンマ区切りのデータを1行ずつ読み込んで配列に変換してくれる。最終行まで自動で読込み、読み込む行がなくなったら終了。

続いて画像表示ページ。

<?php
$flg = "2";
$id = intval($_GET["id"]);
$f = fopen("data.csv","r");

while($line = fgetcsv($f)){
    $data[] = $line;
    if($line[0] == $id){
        $flg = "1";
        $title = $line[1];
        $number = $line[0];
        $number_prev = intval($number - 1);
        $number_next = intval($number + 1);
    }
}

$data = array_reverse($data);
$title_prev = $data[$number_prev -1][1];
$title_next = $data[$number_next -1][1];

fclose($f);
?>

<?php include("header.php");?>

<title><?php echo $title;?> - サイトタイトル</title>    

<?php include("header2.php");?>

<?php
if($flg == "1"){
echo <<< eof
<h2>{$title}</h2>
<a href="images/{$number}.jpg"><img src="images/{$number}.jpg" title="{$title}"></a>
<br>
<br>
eof;
}
?>

<div>

<?php
//画像ファイルが存在したら前後へのリンクを表示
if(file_exists("images/{$number_prev}.jpg")){
echo <<< eof
<a href="prev.php?id={$number_prev}">◀ {$title_prev}</a>
<br>
<br>
eof;
}

//画像ファイルが存在したら前後へのリンクを表示
if(file_exists("images/{$number_next}.jpg")){
echo <<< eof
<a href="prev.php?id={$number_next}">{$title_next} ▶</a>
<br>
<br>
eof;                
}
?>

</div>

<?php
include("footer.php");
?>

1画像について1ページで表示させる。
次ページ、前ページなどページ送り機能もつけている。

while($line = fgetcsv($f)){ }

これだと1行ずつ読み込んで変数に入れて処理するから、1行前と後のデータが何だったのか残らない。 なのでわざわざ$data[] = $lineで配列に入れている。

そしてarray_reverseで逆順にして前後のタイトルを取得する。

続いてカンマ区切りのデータファイル。

5,ページタイトル
4,ページタイトル
3,ページタイトル
2,ページタイトル
1,ページタイトル

1番目にid、2番目にタイトルをつけている。
imagesフォルダを用意して画像をアップロードする。
画像のファイル名は、

3.jpg
2.jpg
1.jpg

のように数字で連番でつける。
data.csvのタイトルと一致するように。

これで画像ギャラリーサイトの出来上がり。

画像をサイトに追加したいとき

imagesフォルダに連番で名付けた画像をアップロードする
data.csvを更新する

コメント

タイトルとURLをコピーしました