vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 3.6 Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=192)
-   -   Adding Lightbox to Attachment thumbs (https://vborg.vbsupport.ru/showthread.php?t=123235)

imranbaig 08-05-2006 10:00 PM

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>

Code:

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

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

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

Terminatoronly 08-06-2006 06:59 PM

installed ;) its really good i love it :)

Benj 08-06-2006 06:59 PM

wicked i will be installing

Oddjob 08-06-2006 07:15 PM

Where exactly are you supposed to put that in the headinclude template? At the very top?

Im also a little confused where the files are uploaded to.....

effectica 08-06-2006 11:05 PM

Thanks for this. I installed it, it's great. :)

When I installed it though, it didn't work.
I think that the second edit should be

Code:

<a rel="lightbox" ....
Note the lightbOx

instead of

Code:

<a rel="lightbpx" ....

effectica 08-06-2006 11:09 PM

Quote:

Originally Posted by Oddjob
Where exactly are you supposed to put that in the headinclude template? At the very top?

Im also a little confused where the files are uploaded to.....


EDIT: imranbaig has a better solution

imranbaig 08-07-2006 10:40 AM

Sorry for that typo error.
In the headinclude template Paste it below this.
Code:

<!-- CSS Stylesheet -->
$style[css]
<if condition="is_browser('opera') AND !is_browser('opera', '8.0.1')">
<style type="text/css">
ul, ol { padding-left:20px; }
</style>
</if>
<!-- / CSS Stylesheet -->


effectica 08-07-2006 10:50 AM

Thanks imranbaig.

One question. As with the other lightbox mods that can be found on this site, also yours gives the problem that the quick edit does not work. It saves the data but it doesn't close the quick edit box. Would you happen to know how to fix this?

imranbaig 08-07-2006 11:13 AM

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

Holidazed 08-07-2006 04:47 PM

Well, I followed the instructions to the letter, yet it does not work. I uploaded all the files and made the edits. When I click on the thumbnail in my forums, it just displays it like it always did b4.

See for yourself.
http://www.pcinfoman.com/vbb350/show...?p=193#post193
Username: testing
Password: testing

Ideas?


All times are GMT. The time now is 12:57 PM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01186 seconds
  • Memory Usage 1,740KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (6)bbcode_code_printable
  • (1)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete