Photo Gallery from Server Folder

paul.maechler · Post by **paul.maechler** » Tue Mar 05, 2019 12:41 pm

Hi

I try to display a "Photo Collage", "Photo Gallery" or "Carousel" using pictures in the folder "gallery" on the server.

That does not work for me. Content is empty.

Extension is .php
Folder name : I tried "gallery" and "./gallery" whitout any success.
I do have about 15 Full HD .jpg files in this folders.

Also "block" with Carousel does not work at all.

PHP Version is 5.5.14 under Windows.

What can I do ?
Thanks
paul

Post by **Pablo** » Tue Mar 05, 2019 1:03 pm

Maybe the image extesions are uppercase? For example, JPG instead of jpg

What is the URL of the page?
What are your exact settings?
What is the generated code?

paul.maechler · Post by **paul.maechler** » Tue Mar 05, 2019 2:02 pm

Link to Testpage :

http://pau.li/g1.php
http://pau.li/g2.php

Files are all lowercase - e.g. 2-die-kulisse-zug-23.jpg

- - - - g1.php - - - -

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Page</title>
<meta name="generator" content="WYSIWYG Web Builder 9 - http://www.wysiwygwebbuilder.com">
<style type="text/css">
body
{
background-color: #FFFFFF;
color: #000000;
font-family: Arial;
font-weight: normal;
font-size: 13px;
line-height: 1.1875;
margin: 0;
padding: 0;
}
a
{
color: #F5F5F5;
text-decoration: none;
}
a:visited
{
color: #DCDCDC;
}
a:active
{
color: #C0C0C0;
}
a:hover
{
color: #D3D3D3;
text-decoration: underline;
}
input:focus, textarea:focus, select:focus
{
outline: none;
}
#wb_Text1
{
background-color: transparent;
background-image: none;
border: 0px solid #000000;
padding: 0;
margin: 0;
text-align: left;
}
#wb_Text1 div
{
text-align: left;
}
#PhotoCollage1
{
box-sizing: border-box;
font-size: 0;
width: 100%;
height: 100%;
table-layout: fixed;
display: table;
margin: 0;
position: relative;
}
#PhotoCollage1 .thumbnail img
{
border: 0px #000000 solid;
box-sizing: border-box;
}
#PhotoCollage1 .thumbnail
{
position: absolute;
}
#PhotoCollage1 .thumbnail img
{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
</style>
<script type="text/javascript" src="jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="jquery-ui.min.js"></script>
<script type="text/javascript" src="wb.photocollage.min.js"></script>
<link rel="stylesheet" href="prettyPhoto/css/prettyPhoto.css" type="text/css">
<script type="text/javascript" src="prettyPhoto/js/jquery.prettyPhoto.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("a[rel^='prettyPhoto_PhotoCollage1']").prettyPhoto({theme:'facebook',social_tools:false});
$("#PhotoCollage1").photocollage({ effect: 'scale', duration: 600, padding: 4, matrix: '1,1,1,1,1,4,0,0,0,1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1' });
});
</script>
</head>
<body>
<div id="wb_Text1" style="position:absolute;left:52px;top:16px;width:309px;height:27px;z-index:0;">
<span style="color:#000000;font-family:Arial;font-size:24px;">TEST TITLE</span></div>
<div id="wb_PhotoCollage1" style="position:absolute;left:42px;top:54px;width:677px;height:677px;z-index:1;">
<div id="PhotoCollage1">
<div class="thumbnails">
<?php
$images_folder = "./gallery/";
$html = "";
$images = array();
$dir = opendir($images_folder);
while ($filename = readdir($dir))
{
$ext = pathinfo($filename, PATHINFO_EXTENSION);
$ext = strtolower($ext);
if ($ext == 'gif' || $ext == 'jpeg' || $ext == 'jpg' || $ext == 'png')
{
$images[] = $filename;
}
}
closedir($dir);
sort($images);
$count = 0;
foreach($images as $filename)
{
$count++;
if ($count > 10)
break;
$exif = exif_read_data($images_folder.$filename);
$title = trim($exif['ImageDescription']);
$html .= "<div class=\"thumbnail\"><a href=\"$images_folder$filename\" data-rel=\"prettyPhoto_PhotoCollage1[PhotoCollage1]\" title=\"$title\"><img alt=\"$title\" id=\"PhotoCollage1_img$count\" src=\"$images_folder$filename\" title=\"$title\"></a></div>";
}
echo $html;
?>
</div>
</div></div>
</body>
</html>

