Register Members List Search Today's Posts Mark Forums Read

Reply
 
Mod Options
Lytebox Intergration. Allows image groups, slideshows and works with embeded images. Details »
Lytebox Intergration. Allows image groups, slideshows and works with embeded images.
Mod Version: 1.20, by D.Baker (Member) D.Baker is offline
Developer Last Online: Oct 2008 I like it Show Printable Version Email this Page

This modification is in the archives.
vB Version: 3.7.0 Rating: (0 vote - 0 average) Installs: 9
Released: 21 May 2008 Last Update: Never Downloads: 6
Not Supported Template Edits Additional Files Re-usable Code Translations  

This mod has be made redundant by The Image Resizer by TCattitude. So, I no longer support it and recommend you use his plugin instead, it's much better!

This isn't the best mini-mod out there, and I'm not even sure if it's technically a mod. It's closer to a "how to" document than a mod. This works better than most of the proper Lytebox mods out there as it allows image grouping or slideshows (can't have both) and works with images embeded in posts (using ATTACH BBcode, or the little paper clip) . I'm not sure if it works with images in signatures, try it out and let me know. It does not do anything to images embedded using the IMG BBcode (it only works on images linked to by a thumbnail).

LIVE DEMO: Here. Note that I am using the image group feature instead of the slideshow feature.

Anyway, here it is.

If you would like to get Lytebox working with vB 3.7.0 (this should work with other versions, but this is all I have tested it on). You need to do the following.

1) Download latest version of Lytebox here.

2) Edit lytebox.js to your desired settings (can just leave as default if you want).

3) Edit lytebox.css using a find-and-replace tool (even Notepad will do this). You need to swap all the words:
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

for:
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

4) Upload lytebox's images folder to "/images/lytebox" using FTP.

5) Upload lytebox.js and lytebox.css to "/clientscript" using FTP.

6) In AdminCP, go to Styles & Templates>Replacement Variable Manager and create a new replacment variable. Set it to replace:
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

with:
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

If you want to use the image group feature then replace
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

with:
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

This will make all attached/embeded images in the one thread display in lytebox as a group (I am still working on how to make only images from the one post group).

If you want to use the lyteshow feature then replace
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

with:
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

This will make all attached/embeded images in the one thread display in lytebox as a slidshow (I am still working on how to rhis with only images from the one post ).
7) In AdminCP, go Style Manager>Edit Templates>Show Thread Templates>SHOWTHREAD. Click Customize (or Edit) and replace the following code:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

with this code:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

8) You need to move the above code into the head section of the SHOWTHREAD template. To do this, you simply cut it and paste it right above the <HEAD> tag.

9) Repeat steps 7 and 8 for the SHOWTHREAD_SHOWPOST template. You can find this template by going into Style Manager>Edit Templates>Show Thread Templates>SHOWTHREAD_SHOWPOST. This will get lytebox working on the individual post page.

10) In AdminCP you need to turn on thumbnails and Lightbox (note that it refers to Lightbox, not lytebox. This is OK). You can do this in the AdminCP at vBulletin Options>Message Attachment Options.

11) Make sure that your images aren't set to load in a New Window. You can change this in the AdminCP at Attachments>Attachments Manager.

12) To enable images embedded using the IMG tag to be resized and enlarged using lytebox, you need to install JASE2's Image Resizer plugin from here and make some code changes.
Make sure you you set Image Resizer to enlarge images in a new window. You do this in AdminCP vBulletin Options>Image Resizer Options>Default Resize Mode and set it to "Open in new window". You also need to set the size you want the IMG embedded images resized to (I set them to the same as my thumbnail settings).
13) Using FTP, browse to /includes/ and edit the following line of PHP code in the file "class_bbcode.php".


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

change to:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

NOTE: If you want to use the slideshow feature, simply use rel="lyteshow[group]" rather than rel="lytebox[group]".

14) To remove the yellow warning box from images embedded using IMG tags, add the following CSS to your style.


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.


v1.2

Provides a way to resize images embedded using IMG. It's not perfect, but it works in the meantime.

v1.1
Works when viewing a single post.
Allows for slideshows using lyteshow.


Credits:
Thanks to Andy Huang from the vB team.
Thanks to Lost Heaven for coming up with the code I used in step 13.
Of course, thanks to Markus F. Hay for Lytebox.

Download Now

Only licensed members can download files, Click Here for more information.

Show Your Support

  • To receive notifications regarding updates -> Click to Mark as Installed.
  • This modification may not be copied, reproduced or published elsewhere without author's permission.
Similar Mod
Mod Developer Type Replies Last Post
Add-On Releases The Image Resizer. Powered with Lytebox / Highslide / Lightview / and many more! TCattitude vBulletin 3.7 Add-ons 725 10 Oct 2013 05:30
Forum Display Enhancements Image Resize using Lytebox ( 3.6.x ) Lost Heaven vBulletin 3.6 Add-ons 37 13 May 2009 21:37
Forum Display Enhancements Image Resize using Lytebox Lost Heaven vBulletin 3.7 Add-ons 73 17 Dec 2008 23:14

Comments
  #2  
Old 21 May 2008, 11:00
anestetic anestetic is offline
 
Join Date: Mar 2007
what is demo or caps ?
Reply With Quote
  #3  
