Question

I wanted to ask how can I populate an HTML list with Images located in a folder automatically?

lets say I have 4 pages with 4 different lists.
lets say the lists are as follows: Cars, Motorcycles, Airplanes, Ships
each list entry has a src as a thumbnail and a href as a link to full size image.
my folder contain images with specific titles:
C=Cars
M=Motorcycles
A=Airplanes
S=Ships

then I have a serial number

and the ending is either
T=Thumbnail
F=Full Image

so a complete file name would be C20T.jpg or C20F.jpg.

I am looking for a script that will update the 4 lists according to their subject and populate them automatically with related file names.

from my search here I have found this piece of code but I believe it needs some tweaking and I am not sure how to do this 🙁

$dir    = '/images';
$files = scandir($dir);
$images = array();
foreach($files as $file) {
  if(fnmatch('*.jpg',$file)) {
    $images[] = $file;
  }
}

foreach($images as $image) {
  echo '<img src="images/'.$image.'" />';
}

I hope someone could help me with this!

Thank you for your time reading this.

Answer 1

$type = 'c';

$imagesDir = 'images/';

$images = glob($imagesDir . $type . '*[TYPE].{jpg,jpeg,png,gif}', GLOB_BRACE);

This should get all your full images.

Making a ul is then pretty easy…

<ul>
<?php foreach($images as $image): ?>
   <li><a href="<?php echo str_replace('[TYPE]', 'F', $image); ?>"><img src="<?php echo str_replace('[TYPE]', 'T', $image); ?></a>" alt="" /></li>
<?php endforeach; ?>
</ul>