Pulling all the images from a directory

Question

I've looked at Pull all images from a specified directory and then display them and Pull all images from a specified directory and then display them. It seems like the solution that they provide on these posts are pretty straightforward. So I tried using the code but instead of an image, I get a string of the name of the image. And there are more than just one image in my uploads folder, but it only shows the name of one image.

Just to give some context, in one folder, I have my index.html, upload.php and a directory called uploads, where all my images are stored.

Here is the code that I have:

<body>   
    <div>
        <a class="info" id="hvr-float" id="thePeopleButton" p style="font-size:30px" href="javascript:void(0);">The People</a>
        <h1 class="infoText" style="display:none"></h1>
        <?php

        $directory = "uploads/";
        $images = glob($directory."*.jpg");

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

        ?>
    </div>
</body>

I would like the code to display image instead of just text. Here is a picture of what is happening on my website:

So, instead of uploads/awesome-fruit.jpg, I would like the actual image there. Any suggestions?

Are you getting any errors? - Have you tried to inspect the "text/ image" and see if the syntax has gone willy wonka? — Epodax, Oct 15 '15 at 09:42
I feel some where error is there which is breaking the html tags. — Niranjan N Raju, Oct 15 '15 at 09:45
I'm not sure how to check errors... I'm super noob... btw... — Jae Kim, Oct 15 '15 at 09:49
I think the tags seem pretty good. I don't think there are any problems there... — Jae Kim, Oct 15 '15 at 09:49
right click on "uploads/awesome-fruit.jpg" on broswer and select "inspect element" in chrome. Copy paste the URL in another tab having your domain as the URL like http://some.com/uploads/awesome-fruit.jpg. If it shows image then simply add a slash like "/uploads/awesome-fruit.jpg" else try to modify the path in address bar till you see the image and then use that path in the code. — Ashish Choudhary, Oct 15 '15 at 09:57
Your code runs fine for me. Are you able to show images on a plain HTML file? Could be a server issue or a browser setting — Nick Hargreaves, Oct 15 '15 at 09:59

Thaillie · Answer 1 · 2015-10-15T09:59:49.527

1

In order for the img element to display the image it needs its source relative from the root url (or not), so uploads/awesome-fruit.jpg should be /uploads/awesome-fruit.jpg.

And for the glob i would recommend using {jpg,gif,png}

$directory = "uploads/";
$images = glob($directory."*.{jpg,gif,png}", GLOB_BRACE);

info source

edited Oct 15 '15 at 09:59

answered Oct 15 '15 at 09:48

Thaillie

1,362
3
17
31

score 1 · Answer 2 · answered Oct 15 '15 at 10:14

Few days back I was playing with the same thing. The issue here is the file route.

For example I have some images on my desktop (I am using Ubuntu)

 $directory = "/home/Desktop/";

If I run the code

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

    ?>

I won't be getting the images because if you load the same image in the browser the link is of the type file:///home/Desktop/a.jpeg and not just /home/Desktop/a.jpeg.

Just try using the same pattern and you will get the desired output.

Corrected Code

<?php


    $directory = "/home/likewise-open/PUNESEZ/anurag.verma/Desktop/";   
    $images = glob($directory."*.jpeg");
    foreach($images as $image)
    {
// look at the addition of file://
    echo '<img src="file://'.$image.'" /><br />';
    }

    ?>

Quick note: using `file://` will only work in local files. It wont work on a hosted website. — Thaillie, Oct 15 '15 at 10:17

Shafiqul Islam · Answer 3 · 2017-05-26T10:55:25.743

You can display all image from a folder using simple php script. Suppose folder name “uploads” and put some image in this folder then you a editor and paste this code and run this script. This is php code

if you do not check type then just use this code which get all image from your folder and will show

<?php
$files = glob("uploads/*.*");
for ($i = 0; $i < count($files); $i++) {
    $image = $files[$i];
    echo basename($image) . "<br />"; // show only image name if you want to show full path then use this code // echo $image."<br />";
    echo '<img src="' . $image . '" alt="Random image" />' . "<br /><br />";

}
?>

and if you want to check that only image type will show if your folder have docs, pdf type document then use this code also

<?php
 $files = glob("uploads/*.*");
 for ($i=0; $i<count($files); $i++)
  {
   $image = $files[$i];
   $supported_file = array(
         'gif',
         'jpg',
         'jpeg',
         'png'
     );

    $ext = strtolower(pathinfo($image, PATHINFO_EXTENSION));
    if (in_array($ext, $supported_file)) {
       echo $image ."<br />";
       echo '<img src="'.$image .'" alt="Random image" />'."<br /><br />";
       } else {
         continue;
        }
      }
   ?>

hope it will help you

score 0 · Answer 4 · answered Apr 21 '18 at 04:42

There code is index or upload file? because if it's the index.html you have to change the extension to index.php

so you can try this code instead of you php code...

<?php
foreach (new DirectoryIterator("uploads/") as $file) {
    if($file->getExtension() == "jpg"){
        echo "<img src='uploads/{$file->getFilename()}'/>\n";
    }
}
?>

Pulling all the images from a directory

4 Answers4