As a web developer I always store images in database. And when I need to show them I just simple query to the database get all images and display them in html by using PHP loop.
But sometime it is not required saving images in database. You just need to show images from folder. So in this tutorial I am going to show you how to display images from folder in PHP.
Display Images from folder in PHP:
Below images are fetched from the images folder and display in inline-view.
If you want to add zoom effect on image hover then also read: jQuery Zoom Image on Hover
PHP Code:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<?php $imagesDirectory = "images/"; if(is_dir($imagesDirectory)) { $opendirectory = opendir($imagesDirectory); while (($image = readdir($opendirectory)) !== false) { if(($image == '.') || ($image == '..')) { continue; } $imgFileType = pathinfo($image,PATHINFO_EXTENSION); if(($imgFileType == 'jpg') || ($imgFileType == 'png')) { echo "<img src='images/".$image."' width='200'> "; } } closedir($opendirectory); } ?> |
Also Read: How to upload multiple images in PHP and store in Mysql
More from WDB24.com
Codeigniter Form Validation Tutorial Example – with error message and callback
How to Install Composer on Windows 10- How to create registration form in Codeigniter
PHP Remove File from Folder and Database
Create CSV file using PHP and save into directory
Configure Virtual Host for Laravel in XAMPP- How to use PHP password_hash in Registration and Login form
How to install GIT on Windows 10
why after I run it, there is no image display
Please download attached code and then check in localhost. If you are copying pasting above code then you need to create an images folder in root directory and add some images into images folder and then check.
If you will face any problem feel free to contact me.
I copy and paste it. but i change the directory. the image still not appear. but if i run your code. the image will appear
If you are using custom image directory then please change directory name in line no. 3 and line no. 20 in the above code. Other wise paste the code here then I will check and guide you accordingly.
<?php
$imagesDirectory = "C:/xampp/htdocs/login/webcamImage";
if (is_dir($imagesDirectory))
{
$opendirectory = opendir($imagesDirectory);
while (($image = readdir($opendirectory)) !== false)
{
if(($image == '.') || ($image == '..'))
{
continue;
}
$imgFileType = pathinfo($image,PATHINFO_EXTENSION);
if(($imgFileType == 'jpg') || ($imgFileType == 'png'))
{
echo " “;
}
}
closedir($opendirectory);
}
?>
i want to use image that i had capture using webcam
<?php
$imagesDirectory = "C:/xampp/htdocs/login/webcamImage";
if (is_dir($imagesDirectory))
{
$opendirectory = opendir($imagesDirectory);
while (($image = readdir($opendirectory)) !== false)
{
if(($image == '.') || ($image == '..'))
{
continue;
}
$imgFileType = pathinfo($image,PATHINFO_EXTENSION);
if(($imgFileType == 'jpg') || ($imgFileType == 'png'))
{
echo " “;
}
}
closedir($opendirectory);
}
?>
What is the format of your images? Above code only works with jgp and png file. If you want to add more extension image then add condition in line 18.
it is in jpeg
use
if(($imgFileType == ‘jpg’) || ($imgFileType == ‘png’) || ($imgFileType == ‘jpeg’) );
condition in line no. 18
still cannot display image
can you attach any image from images folder? so i can check and adjust condition accordingly.
https://uploads.disquscdn.com/images/50880ef841a073834e6bad25e9b9501831e6c20bce97ea7623d2dd6088d9bffb.jpg
this image i snap first and then it will save the name of this image in database. then the image will save in folder which located in htdocs (xampp)
Attached image format is jpg and above code should work. What is the path of folder where images are saved?
C:xampphtdocsloginwebcamImage
https://uploads.disquscdn.com/images/2ccf1c46b5a19288649404e7b79178b218cc1cd502dc6c5eea61f16d277059ab.jpg
this is the output after i run it
Try below code,
$imagesDirectory = “webcamImage/”;
if(is_dir($imagesDirectory))
{
$opendirectory = opendir($imagesDirectory);
while (($image = readdir($opendirectory)) !== false)
{
if(($image == ‘.’) || ($image == ‘..’))
{
continue;
}
$imgFileType = pathinfo($image,PATHINFO_EXTENSION);
if(($imgFileType == ‘jpg’) || ($imgFileType == ‘png’))
{
echo ” “;
}
}
closedir($opendirectory);
}
Open Inspect Element and check the image path.
it’s still did not work
still same.
Please check source of the images and set path. Code is working fine. There is only problem with image source. If you again face the problem. Send me the complete code in zip file
i done email to disquss.
I had sent the zip file through disqus email
jpg only no png
i’m sorry to ask how i can give you the code, because it’s only can send image only
how, where to add: else {echo “there are no images in folder”;}