Post by **Pablo** » Tue Mar 05, 2019 2:15 pm

I do not see any error in the code.
But why did you set the document type of the page to 'none'?

Also, the server does not completely process the page, so something does wrong at the server side.
Does the server generate any error in the PHP log?

BaconFries · Post by **BaconFries** » Tue Mar 05, 2019 2:18 pm

Files are all lowercase - e.g. 2-die-kulisse-zug-23.jpg

Please read the following were images should not start with a number or numbers.
https://www.wysiwygwebbuilder.com/forum ... 10&t=64868
Also note that version 9 of the software is no longer supported!..
<meta name="generator" content="WYSIWYG Web Builder 9 - http://www.wysiwygwebbuilder.com">

paul.maechler · Post by **paul.maechler** » Tue Mar 05, 2019 3:17 pm

We use 14.3.2. Don't know why there is v9 mentioned in code.

I did remove all "-" from file names.

Does not make any difference.

So I still need help.

Post by **Pablo** » Tue Mar 05, 2019 3:46 pm

I do not see any error in the code.
But why did you set the document type of the page to 'none'?

Also, the server does not completely process the page, so something does wrong at the server side.
Does the server generate any errors in the PHP log?

paul.maechler · Post by **paul.maechler** » Tue Mar 05, 2019 3:59 pm

No Errors at all.....

-------- LogFile -----------

#Software: Microsoft Internet Information Services 7.5
#Version: 1.0
#Date: 2019-03-05 15:56:57
#Fields: date time s-ip cs-method cs-uri-stem cs-uri-query s-port cs-username c-ip cs(User-Agent) sc-status sc-substatus sc-win32-status time-taken
2019-03-05 15:56:57 77.245.176.179 GET /g1.php - 80 - 77.245.176.161 Mozilla/5.0+(Windows+NT+10.0;+WOW64;+rv:65.0)+Gecko/20100101+Firefox/65.0 500 0 0 0
2019-03-05 15:56:57 77.245.176.179 GET /wb.photocollage.min.js - 80 - 77.245.176.161 Mozilla/5.0+(Windows+NT+10.0;+WOW64;+rv:65.0)+Gecko/20100101+Firefox/65.0 200 0 0 15
2019-03-05 15:56:57 77.245.176.179 GET /prettyPhoto/js/jquery.prettyPhoto.js - 80 - 77.245.176.161 Mozilla/5.0+(Windows+NT+10.0;+WOW64;+rv:65.0)+Gecko/20100101+Firefox/65.0 200 0 0 15
2019-03-05 15:56:57 77.245.176.179 GET /prettyPhoto/css/prettyPhoto.css - 80 - 77.245.176.161 Mozilla/5.0+(Windows+NT+10.0;+WOW64;+rv:65.0)+Gecko/20100101+Firefox/65.0 200 0 0 15
2019-03-05 15:56:57 77.245.176.179 GET /jquery-1.12.4.min.js - 80 - 77.245.176.161 Mozilla/5.0+(Windows+NT+10.0;+WOW64;+rv:65.0)+Gecko/20100101+Firefox/65.0 200 0 0 93
2019-03-05 15:56:57 77.245.176.179 GET /jquery-ui.min.js - 80 - 77.245.176.161 Mozilla/5.0+(Windows+NT+10.0;+WOW64;+rv:65.0)+Gecko/20100101+Firefox/65.0 200 0 0 124
2019-03-05 15:56:57 77.245.176.179 GET /favicon.ico - 80 - 77.245.176.161 Mozilla/5.0+(Windows+NT+10.0;+WOW64;+rv:65.0)+Gecko/20100101+Firefox/65.0 404 0 2 0

paul.maechler · Post by **paul.maechler** » Tue Mar 05, 2019 4:11 pm

After upgrading PHP to v7 it works like a charme.

Thanks for your assistance.

Paul

paul.maechler · Post by **paul.maechler** » Tue Mar 05, 2019 4:13 pm

Is there a carousel-style Gallery using a Folder as Source ?

Post by **Pablo** » Tue Mar 05, 2019 4:20 pm

Maybe the slideshow?

www.wysiwygwebbuilder.com

Photo Gallery from Server Folder

Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder

Re: Photo Gallery from Server Folder