Adding Lightbox to Attachment thumbs

Adding Lightbox to Attachment thumbs
Overview
Lightbox JS is a simple, unobtrusive script used to overlay images on the current page. It's a snap to setup and works on all modern browsers.

-This hack allows you to add the famous lightbox to attachment thumbnails.

- This makes users see attached images easilly, without having to open another page.

- It can be completly customised, to fit into your skin design, from css.

Installation - Very easy.

Download and upload the contents of upload folder into your forum root.

Template Edits.

Step1: Open headinclude, and insert this inside <heade></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" />

click Save.

Step2: Now Open postbit_attachmentthumbnail

Find:

<a href="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;d=$attachment[dateline]"<if condition="$show['newwindow']"> target="_blank"</if>><img class="thumbnail" src="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;stc=1&amp;thumb=1&amp;d=$attachment[thumbnail_dateline]" border="0" alt="<phrase 1="$attachment[filename]" 2="$attachment[counter]" 3="$attachment[filesize]" 4="$attachment[attachmentid]">$vbphrase[image_larger_version_x_y_z]</phrase>" /></a>
&nbsp;<if condition="$show['br']"><br /><br /></if>

Replace With:

 <a rel="lightbox" href="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;d=$attachment[dateline]"<if condition="$show['newwindow']"> target="_blank"</if>><img class="thumbnail" src="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;stc=1&amp;thumb=1&amp;d=$attachment[thumbnail_dateline]" border="0" alt="<phrase 1="$attachment[filename]" 2="$attachment[counter]" 3="$attachment[filesize]" 4="$attachment[attachmentid]">$vbphrase[image_larger_version_x_y_z]</phrase>" /></a>
&nbsp;<if condition="$show['br']"><br /><br /></if>

Thats it Enjoy The hack.

Demo: http://forums.winkeyfinder.com/showthread.php?p=1502

Note: It doesn't work if I click an image link before the page has finished loading.
The script is activated only after the page has finished loading.
Thank you!

All the Credit goes to huddletogether.com, for devloping such a beautifull script.

[webgroup]

Originally Posted by imranbaig

Well this is due the the script, I think the author of the scriipt has few tips for Collision of scripts, Here is the link = http://www.huddletogether.com/projects/lightbox2/ Look into support part.

Also If you want to have it like gallery where it shows Next and Prev Links in lightbox, just change rel="lightbox" to rel="lightbox[whatever]"

Installed and working perfectly.
Could you please explain a little more how to exactly add the gallery style function(next/prev)?

Thanks!

[Snake]

Thanks for the hack! I'll install it right away...

[43082448]

quick edit does not work,how do i?

[Lionel]

Once I removed the javascript in the headinclude, that undefined all over problem mentioned many times in this thread disappeared

[Kanustep]

I'm getting an error on vBulletin editor in font size.
This is a great plug-in, but need a little bit of improvement. Working with version 3.6.0.

[Mr_Devlin]

Sorry, but I can't get this to work.

Did all edits and uploads as described and nothing happened. btw: does it take affect when using custom styles? If so, other upload locations may be required.

Please be more precise where the file have to be uploaded. I loaded all files to forum root and several other folders and get always same result - nothing changed, no lightbox. It depends NOT on browser, because FF won't do it also. I tried IE, FF, Netscape and Deepnet without any success. Have to change back to default attachments.

[Kanustep]

In some cases you need to rebuilt forum cache or forum information.

[dodgeboard.com]

Originally Posted by Kanustep

I'm getting an error on vBulletin editor in font size.
This is a great plug-in, but need a little bit of improvement. Working with version 3.6.0.

Same here!!! Plus the UNDEFINED error mentioned earlier. I wished it worked cause I love this hack and so did my members.

Reverted template headinclude and that fixed it but of course, removed lightbox.

[Kanustep]

Is there any fix to this? It shouldn't be hard since it doesn't change anything relevant.

[dodgeboard.com]

Originally Posted by Kanustep

Is there any fix to this? It shouldn't be hard since it doesn't change anything relevant.

Dunno.....I don't think it is actually the script in the headerinclude so much as it is the js files in the js directory. I think this because I was able to correct the problem by renaming the js folder to js.whatever which effectively renders the files in that folder unusable to lighbox.

Me thinks one of the .js files is the problem.

I run 3.6.0 and only experience issues in advanced or wysiwyg editor modes, which of course are the only modes that use those drop-down menus.

Dodgeboard.com clicks *uninstalled*