DCI3 :: First PHP! :: code10

In this tutorial you will run PHP code to display all images from a folder using scandir() function also you will use the foreach sentence in PHP.

  1. Get the images from my Dropbox. Is a ZIP with 102 little images. I used an online tool to get shortened URL to download the ZIP (https://tinyurl.com). The URL to download is: http://tinyurl.com/oerx46f and the file is img.zip.
  2. Create the folder structure:
  • code10/
  • code10/index.php
  • code10/images/

3. Uncompress the 102 jpg’s in the images/ folder. You need to move them from img/ original folder.

4. Copy the next PHP-HTML code to your index.php file:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Lectura de archivos usando PHP!</title>
<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

</head>
<body>
<?php
echo "<h1>Lectura de archivos usando PHP!<h1>";
$dir = "images/";
$routes = scandir($dir);

foreach($routes as $route) {
if ($route != "." && $route != "..") {
echo $dir . $route . "<br>";
$imagePath = $dir . $route;
echo "<img src='" . $imagePath . "'><br>";
}
}
?>
</body>
</html>

5. Upload your folder code10/* to you server that can process PHP files (https://cpanel.byethost.com/). Remember put that folder with it’s contents in codes/ directory.

6. Test your code in your domain, for example: http://www.abelworld.byethost4.com/codes/code10