PHP Photo Album Script V2.11 images not showing

**tanakaeka** · 05-01-2010, 11:55 AM

1) Script Title: PHP Photo Album Script V2.11

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ualdescription

3) Describe problem: Hi there, I'm trying to use this code to show the images in the folder called as 'products'. I also use XAMPP as the local PHP server. But the problem starts when the images won't show up from the folders. It can only show how many images are there, but the fields for the image are blank just like the image below:

These are the codes that I'm using to select the 'products' folder in my XAMPP directory:

Code:

<script type="text/javascript" src="products/getalbumpics.php?id=products"></script>

Is there anything I can do to fix it?

Thanks a lot in advance,
Tan.

**jscheuer1** · 05-01-2010, 03:26 PM

It isn't possible to be certain from what you've told us what the problem is. I think it might be that the images are "showing up", just that they aren't getting displayed on the page due to some layout issue(s).

This can be checked in a browser like Firefox using its developer extension and DOM inspector. There you can see if the images are there in the generated source code or not. And if so, whether or not the paths are correct.

You must be viewing the page on your localhost server, otherwise none of the PHP stuff will work, and it has to have all of the required functions enabled. You could also try viewing the products/getalbumpics.php?id=products page directly in Firefox via the localhost server to see if it contains the expected array of images, and if the baseurl path is correct there. It should look something like (but with your images and baseurl as well as your variable name):

Code:

var europe={
	baseurl: "http://www.dynamicdrive.com/dynamicindex4/phpgallery/set2/",
	images: [
		[0, "arc.jpg", "Aug 05, 2009 22:12:41"],
		[1, "castle.jpg", "Aug 05, 2009 22:12:42"],
		[2, "castle2.jpg", "Aug 05, 2009 22:12:43"],
		[3, "milkwagon.jpg", "Aug 05, 2009 22:12:44"],
		[4, "mountain.jpg", "Aug 05, 2009 22:12:45"],
		[5, "riverhouses.jpg", "Aug 05, 2009 22:12:46"],
		[6, "torbole.jpg", "Aug 05, 2009 22:12:47"],
		[7, "venice.jpg", "Aug 05, 2009 22:12:48"],
		[8, "windmill.jpg", "Aug 05, 2009 22:12:49"],
		["placeholder"]
	],
	desc: []
}

To really diagnose something like this I would need to see a live installation which exhibits the problem.

If you want more help, please put the page up live somewhere on a PHP enabled server and post a link to it.

**tanakaeka** · 05-02-2010, 02:03 PM

Hi John,

Thanks for replying.
I just checked my .php code and it looks just like what you said before:

Code:

var products={
	baseurl: "http://localhost/univ_prod/products/",
	images: [
		[0, "bro1.jpg", "Apr 18, 2010 12:57:39"],
		[1, "bro2.jpg", "Apr 18, 2010 13:18:22"],
		[2, "bro3.jpg", "Apr 18, 2010 13:25:11"],
		[3, "bro4.jpg", "Apr 18, 2010 13:22:51"],
		["placeholder"]
	],
	desc: []
}

