Using the GLOB function in PHP you can put all of the file names on a folder, and then print them out with additional HTML to create a Dynamic Photo Stream.
In this project the PHP script will read what files are in a folder, and then print them out in IMG tags with additional CSS styling.
Prerequisites:
- Basic LAMP, or Web Server Administration
- Verify pictures and folder have READ permission for OTHER
- Basic PHP
- Basic HTML
- Basic CSS
Glob() Function:
- https://www.php.net/manual/en/function.glob.php
- https://www.w3schools.com/php/func_filesystem_glob.asp
LAMP Server
- Create a “pics” directory in the Public Web Directory (/var/www/html)
- Verify pictures and folder have at least a – – r permission.
index.php
<html>
<head>
<link rel='stylesheet' href='picStyle.css' />
</head>
<body>
<?php
$filelist = glob("./pics/*");
foreach($filelist as $filename){
echo "<div><img src='".$filename."'></div><br>";
}
?>
</body>
</html>
picStyle.css
img {
display: block;
width: 50%;
height: auto;
margin-left: auto;
margin-right: auto;
}
div {
background: lightgrey;
}
div:nth-of-type(even) {
background: grey;
}
Just curious, what tools/technologies did you use to build elithecomputerguy.com ? Did you use Bootstrap or just vanilla HTML and CSS?