Adding an image Gallery Using Lightbox

Hi,

Just to clarify, are you trying to allow someone to upload images to CMS Builder from a news page? Or are you trying to display uploaded images using Lightbox?

Let me know and attach any .php pages you're using for this and I'll take a look.

thanks.

Jason,

I dont want anyone to upload anything to my site. I am trying to just make the imaged in my news section and in a section I am going to make for project history enlarge when they are clicked on with the effect that you get from lightbox. I tried following the instructions I saw here http://www.interactivetools.com/news/issue0073.php#2 that Donna wrote and some other stuff I found on other threads but I guess I am just not that savvy yet with php and CMSB. The news sections is here: http://www.anfgroup.com/news/news.php I have not added any pictures yet and the other section(s) I want to make is the following: http://www.anfgroup.com/completed/healthcare.php

Hi,

Okay, first thing, you'll need to add some pictures to your news section.

Once you've done that, just get the images to display on your page (The code generator will help you with this).

After that, try the instruction found on the lightbox website (http://www.huddletogether.com/projects/lightbox2/).

If you run into any issues, just let me know and attach the .php file you're working with to the post.

Hope this helps.

Hi RapidWeb

Typically, what I do is create a folder structure which looks like this:

/js {this is where I place all my javascript files}
/css {this is where I place all my stylesheets}
/images {this is where I place images used in the web layout}
/includes {this is where I place all my include files}

Using the above structure, download Lightbox2, expand it and upload all the files in the /css folder to the equivalent on your website. Do the same for /js and /images.

Then follow the Lightbox instructions (How to Use). Just make sure you are pointing to the correct file locations in your code.

Have fun!

Thanks for your quick reply! Please note, that I had purchased your book about a year ago.

I followed your instructions. I am getting an error. But first, here is my code:

<div align="center">
<?php foreach (getUploads($options['tableName'], 'images', $record['num']) as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<a href="<?php echo $upload['urlPath'] ?>" rel="lightbox[Homepage]" title="<?php echo $upload['info1'] ?>">
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight']?>" />
</a>
<?php elseif ($upload['isImage']): ?>
<a href="<?php echo $upload['urlPath'] ?>" rel="lightbox[Homepage]" title="<?php echo $upload['info1'] ?>">
<img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" />
</a>
<?php else: ?>
<a href="<?php echo $upload['urlPath'] ?>">Download <?php echo $upload['filename'] ?></a>
<?php endif ?>
<?php endforeach ?>
</div>



My talbe name is: hotels
the name of the images field is images
This is my page:

http://www.koshertravelinfo.com/kosher-hotels/kosher-hotel.php?1

This is the error: Notice: Undefined variable: options in /kosher-hotels/kosher-hotel.php on line 118 Notice: Undefined variable: record in /kosher-hotels/kosher-hotel.php on line 118 getuploads: no 'tableName' value specified!

I have uploaded Lightbox2 and here is the test page on my site:

http://www.koshertravelinfo.com/index1.html

As you can see, the test works fine.

Hi RapidWeb

BTW, its not my book, its Gerry Kornbluth.

Can you attach your file here. I need to see the whole thing.

Thx.

Thanks for your kind help. I can't attach the entire file because
it is done in a Wysiwyg program that creates the file upon
publishing (Xsite Pro). But here is what is in the file:

Here is what is in the header:
<?php


// load viewer library
$libraryPath = 'cmsAdmin/lib/viewer_functions.php';
$dirsToCheck = array('//','','../','../../','../../../');
foreach ($dirsToCheck as $dir) { if (@include_once("$dir$libraryPath")) { break; }}
if (!function_exists('getRecords')) { die("Couldn't load viewer library, check filepath in sourcecode."); }

// load records
list($hotelsRecords, $hotelsMetaData) = getRecords(array(
'tableName' => 'hotels',
'where' => whereRecordNumberInUrl(1),
'limit' => '1',
));
$hotelsRecord = @$hotelsRecords[0]; // get first record

// show error message if no matching record is found
if (!$hotelsRecord) { dieWith404("Record not found!"); }

?>

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

And here is what makes up the page:


<p>Already included some header&nbsp;code. Change&nbsp;the&nbsp;code form Minyan to Hotel&nbsp;</p>

<p>&nbsp;</p><nodesigner>



<!-- STEP2: Display Records (Paste this where you want your records to be listed) -->
<h1>Hotels - Detail Page Viewer</h1>
Record Number: <?php echo $hotelsRecord['num'] ?><br/>
Name: <?php echo $hotelsRecord['name'] ?><br/>
Address: <?php echo $hotelsRecord['address'] ?><br/>
Address2: <?php echo $hotelsRecord['address2'] ?><br/>
City: <?php echo $hotelsRecord['city'] ?><br/>
State or Province: <?php echo $hotelsRecord['state'] ?><br/>
Zip: <?php echo $hotelsRecord['zip'] ?><br/>
Country: <?php echo $hotelsRecord['country'] ?><br/>
Phone: <?php echo $hotelsRecord['phone'] ?><br/>
Web Site: <?php echo $hotelsRecord['web_site'] ?><br/>
Email: <?php echo $hotelsRecord['email'] ?><br/>
Establishment: <?php echo join(', ', getListLabels('hotels', 'establishment', $hotelsRecord['establishment'])); ?><br/>
Terms (Check in time, cancellation fees, etc.): <?php echo $hotelsRecord['terms'] ?><br/>
Kosher Info (e.g. Glatt, Cholov Yisrael, etc.): <?php echo $hotelsRecord['kosher_info'] ?><br/>
Hashgacha / Supervision: <?php echo $hotelsRecord['hashgacha_supervision'] ?><br/>
AAA Discount : <?php echo $hotelsRecord['aaa_discount'] ?><br/>
Credit Cards Accepted: <?php echo $hotelsRecord['credit_cards'] ?><br/>
Parking: <?php echo $hotelsRecord['parking'] ?><br/>
Member Services: <?php echo join(', ', getListLabels('hotels', 'member_services', $hotelsRecord['member_services'])); ?><br/>
Leisure Activities: <?php echo join(', ', getListLabels('hotels', 'leisure_activities', $hotelsRecord['leisure_activities'])); ?><br/>
In-Room Amenities: <?php echo join(', ', getListLabels('hotels', 'in_room_amenities', $hotelsRecord['in_room_amenities'])); ?><br/>
Short Description: <?php echo $hotelsRecord['short_description'] ?><br/>
Hotel Information: <?php echo $hotelsRecord['hotel_information'] ?><br/>
_link : <a href="<?php echo $hotelsRecord['_link'] ?>"><?php echo $hotelsRecord['_link'] ?></a><br/>
</nodesigner> <nodesigner>







<div align="center">
<?php foreach (getUploads($options['tableName'], 'images', $record['num']) as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<a href="<?php echo $upload['urlPath'] ?>" rel="lightbox[Homepage]" title="<?php echo $upload['info1'] ?>">
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight']?>" />
</a>

<?php elseif ($upload['isImage']): ?>
<a href="<?php echo $upload['urlPath'] ?>" rel="lightbox[Homepage]" title="<?php echo $upload['info1'] ?>">
<img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" />
</a>

<?php else: ?>
<a href="<?php echo $upload['urlPath'] ?>">Download <?php echo $upload['filename'] ?></a>

<?php endif ?>
<?php endforeach ?>
</div>
</nodesigner> <nodesigner>
<a href="<?php echo $hotelsMetaData['_listPage']; ?>">&lt;&lt; Back to list page</a> -
<a href="mailto:?subject=<?php echo urlencode(thisPageUrl()) ?>">Email this Page</a>
</nodesigner>

<p>&nbsp;</p>

The nodesigner tag is just to let Xsite Pro (the program I use for the web layout, kind off Dreamweaver) know that
this is code and not try to add any design to it.

Your help is greatly apreciated!

I highlighted in red below the change you should make. Try this first and lets see where it leads.

Thanks for your kind help. I can't attach the entire file because
it is done in a Wysiwyg program that creates the file upon
publishing (Xsite Pro). But here is what is in the file:

Here is what is in the header:
<?php


// load viewer library
$libraryPath = 'cmsAdmin/lib/viewer_functions.php';
$dirsToCheck = array('//','','../','../../','../../../');
foreach ($dirsToCheck as $dir) { if (@include_once("$dir$libraryPath")) { break; }}
if (!function_exists('getRecords')) { die("Couldn't load viewer library, check filepath in sourcecode."); }

// load records
list($hotelsRecords, $hotelsMetaData) = getRecords(array(
'tableName' => 'hotels',
'where' => whereRecordNumberInUrl(1),
'limit' => '1',
));
$hotelsRecord = @$hotelsRecords[0]; // get first record

// show error message if no matching record is found
if (!$hotelsRecord) { dieWith404("Record not found!"); }

?>

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

And here is what makes up the page:


<p>Already included some header&nbsp;code. Change&nbsp;the&nbsp;code form Minyan to Hotel&nbsp;</p>

<p>&nbsp;</p><nodesigner>



<!-- STEP2: Display Records (Paste this where you want your records to be listed) -->
<h1>Hotels - Detail Page Viewer</h1>
Record Number: <?php echo $hotelsRecord['num'] ?><br/>
Name: <?php echo $hotelsRecord['name'] ?><br/>
Address: <?php echo $hotelsRecord['address'] ?><br/>
Address2: <?php echo $hotelsRecord['address2'] ?><br/>
City: <?php echo $hotelsRecord['city'] ?><br/>
State or Province: <?php echo $hotelsRecord['state'] ?><br/>
Zip: <?php echo $hotelsRecord['zip'] ?><br/>
Country: <?php echo $hotelsRecord['country'] ?><br/>
Phone: <?php echo $hotelsRecord['phone'] ?><br/>
Web Site: <?php echo $hotelsRecord['web_site'] ?><br/>
Email: <?php echo $hotelsRecord['email'] ?><br/>
Establishment: <?php echo join(', ', getListLabels('hotels', 'establishment', $hotelsRecord['establishment'])); ?><br/>
Terms (Check in time, cancellation fees, etc.): <?php echo $hotelsRecord['terms'] ?><br/>
Kosher Info (e.g. Glatt, Cholov Yisrael, etc.): <?php echo $hotelsRecord['kosher_info'] ?><br/>
Hashgacha / Supervision: <?php echo $hotelsRecord['hashgacha_supervision'] ?><br/>
AAA Discount : <?php echo $hotelsRecord['aaa_discount'] ?><br/>
Credit Cards Accepted: <?php echo $hotelsRecord['credit_cards'] ?><br/>
Parking: <?php echo $hotelsRecord['parking'] ?><br/>
Member Services: <?php echo join(', ', getListLabels('hotels', 'member_services', $hotelsRecord['member_services'])); ?><br/>
Leisure Activities: <?php echo join(', ', getListLabels('hotels', 'leisure_activities', $hotelsRecord['leisure_activities'])); ?><br/>
In-Room Amenities: <?php echo join(', ', getListLabels('hotels', 'in_room_amenities', $hotelsRecord['in_room_amenities'])); ?><br/>
Short Description: <?php echo $hotelsRecord['short_description'] ?><br/>
Hotel Information: <?php echo $hotelsRecord['hotel_information'] ?><br/>
_link : <a href="<?php echo $hotelsRecord['_link'] ?>"><?php echo $hotelsRecord['_link'] ?></a><br/>
</nodesigner> <nodesigner>







<div align="center">
<?php foreach (getUploads($options['hotels'], 'images', $record['num']) as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<a href="<?php echo $upload['urlPath'] ?>" rel="lightbox[Homepage]" title="<?php echo $upload['info1'] ?>">
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight']?>" />
</a>

<?php elseif ($upload['isImage']): ?>
<a href="<?php echo $upload['urlPath'] ?>" rel="lightbox[Homepage]" title="<?php echo $upload['info1'] ?>">
<img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" />
</a>

<?php else: ?>
<a href="<?php echo $upload['urlPath'] ?>">Download <?php echo $upload['filename'] ?></a>

<?php endif ?>
<?php endforeach ?>
</div>
</nodesigner> <nodesigner>
<a href="<?php echo $hotelsMetaData['_listPage']; ?>">&lt;&lt; Back to list page</a> -
<a href="mailto:?subject=<?php echo urlencode(thisPageUrl()) ?>">Email this Page</a>
</nodesigner>

<p>&nbsp;</p>

The nodesigner tag is just to let Xsite Pro (the program I use for the web layout, kind off Dreamweaver) know that
this is code and not try to add any design to it.

Your help is greatly apreciated!