Or is there anything wrong with the code in the main page?

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Cards</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<script type="text/javascript" src="products/getalbumpics.php?id=products"></script>
<script type="text/javascript">
//Optional, manual description for particular pictures inside album
//Syntax: albumid.desc[index]="Picture description here"
//eg: myvacation.desc[2]="This is description for the 3rd picture in the album"
//eg: myvacation.desc[6]="This is description for the 7th picture in the album"
</script>
<script type="text/javascript" src="ddphpalbum.js">
/***********************************************
* PHP Photo Album script v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>
<link rel="stylesheet" type="text/css" href="ddphpalbum.css" />
<link rel="stylesheet" type="text/css" href="menu/menu_style.css" />
</head>

<body>
<div id="Header" style="position:absolute; left:100px; top:0px; width:1080; height:140px; z-index:1">
<img src="heading.jpg" width="1080" height="140" />
</div>
<div id="Menu" style="position:absolute; left:100px; top:140px; width:1080px; height:45px; z-index:3">
<div class="nav-container-outer">
   <img src="menu/images/new3.jpg" alt="" class="float-left" />
   <img src="menu/images/new1.jpg" alt="" class="float-right" />
   <ul id="nav-container" class="nav-container">
      <li><a class="item-primary" href="" target="_self">About Us</a>
      </li>

       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="" target="_self">Products</a>
         <ul style="width:150px;">
            <li><a href="cards.html" title="Cards" target="_self" >Cards</a></li>
            <li><a href="flyers.html" title="Flyers" target="_self" >Flyers</a></li>
            <li><a href="magnets.html" title="Magnets" target="_self" >Magnets</a></li>
            <li><a href="hats.html" title="Hats" target="_self" >Hats</a></li>

            <li><a href="stationery.html" title="Stationery" target="_self" >Stationery</a></li>
         </ul>
      </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="" target="_self">Contact Us</a>
         <ul style="width:150px;">
            <li><a href="contactus.html" title="Contact Details" target="_self" >Contact Details</a></li>

            <li><a href="enquiry.html" title="Enquiry" target="_self" >Enquiry</a></li>
         </ul>
      </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="" target="_self">Login</a>
      </li>
       <li><span class="divider divider-vert" ></span></li>
      <li class="clear"> </li>

	</ul>
</div>
</div>
<div id="Body" style="position:absolute; left:100px; top:200px; width:1080px; height:500px; z-index:2"><img src="website_body1.jpg" width="1080" height="580"></div>
<div id="Content" style="position:absolute; left:160px; top:270px; width:600px; height:450px; z-index:2">
<script type="text/javascript">
new phpimagealbum({
	albumvar: products, //ID of photo album to display (based on getpics.php?id=xxx)
	dimensions: [3,2],
	sortby: ["file", "asc"], //["file" or "date", "asc" or "desc"]
	autodesc: "Photo %i", //Auto add a description beneath each picture? (use keyword %i for image position, %d for image date)
	showsourceorder: true, //Show source order of each picture? (helpful during set up stage)
	onphotoclick:function(thumbref, thumbindex, thumbfilename){
		thumbnailviewer.loadimage(thumbref.src, "fit2screen")
	}
})
</script>
<!-- NEED A SERVER TO TEST THIS --> <!-- NEED A SERVER TO TEST THIS --> <!-- NEED A SERVER TO TEST THIS -->
</div> 
</body>
</html>

I'll find an uploader for php just in case the problem isnt fixed yet.

With many thanks in advance,
Tan.

**jscheuer1** · 05-02-2010, 02:50 PM

I made a local mock up on my WAMP server, and the images are showing up on the page. But I don't have all of your styles, so I'm not sure what it would look like with them. Without the menu styles, there is some overlap. If some things have background color or background images, these could cover the images. I'm using the ddphpalbum.css unedited from the demo page. If you've edited your copy, there could be problems there.

But, it is probably just an issue with style/layout. Check to see if you can navigate directly to the images though, example:

Code:

http://localhost/univ_prod/products/bro1.jpg

As long as they all check out and you haven't edited the external script or styles, then it is something with the rest of the layout/styles.

I generally recommend against using so much absolute positioning on a page. It can work out, but often becomes unwieldy and can lead to unexpected results.

It would really be easiest to check this if you put it up live somewhere.

**tanakaeka** · 05-03-2010, 05:24 AM

Hi John,

I've tried to navigate to the page you suggested and the image was shown there. But I still couldnt get it work with the page.

I've also uploaded the file into a server and you get access it at

Code:

http://univprod.herobo.com/cards.html

but now in the cards.html, the page doesnt show anything at all, not even the source order of the images. I wonder what is going on.

the getalbumpics.php itself also can be accessed at

Code:

http://univprod.herobo.com/products/getalbumpics.php?id=products

I need your help to check it what is wrong. Thanks a lot in advance, John.

Regards,
Tan.

**govnah** · 05-03-2010, 11:26 AM

hi, i was trying to make a statement on this post but i must have clicked on the wrong thing and it posted a new post..

It got answered and i think you should check it out.. It might help solve your problem. It definately worked for me

http://www.dynamicdrive.com/forums/s...746#post225746

**tanakaeka** · 05-08-2010, 05:07 AM

Hi guys,

Sorry for late reply, was away for few days.

Thanks for the help from John and govnah, I will try it now.

Cheers,
Tanaka.

**tanakaeka** · 05-08-2010, 05:16 AM

Hi guys,

I just tried it (the album.zip from John) and had the same problem with before. I've put 6 images with different description to each other, but the only thing that appears is the description and the image border. The content is blank like before.
The only thing I did is just putting 6 images. I didn't edit anything at all.

Any other suggestion for this?

Thanks in advance,
Tan.

**jscheuer1** · 05-08-2010, 09:31 AM

I just looked at your live demo, its getalbumpics.php looks like so:

Code:

var products={
	baseurl: "http://univprod.herobo.com/products/",
	images: [
		[0, "bro2.jpg", "May 03, 2010 01:05:04"],
		[1, "bro3.jpg", "May 03, 2010 01:05:04"],
		[2, "bro1.jpg", "May 03, 2010 01:05:03"],
		[3, "bro4.jpg", "May 03, 2010 01:05:04"],
		["placeholder"]
	],
	desc: []
}
 

<!-- www.000webhost.com Analytics Code -->
<script type="text/javascript" src="http://analytics.hosting24.com/count.php"></script>
<noscript><a href="http://www.hosting24.com/"><img src="http://analytics.hosting24.com/count.php" alt="web hosting" /></a></noscript>
<!-- End Of Analytics Code -->

That highlighted bit (presumably added automatically by the server) at the end breaks the whole thing. This can be fixed by adding die(); at the end of getalbumpics.php:

Code:

echo "	desc: []\n";
echo "}\n";
die();
?>

**tanakaeka** · 05-10-2010, 06:01 AM

Hi John,

I've just tried it and it works in the live site only, not in the XAMPP. Maybe there is some compatibility issue with XAMPP that make this doesn't work. Anyway, thanks a lot for helping.

Cheers and regards,
Tan.