画像をアップするだけで自動で反映されます。これでギャラリーサイトの更新が一気に楽になりますね。
基本のコード
<?php
$images = glob('フォルダ名/*jpg');
foreach($images as $v) {
echo '<img src="' . $v . '" alt="" loading="lazy">';
}
?>
応用編|追加順&CSSで縦横比を揃える
並べ替えをするには連番が必要です。
gallery01.jpg, gallery02.jpg…といった具合に。
<?php
$images = array_reverse(glob('フォルダ名/*jpg'));
foreach($images as $v) {
echo '<img src="' . $v . '" alt="" loading="lazy">';
}
?>
縦横比を揃えるためのCSS
img {
object-fit: cover;
aspect-ratio: 3 / 2;
}
※array_reverse|逆順(数字の大きい順)に並べ替える
※aspect-ratio|横 / 縦で自由に設定可
更新情報
- 2024.09.26|CSSコード修正、参考リンク追加
コメント欄