最近アイコンの素材サイトを作りまして、その際にディレクトリ内のsvgとpngファイルを全部表示させる的なことをPHPで書いたので解説。
完成コード
完成コードはこんな感じ
php
<?php
function iconlist($directory)
{
$file = glob($directory . '*.svg');
foreach ($file as $path) {
$path_png = $path;
$path_png = str_replace('.svg', '.png', $path_png);
echo '
<li>
<img src="' . $path . '">
<img src="' . $path_png . '">
</li>
';
}
}
?>
<ul>
<?php iconlist('icon/group_1/'); ?>
<?php iconlist('icon/group_2/'); ?>
<?php iconlist('icon/group_3/'); ?>
</ul>
ディレクトリの構成
構成はこんな感じ。
icon
の中にアイコンの種類別ディレクトリを作っています。
icon/
├ group_1/
├ aaa.svg
├ aaa.png
├ bbb.svg
├ bbb.png
├ ...
├ group_2/
├ ...
├ ...
├ group_3/
├ ...
├ ...
解説
glob関数
glob関数はパターンにマッチしたパス名を探す関数です。
「*」や「?」を使用してディレクトリ内のファイルの一覧を取得します。
これで指定したディレクトリ内の全ての.svg
を取得します。
php
$file = glob($directory . '*.svg');
str_replace関数
str_replace関数は指定した文字列を他の文字列に置き換えるときに使用する関数です。
これで.svg
から.png
に置換させます。
php
str_replace('.svg', '.png', $path_png)
foreachで表示
foreachでディレクトリの中にある.svg
の数だけ繰り返し処理をしています。
php
foreach ($file as $path) {
}
まとめ
webサイトでよく見るスライダーとかは画像をたくさん表示させる必要があるので、この方法でやると効率的かと思います。