Go Back   vb.org Archive > vBulletin Article Depository > Read An Article > vBulletin 3 Articles
FAQ Community Calendar Today's Posts Search

Reply
 
Thread Tools
How-to Use vB Lightbox for Pictures on Custom Pages
Abe1's Avatar
Abe1
Join Date: Feb 2004
Posts: 2,886

 

I LOVE New York!
Show Printable Version Email this Page Subscription
Abe1 Abe1 is offline 12-24-2007, 10:00 PM

This 'how-to' will explain how to utilize the vB 3.7 feature of a lightbox for images on your custom vB pages.

First, at the bottom of the page you are working on, right above where you would put the $footer variable, add the following:

HTML Code:
<!-- lightbox scripts -->
    <script type="text/javascript" src="clientscript/vbulletin_lightbox.js?v=$vboptions[simpleversion]"></script>
    <script type="text/javascript">
    <!--
    vBulletin.register_control("vB_Lightbox_Container", "zzzzz", $vboptions[lightboxenabled]);
    //-->
    </script>
<!-- / lightbox scripts -->
After, you must wrap the entire area where the image links will be located with one 'DIV' tag.
Here is an example:

HTML Code:
<div id="zzzzz">
<!-- Your code here. -->
</div>
Last but not least, whether you want a text or image as the link that triggers the lightbox, you have to wrap it around with 'a' tags that include the following:
href - place the URL of the image that you want to show up in the lightbox
rel - that is set to "'Lightbox'
Here is an example:

HTML Code:
<a href="http://www.vbulletin.com/forum/images/misc/vbulletin3_logo_white.gif" rel="Lightbox">
    <!-- Your text or image here. -->
</a>
Your all set now.

Note: You may change the 'zzzzz' to anything, just make sure BOTH places say the same and that there are no conflicts with other IDs.
Reply With Quote
  #2  
Old 07-07-2008, 09:55 AM
RS_Jelle RS_Jelle is offline
 
Join Date: Jul 2005
Posts: 1,276
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Hmm, this isn't working for me on vB 3.7.2. I compared it with the vB Lightbox for attachments, ... but I don't see any differences or changes.

The included JavaScript is blocking the href="" link from working (so it is doing something), but there's no Lightbox opening.
Reply With Quote
  #3  
Old 07-08-2008, 11:29 AM
Q-v-n-s-Q Q-v-n-s-Q is offline
 
Join Date: Mar 2005
Posts: 289
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

hmm thank you, but it doesnt work
Reply With Quote
  #4  
Old 07-13-2008, 06:23 AM
Abe1's Avatar
Abe1 Abe1 is offline
 
Join Date: Feb 2004
Location: I LOVE New York!
Posts: 2,886
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

works for me using 3.7.2
Reply With Quote
  #5  
Old 12-03-2008, 03:13 PM
entertain entertain is offline
 
Join Date: May 2007
Location: Bavaria
Posts: 435
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

also not working for me...

Firebug shows the following error:
Attached Images
File Type: png firebug-lightbox.png (7.0 KB, 0 views)
Reply With Quote
  #6  
Old 01-26-2009, 07:36 AM
ragtek ragtek is offline
 
Join Date: Mar 2006
Location: austria, croatia
Posts: 1,630
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

h?

for me its also not working
this is my code:
HTML Code:
<div class="alt1 block_row" id="flickrfotos">
	<ul class="list_no_decoration">
		<!-- BEGIN TEMPLATE: flickr_fotobit -->

<a href="http://farm4.static.flickr.com/3133/3228243890_3cc6c267dc.jpg" rel="Lightbox">
	<img border="0" alt="Naschmarkt" src="http://farm4.static.flickr.com/3133/3228243890_3cc6c267dc_m.jpg" />
</a>

<!-- END TEMPLATE: flickr_fotobit --><!-- BEGIN TEMPLATE: flickr_fotobit -->
<a href="http://farm4.static.flickr.com/3372/3227390009_cc260b6805.jpg" rel="Lightbox">
	<img border="0" alt="Naschmarktkunst" src="http://farm4.static.flickr.com/3372/3227390009_cc260b6805_m.jpg" />
</a>

<!-- END TEMPLATE: flickr_fotobit -->
At end i add
HTML Code:
    <script type="text/javascript" src="clientscript/vbulletin_lightbox.js?v=380"></script>
    <script type="text/javascript">
    <!--
    vBulletin.register_control("vB_Lightbox_Container", "flickrfotos", 1);
    //-->
    </script>
When i click on the photo, it seems to be working (it's getting dark) but then the browser redirects to http://farm4.static.flickr.com/3133/...3cc6c267dc.jpg
Reply With Quote
  #7  
Old 02-07-2009, 01:33 PM
ragtek ragtek is offline
 
Join Date: Mar 2006
Location: austria, croatia
Posts: 1,630
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

nobody have a idee why it's not working?
Reply With Quote
  #8  
Old 02-20-2009, 09:27 AM
ceho ceho is offline
 
Join Date: Mar 2008
Location: Germany
Posts: 110
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

May there be anything that needs to be changed on VB 3.8.1?

Can anybody help? Thanks a lot.
Reply With Quote
  #9  
Old 03-08-2009, 02:05 AM
Barabaika Barabaika is offline
 
Join Date: May 2006
Posts: 6
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

* The 'rel' attribute is rel="Lightbox_11111111" now - Lightbox_ + unique ID for all images in the set.
* <a href should be a script that returns an XML page that has html (with link inside), date, time, etc tags. You can look for an example in attachment.php, in the section devoted to the AJAX processing.
Reply With Quote
  #10  
Old 06-02-2009, 02:49 AM
Excalibur82 Excalibur82 is offline
 
Join Date: Dec 2008
Posts: 175
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

I am currently working on the issue with lightbox within vB. So far just getting a black box so trying to figure out how vB can use a php file to do it instead of an html or xml file.

--------------- Added [DATE]1243920951[/DATE] at [TIME]1243920951[/TIME] ---------------

Apparently there is no current way to implement vB's lightbox with custom pages. It was included only for use with attachments especially in 3.8.x
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 01:48 PM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.07465 seconds
  • Memory Usage 2,308KB
  • Queries Executed 24 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (5)bbcode_html
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_article
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (1)pagenav_pagelink
  • (10)post_thanks_box
  • (10)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (10)post_thanks_postbit_info
  • (9)postbit
  • (1)postbit_attachment
  • (10)postbit_onlinestatus
  • (10)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.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/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.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
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • postbit_attachment
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete