PDA

View Full Version : Help w/ lightbox v. 2.04a for a major dumb newb :/



kundavega
02-01-2010, 01:40 AM
1) Script Title: Lightbox JS v2.04

2) Script URL (on DD): http://home.comcast.net/~jscheuer1/side/lightbox2.04a/

3) Describe problem: I realize the above is not from this website, but it was a link given to another poster here awhile ago from this post - http://www.dynamicdrive.com/forums/showthread.php?t=50238

My problem is that I am very green to this whole website/script thing and I am really confused trying to make this thing work on my website. I am wondering what I am supposed to do with what is in the folder I download. Do I upload it to my webhosting site? And if so, how do I do that? In what folders do I put it? Because right now when testing it out, the lightbox does not come up. The link goes to another page altogether and it is so frustrating because I think I am pasting everything into the right place. So I need a serious dummies version if anyone would care to help me out. I would SO very much appreciate it.

Oh here is what I have in terms of where I placed the script on my html document -

<html>

<head>

<body bgcolor = "000000" text = "cccccc">

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

<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>


</head>

<a href="images/younggirl.jpg" rel="lightbox" title="young girl">young girl</a>

</html>

I mean do I have to create a new directory for the images I want on that page? Anyway, thanks to whomever decides to take me on! haha!

xo Rachel

bluewalrus
02-01-2010, 02:03 AM
<html>

<head>


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

<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>
</head>

<body bgcolor = "000000" text = "cccccc">

<a href="images/younggirl.jpg" rel="lightbox" title="young girl">young girl</a>
</body>
</html>


Your head does not contain anything that should be displayed on the page. Things that are displayed on the page go into the body the head should be closed before the body. The head can contain things that tell the page how to display things in the body.

jscheuer1
02-01-2010, 02:26 AM
Generally one should just accept the folder structure as presented in the archive and use that on one's local and one's website installations. If you know about folders and paths, then of course feel free to move things around. If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

That way we can tell what's where it's supposed to be and what's not, so as to advise you further.

kundavega
02-01-2010, 03:23 AM
Thanks guys ... I really have no idea what you are talking about bluewalrus! Trust me when I say, I am new at this.

Here is the link to my test page - http://www.kundavega.com/photography.htm

Also, if someone could just tell me what to do with the lightbox file after I dl it ... that would be great. It is saved in my documents file right now. I am just not sure what to do with it.

Thank you both so much for trying to help me out with this.

xo Rachel

bluewalrus
02-01-2010, 04:23 AM
Copy the code I've put and overwrite the code you have right now, or move <body bgcolor = "000000" text = "cccccc">
so it is after </head>
Put the files the light box downloader gave you on to your server.


Your image is not where you have it linked from, so correct that as well.

kundavega
02-01-2010, 03:34 PM
Thanks Bluewalrus! Regarding uploading the files onto my server, there are three different files ... css ... js ... and images. Do I just dump the contents of all those files onto my server where my photos are? Or do I create appropriate directories for them and upload them into different files. This is where I am confused big time! Right now my pictures are in one directory. Actually, everything on my site is in one directory. So do I just upload all of the lightbox files into that directory? Thank you!!

xo Rachel

kundavega
02-01-2010, 03:40 PM
Ok here is what I have right now - http://www.kundavega.com/photography.htm - and after uploading all the files onto my kundavega directory on my server and it is still doing the same thing. What am I doing wrong? I am so flummoxed.

bluewalrus
02-01-2010, 04:48 PM
delete the directory calls since you uploaded each file individually

e.g.


css/lightbox.css

replace with


lightbox.css

kundavega
02-01-2010, 05:40 PM
I am pretty sure I already did that. I mean everything that I downloaded from the lightbox 2.04a file I uploaded into my kundavega.com directory ... all of images too. There are no separate files containing anything. So I mean at this point I am really unsure why it is not working. I am so frustrated right now. I am sure it is a very simple thing that I am just not getting. Maybe if I took a screenshot of the directory you could look at it?

bluewalrus
02-01-2010, 06:10 PM
I know where the files are, and where they are referenced in your page and that is the problem.

You have this

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


Which long hand is


<link rel="stylesheet" href="http://www.kundavega.com/css/lightbox.css" type="text/css" media="screen">


But your directory structure is


<link rel="stylesheet" href="http://www.kundavega.com/lightbox.css" type="text/css" media="screen">


because you dont have the "css" directory so for shorthand just put


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


and like wise for the javascript files.

You can test these links to see it

http://www.kundavega.com/lightbox.css

http://www.kundavega.com/css/lightbox.css

kundavega
02-01-2010, 06:38 PM
ahhhhh! I get it now! Ok ... we are definitely heading in the right direction because the lightbox is working. However, I have encountered another problem. When the lightbox comes up, it shows a broken link and it takes a little while for the picture to appear. Then there is a broken link in the bottom right hand corner of the box. Plus it is taking quite a while for the page to load. Any insight on that? Bluewalrus you are a lifesaver here!

xo Rachel

bluewalrus
02-01-2010, 07:04 PM
Same thing with the directories. In lightbox.js

Change these

fileLoadingImage: 'images/loading.gif',
fileBottomNavCloseImage: 'images/closelabel.gif',


to

fileLoadingImage: 'loading.gif',
fileBottomNavCloseImage: 'closelabel.gif',

kundavega
02-01-2010, 08:37 PM
Bluewalrus ... could you be more of a genius? Thank you SO much! I am going to go ahead and create my page now and hopefully it will all go smoothly. Should I encounter another problem, I hope you don't mind if I come back on here? Anyway, thanks a million!!!

xoxoxo Rachel