Old 21 May 2008, 11:08
D.Baker D.Baker is offline
 
Join Date: May 2008
Sorry, I don't understand what your referring too.
Reply With Quote
  #4  
Old 21 May 2008, 11:11
dannykilla's Avatar
dannykilla dannykilla is offline
 
Join Date: Jun 2007
Real name: Danny
Whats the difference between this and the Image resizer using lytebox hack/mod ?

thanks
Danny
Reply With Quote
  #5  
Old 21 May 2008, 11:26
D.Baker D.Baker is offline
 
Join Date: May 2008
My mod works for images that are embedded in a post, it also allows images to be grouped or displayed in as a slide show. Image Resizer does not do these things.

It does not allow resizing images to a set dimension, but it does auto resize images if they are larger than the viewers screen dimensions.
Reply With Quote
  #6  
Old 21 May 2008, 11:27
dannykilla's Avatar
dannykilla dannykilla is offline
 
Join Date: Jun 2007
Real name: Danny
awesome would there be any future update to allow the resizing of images for a specific set dimension?
Reply With Quote
  #7  
Old 21 May 2008, 13:02
D.Baker D.Baker is offline
 
Join Date: May 2008
If I understand you correctly, and correct me if I'm wrong, but I don't see how that would be any different than what you can do in vB already. Just set the maximum image size to whatever you want it to be in the Attachment Manager (I have attached a screenshot of my recommended settings). Then in vBOptions>Message Attachment Options set the following:

Resize Images: Yes
View Attached Images Inline: Yes
Thumbnail Creation: Yes
Thumbnail Size: 180 (Or whatever you want)

This will mean the end result is that every image attached is displayed by a thumbnail and when clicked on, it will expand with Lytebox to be the size you set in Attachment Manager, which in my case is 1000px wide. If the end user has a screen resolution smaller than 1000px wide, then it automatically down sizes it. What else would you need to do? Setting Lytebox to auto scale images can be achived by changing the size restraints in Attachment Manager.

Keep in mind that Lytebox (so, any plugin based on it ) doesn't actually resize the image file, it just scales it. If you've been running a board for a while now and want to resize all the old images that have been uploaded, any plugin based on Lytebox isn't going to help you reduce the actual image size. All they can do is scale images for the end user, or if combined with a proper PHP based image resizer, replicate the features already in vBulletin board.

That being said, I did not code this plugin. I just compiled a step-by-step on how to intergrate an exsisting web app into vBulletin. So, no I won't be releasing a version that can resize images to a certian size, as I don't see how that's any different than what vBulletin allows you to do already (and I don't know that much about coding).
Attached Images
File Type: jpg attachment_settings1.jpg (29.8 KB, 200 views)
Reply With Quote
  #8  
Old 21 May 2008, 21:55
iogames's Avatar
iogames iogames is offline
 
Join Date: Jan 2007
Real name: Josh Arcadia
does it work for 3.6.10?
__________________
. █│║▌│█│║▌║│█║▌│║║█║
Reply With Quote
  #9  
Old 22 May 2008, 03:02
D.Baker D.Baker is offline
 
Join Date: May 2008
I'm not sure, I don't see why not. As long as the templates work the same. Give it a try. Do a backup before though, just to be safe. Like I siad in my post above, I've only used it in 3.7.0. I actually only started using vBulletin about a week ago, so I'm not really the guy to ask about these things. I just made this little mod becuase I really needed Lytebox to wrok properly.
Reply With Quote
  #10  
Old 22 May 2008, 17:16
Wayne Luke's Avatar
Wayne Luke Wayne Luke is offline
 
Join Date: Jan 2002
Real name: Wayne
Originally Posted by iogames View Post
does it work for 3.6.10?
3.6.10 doesn't have Lightbox functionality by default so it won't find the replacements and set the relations properly.
__________________
Wayne Luke
Get started with your own social network. Purchase and download vBulletin today.
Reply With Quote
  #11  
Old 22 May 2008, 20:37
DoB Rhapsody DoB Rhapsody is offline
 
Join Date: Jul 2007
demo please..
Reply With Quote
  #12  
Old 23 May 2008, 13:19
D.Baker D.Baker is offline
 
Join Date: May 2008
LIVE DEMO: Here. Note that I am using the image group feature instead of the slideshow feature.
Reply With Quote
  #13  
Old 23 May 2008, 19:09
Stoebi Stoebi is offline
 
Join Date: Apr 2006
Real name: Peter
how can i set a comment for evey image, please?

Demo here:
http://www.dolem.com/lytebox/misc/jupiter_io_thumb.jpg
Reply With Quote
  #14  
Old 23 May 2008, 19:31
Allan's Avatar
Allan Allan is offline
 
Join Date: Jun 2003
Real name: allan
Very nice this hack, i like it, congrat
__________________
-------------------------------------------------------------------------------------------
Administrator vBulletin-Ressources.com, French vBulletin Resources.
Reply With Quote
  #15  
Old 23 May 2008, 19:53
bmwusa bmwusa is offline
 
Join Date: Feb 2006
just what i was looking for thanks!
Reply With Quote
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Mod Options

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


New To Site? Need Help?

All times are GMT. The time now is 13:57.

Layout Options | Width: Wide Color: