Junior Coders
can you help a true "dummie?"
1) Script Title: help on lightbox2
2) Script URL (on DD):
3) Describe problem: this stuff is all new to me....and sometimes reading the directions seem too vague to me(they're probably perfect...it's me!) i have tried to put the code in, but could you give a real basic step by step to use this? that would be great! i even look at the "source" page where you show the program, but i still don't get it. thanks!
Senior Coders
Please let us know what you see, what makes you say it doesn' work, place a link to what you've done, etc.
Administrator
Warning: Also, please include a link to the DD script in question in your post. See this thread for the proper posting format when asking a question.
Junior Coders
hi, i hope this is what you need.....i would like to use this feature(lightbox) on my site on my for sale items at:
http://twixidesigns.com/forsalepage.htm
i thought it would be cool to have the pics in thumbnail size and then click on them for the lightbox effect. i am a real newbie to doing code.
thanks for your help!
trish
Junior Coders
Keep in mind this guide i write to help you and anyone else and is to my understanding as to how the script works, and from personal experince as to make scripts work. Since i have no hands on experince working or useing this script, its only to how i understand what the page says as to how it works. That can be Viewed HereOriginally Posted by twix23919
Are you working with Lightbox image viewer 2.0?
Don't touch
This is where you Edit
in short this is what you basicly need to know. If you're working with your own domain, you can add a 'images' folder. by clicking on creat a new folder in your www. then just leave where the image Name_of_your_image_here.jpg
if not and you're going with a free hosting website provider, this is what you need to do then. Upload the following files the script page comes with after unziping the folder. Free hosting providers come with a upload option. Now if you do basic HTML and don't have <HEAD></HEAD> right below <TITLE> then you need to add it. It will look something like this:
<TITTLE>Your TITLE for your site here</TITLE>
<HEAD>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
</HEAD>
Keep in mind with useing free hosting provider, you won't have a js folder. so you will need to just upload it to where its in your root/home folder (something like angelfire does it) So with the file you unziped everything from, you need to unload everything in the same place as to where you see it all on your root page in the same listing. so the only change you would need to make to is shown here after whats needed to be done:
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="lightbox.js"></script>
<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
So above is the following code you will need after you followed the steps as posted and you would place that code between the <HEAD> tags as shown befor with the original code.
This goes for the same example from the page when it comes to making your thumb nail images. again if you don't have a image folder to upload your images in to so the code would be
<a href="images/image-1.jpg" rel="lightbox" title="Change whatever you want the image caption to be">Name Link of Image here</a>
Then you need to upload all your images in to the same place as everything else is and so the change would be :
<a href="Name_Of_Image.jpg" rel="lightbox" title="my caption">image #1</a>
keep in mind not all your images may end in .jpeg or .jpg, may end in .gif so you will have to change it. this is known as the images extentsion. so make sure to put in the right one for each image. normally when images are listed, it will show if its a .jpeg,.jpg,.gif
To clear up basicly this script for a better understanding what it means by grouping:
<a href="image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
[roadtrip] is used as a example. so lets say you wanted all your roadtrip pics to be put together in view, you can do this. then lets say below you wanted to show your camping pics, then you change [roadtrip] to [camping] or whatever you want to name the group. keep in mind thats for grouping different groups at the same time. So if you are useing the grouping effect, this is what you edit:
<a href="image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
I hope this helps. Good luck!
Last edited by Mysterious; 01-15-2007 at 06:48 PM.
Junior Coders
hi.........it's lightbox 2.0, and my host is 1 and 1. i had just checked to see if anything got posted....in the middle of tons of stuff and chomping at the bit to try the lightbox. guess i'll have to finish up this other work first.
thanks so much for all the info....and i'll get back with you as soon as i can and let you know how it goes.
if there's something else i need to know now that you know my host...i will check back before i get started on it.
thanks again! trish
Junior Coders
Dont touch
This is where you edit
Okay since you are with a hosting Service. I've never worked with that one but i'm sure if you look at their FAQ/Help Pages as to how to make a new folder in your www (or if you know how to do this) name it images and keep in mind, scripitng is CaSe Sentive. meaning images and Images in a script are two different things, so you have to basicly keep the folder name the same as it is in the script, if not, won't work.
take the zip file it has and unzip it on your computer, open up the folder to where you see all the other folders, upload all those folders:
css
images
js
don't need to upload the index.html
Reminder: if you already have a images folder, then just take the images out of the folder and upload them in to your images folder on your www.
So go ahead and CC&P (Cut Copy & paste) the original code from the site as to where it says to put it, and you would just have to change:
images/Name_of_Image_Here.jpg
Junior Coders
hi........i just read your response.....i will try that...i will get back with you this week once i have the opportunity. hectic here at the moment, and now someone was saying my site had viewing problems. did you see any when you were there? just curious.....thanks! have a wonderful evening! trish
Junior Coders
No your site works fine on my end. Sounds like to me the person could be having browser problems or may not have the right ports open for friendly internet use (the basic ports needed to view and vist websites) unlees they're with Netscape and only vist "trusted" sites and well then their secruity settings is too high to vist new sites not yet verified to be trusted and what not...
could be anything but the basic cause is normally browser problems on their end.
Junior Coders
hi, i just wanted to get back with you......i have been so busy with other stuff, i haven't had the time to work with this. i have copied your info, and i'm planning on trying to make this work soon as soon as i have the opportunity. i just wanted to let you know cuz you were so helpful! i will repost when i can. thanks so much again!
trish
Posting Permissions
Reply With Quote
Bookmarks