Lightbox Implementation

Since Opentools.de has now gone away I've created this forum to house FAQs and support for this mod in phpBB2.

Moderator: Experts

Capmaster
Posts: 6
Joined: Fri May 11, 2007 11:29 am

Post by Capmaster » Fri May 11, 2007 1:55 pm

The mod had absolutely no effect. I did the following:

Edited files
Copied files to new folder forum/images/templates/images/*.* as per instructions
Created files/thumbs folder and chmod to "777"
Uploaded .js and .css files to forum/templates/*.* as per instructions
Turned on thumbnails in Special Categories
Changed min. thumbnail size to 5k.

It still shows the attached image as full size, and clicking the image doesn't do anything.

I did add this hack a couple years ago to remove the box around the images. Because of this hack, I ended up not doing this step:
# ----[ OPEN ]----------------------------
#
templates/subSilver/viewtopic_attach_body.tpl

#
# ----[ FIND ]----------------------------
#
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOADED_VIEWED}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOAD_COUNT}</span></td>
</tr>

#
# ----[ REPLACE WITH ]--------------------
#
<!--
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOADED_VIEWED}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOAD_COUNT}</span></td>
</tr>
-->

#
Here's the hack to remove the box:
###Open #######################
/templates/****/viewtopic_attach_body.tpl
############################

#####FIND######################
<!-- BEGIN cat_images -->
<div align="center"><hr width="95%" /></div>
<table width="95%" border="1" cellpadding="2" cellspacing="0" class="attachtable" align="center">
<tr>
<td width="100%" colspan="2" class="attachheader" align="center"><b><span class="gen">{postrow.attach.cat_images.DOWNLOAD_NAME}</span></b></td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{L_DESCRIPTION}:</span></td>
<td width="75%" class="attachrow">
<table width="100%" border="0" cellpadding="0" cellspacing="4" align="center">
<tr>
<td class="attachrow"><span class="genmed">{postrow.attach.cat_images.COMMENT}</span></td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{L_FILESIZE}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_images.FILESIZE} {postrow.attach.cat_images.SIZE_VAR}</td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_images.L_DOWNLOADED_VIEWED}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_images.L_DOWNLOAD_COUNT}</span></td>
</tr>
<tr>
<td colspan="2" align="center"><br /><img src="{postrow.attach.cat_images.IMG_SRC}" alt="{postrow.attach.cat_images.DOWNLOAD_NAME}" border="0" /><br /><br /></td>
</tr>
</table>
<div align="center"><hr width="95%" /></div>
<!-- END cat_images -->
<!-- BEGIN cat_thumb_images -->
<div align="center"><hr width="95%" /></div>
<table width="95%" border="1" cellpadding="2" cellspacing="0" class="attachtable" align="center">
<tr>
<td width="100%" colspan="2" class="attachheader" align="center"><b><span class="gen">{postrow.attach.cat_thumb_images.DOWNLOAD_NAME}</span></b></td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{L_DESCRIPTION}:</span></td>
<td width="75%" class="attachrow">
<table width="100%" border="0" cellpadding="0" cellspacing="4" align="center">
<tr>
<td class="attachrow"><span class="genmed">{postrow.attach.cat_thumb_images.COMMENT}</span></td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{L_FILESIZE}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.FILESIZE} {postrow.attach.cat_thumb_images.SIZE_VAR}</td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOADED_VIEWED}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOAD_COUNT}</span></td>
</tr>
<tr>
<td colspan="2" align="center"><br /><a href="{postrow.attach.cat_thumb_images.IMG_SRC}" target="_blank"><img src="{postrow.attach.cat_thumb_images.IMG_THUMB_SRC}" alt="{postrow.attach.cat_thumb_images.DOWNLOAD_NAME}" border="0" /></a><br /><br /></td>
</tr>
</table>
<div align="center"><hr width="95%" /></div>
<!-- END cat_thumb_images -->
<!-- BEGIN attachrow -->
<div align="center"><hr width="95%" /></div>
<table width="95%" border="1" cellpadding="2" cellspacing="0" class="attachtable" align="center">
<tr>
<td width="100%" colspan="3" class="attachheader" align="center"><b><span class="gen">{postrow.attach.attachrow.DOWNLOAD_NAME}</span></b></td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{L_DESCRIPTION}:</span></td>
<td width="75%" class="attachrow">
<table width="100%" border="0" cellpadding="0" cellspacing="4" align="center">
<tr>
<td class="attachrow"><span class="genmed">{postrow.attach.attachrow.COMMENT}</span></td>
</tr>
</table>
</td>
<td rowspan="4" align="center" width="10%" class="attachrow">{postrow.attach.attachrow.S_UPLOAD_IMAGE}<br /><a href="{postrow.attach.attachrow.U_DOWNLOAD_LINK}" {postrow.attach.attachrow.TARGET_BLANK} class="genmed"><b>{L_DOWNLOAD}</b></a></td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{L_FILENAME}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.attachrow.DOWNLOAD_NAME}</span></td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{L_FILESIZE}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.attachrow.FILESIZE} {postrow.attach.attachrow.SIZE_VAR}</td>
</tr>
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.attachrow.L_DOWNLOADED_VIEWED}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.attachrow.L_DOWNLOAD_COUNT}</span></td>
</tr>
</table>
<div align="center"><hr width="95%" /></div>
<!-- END attachrow -->


#####################################
#####REPLACE WITH###################

<!-- BEGIN cat_images -->

<table width="5%" border="0" cellpadding="0" cellspacing="0" class="attachtable" align="center">
<tr>
<td width="100%" colspan="0" class="attachheader" align="center"><b><span class="gen"></span></b></td>
</tr>


<tr>
<td colspan="0" align="center"><br /><img src="{postrow.attach.cat_images.IMG_SRC}" alt="{postrow.attach.cat_images.DOWNLOAD_NAME}" border="0" /><br /><br /></td>
</tr>
</table>

<!-- END cat_images -->
<!-- BEGIN cat_thumb_images -->

<table width="5%" border="0" cellpadding="0" cellspacing="0" class="attachtable" align="center">
<tr>
<td width="100%" colspan="0" class="attachheader" align="center"><b><span class="gen"></span></b></td>
</tr>

<tr>
<td colspan="0" align="center"><br /><a href="{postrow.attach.cat_thumb_images.IMG_SRC}" target="_blank"><img src="{postrow.attach.cat_thumb_images.IMG_THUMB_SRC}" alt="{postrow.attach.cat_thumb_images.DOWNLOAD_NAME}" border="0" /></a><br /><br /></td>
</tr>
</table>

<!-- END cat_thumb_images -->
<!-- BEGIN attachrow -->

<table width="5%" border="0" cellpadding="0" cellspacing="0" class="attachtable" align="center">
<tr>
<td width="100%" colspan="3" class="attachheader" align="center"><b><span class="gen"></span></b></td>
</tr>

<td rowspan="4" align="center" width="10%" class="attachrow">{postrow.attach.attachrow.S_UPLOAD_IMAGE}<br /><a href="{postrow.attach.attachrow.U_DOWNLOAD_LINK}" {postrow.attach.attachrow.TARGET_BLANK} class="genmed"><b>{L_DOWNLOAD}</b></a></td>
</tr>

</table>

<!-- END attachrow -->
There was no code like this in viewtopic_attach_body.tpl, so I didn't modify the file:
<tr>
<td width="15%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOADED_VIEWED}:</span></td>
<td width="75%" class="attachrow"><span class="genmed">&nbsp;{postrow.attach.cat_thumb_images.L_DOWNLOAD_COUNT}</span></td>
</tr>
Finally, here's the screen grab of how it now looks after installing the File Attach Lightbox mod - no difference whatsoever:
Attachments
grab.jpg
Looking for a few good posters .....
Image

User avatar
DavidIQ
Site Admin
Posts: 581
Joined: Thu Sep 07, 2006 4:31 pm
Location: Earth
Contact:

Post by DavidIQ » Fri May 11, 2007 2:04 pm

So you uploaded a NEW image and it created a thumbnail and when you click on it nothing happens? FYI old images are unaffected by thumbnail settings.

Capmaster
Posts: 6
Joined: Fri May 11, 2007 11:29 am

Post by Capmaster » Fri May 11, 2007 2:30 pm

DavidIQ wrote:So you uploaded a NEW image and it created a thumbnail and when you click on it nothing happens? FYI old images are unaffected by thumbnail settings.
New image?

No, it was an old one Image


Image


I'll go try it again ....



Image
Looking for a few good posters .....
Image

Capmaster
Posts: 6
Joined: Fri May 11, 2007 11:29 am

Post by Capmaster » Fri May 11, 2007 2:50 pm

It's working but the closelabel, next, img loading, prev, etc. graphics don't show.

I've tried having the images in the following locations:

domain/images/
domain/forum/images/
domain/forum/images/templates/images/ * This is the one specified in the install file
domain/forum/templates/
domain/forum/images/
domain/forum/templates/
domain/forum/templates/images/
domain/forum/templates/template_name/images/

Still no luck. When I click on the thumbnail I get a new browser window with no navigation links.

Next I'm going to see if I can snoop into the actual files and see if I can get a path where these files are actually supposed to go ....
Looking for a few good posters .....
Image

Art57mo
Posts: 9
Joined: Wed Apr 18, 2007 6:08 pm
Contact:

Post by Art57mo » Fri May 11, 2007 3:10 pm

Hi Dave,

Well, have been trying to get LightBox to work, but think I need the path placed into my phpBB Special Categories section. However, I still have not gotten the path for ImageMagick.

The following is what my IP provider lists in his services for ImageMagick. However, he also states; "We have GD and ImageMagick installed, but I don't think we have GD2". ALSO "This page will show your developer what we have installed: http://loopshot.com/test.php ".


ImageMagick support enabled
Magick Backend ImageMagick
ImageMagick version 6.0.6
PHP imagick version 0.9.11
MaxRGB 65535
Supported image formats tmp
Font Family - Name AvantGarde - AvantGarde-Book

Again, I do not have the following entries in my Special Categories section.

Create Thumbnail = yes
Minimum Thumbnail Filesize = 50
Make use of GD2 Extension = no

Art
Art

Capmaster
Posts: 6
Joined: Fri May 11, 2007 11:29 am

Post by Capmaster » Fri May 11, 2007 3:29 pm

No luck.

@Everyone who got it to work - Where did you upload blank.gif, close.gif, closelabel.gif, image-1.jpg, loading.gif, next.gif, nextlabel.gif, prev.gif, prevlabel.gif and thumb-1.jpg?

Edit: Never mind. It has far passed the point where it's worth the aggravation.

Thanks anyways, David :wink:
Looking for a few good posters .....
Image

User avatar
DavidIQ
Site Admin
Posts: 581
Joined: Thu Sep 07, 2006 4:31 pm
Location: Earth
Contact:

Post by DavidIQ » Sat May 12, 2007 8:00 am

Art57mo wrote:Hi Dave,

Well, have been trying to get LightBox to work, but think I need the path placed into my phpBB Special Categories section. However, I still have not gotten the path for ImageMagick.

The following is what my IP provider lists in his services for ImageMagick. However, he also states; "We have GD and ImageMagick installed, but I don't think we have GD2". ALSO "This page will show your developer what we have installed: http://loopshot.com/test.php ".


ImageMagick support enabled
Magick Backend ImageMagick
ImageMagick version 6.0.6
PHP imagick version 0.9.11
MaxRGB 65535
Supported image formats tmp
Font Family - Name AvantGarde - AvantGarde-Book

Again, I do not have the following entries in my Special Categories section.

Create Thumbnail = yes
Minimum Thumbnail Filesize = 50
Make use of GD2 Extension = no

Art
There should be an option to search for ImageMagick. Use it.

User avatar
DavidIQ
Site Admin
Posts: 581
Joined: Thu Sep 07, 2006 4:31 pm
Location: Earth
Contact:

Post by DavidIQ » Sat May 12, 2007 8:04 am

Capmaster wrote:No luck.

@Everyone who got it to work - Where did you upload blank.gif, close.gif, closelabel.gif, image-1.jpg, loading.gif, next.gif, nextlabel.gif, prev.gif, prevlabel.gif and thumb-1.jpg?

Edit: Never mind. It has far passed the point where it's worth the aggravation.

Thanks anyways, David :wink:
You're not supposed to move the image folder anywhere. The only thing that needs to be done with the lightbox zip file is unzip and upload to where your forum is. The install file doesn't say anywhere to put it in forum/images/templates/images. Plus it's not supposed to open a new browser window either. It's supposed to do what this does:
viewtopic.php?t=52

Post a link to an example of what you have and I'll try to see what you've done or might have missed.

Art57mo
Posts: 9
Joined: Wed Apr 18, 2007 6:08 pm
Contact:

Post by Art57mo » Sat May 12, 2007 8:46 am

DavidIQ wrote:
Art57mo wrote:Hi Dave,

Well, have been trying to get LightBox to work, but think I need the path placed into my phpBB Special Categories section. However, I still have not gotten the path for ImageMagick.

The following is what my IP provider lists in his services for ImageMagick. However, he also states; "We have GD and ImageMagick installed, but I don't think we have GD2". ALSO "This page will show your developer what we have installed: http://loopshot.com/test.php ".


ImageMagick support enabled
Magick Backend ImageMagick
ImageMagick version 6.0.6
PHP imagick version 0.9.11
MaxRGB 65535
Supported image formats tmp
Font Family - Name AvantGarde - AvantGarde-Book

Again, I do not have the following entries in my Special Categories section.

Create Thumbnail = yes
Minimum Thumbnail Filesize = 50
Make use of GD2 Extension = no

Art
There should be an option to search for ImageMagick. Use it.
Hi Dave,

Yes there is and "NO", it will not find it. I have just e-mailled the IP Provider again about this, hopping he can help.

Art
Art

User avatar
DavidIQ
Site Admin
Posts: 581
Joined: Thu Sep 07, 2006 4:31 pm
Location: Earth
Contact:

Post by DavidIQ » Sat May 12, 2007 1:47 pm

They might not have set the permissions to it so that scripts can find its location. It might be enough to just get the path to Image Magick.

Art57mo
Posts: 9
Joined: Wed Apr 18, 2007 6:08 pm
Contact:

Post by Art57mo » Mon May 14, 2007 5:56 pm

DavidIQ wrote:They might not have set the permissions to it so that scripts can find its location. It might be enough to just get the path to Image Magick.
Hi Dave,

YUP, that is exactly what the IP Provider had to do. Now have the path. Did a test image upload and had a problem. Then went back to my Admin. page, Special Categories and did a test settings and fond out what it was not writing the thumbnails. Was not writing the thumbnail to the "thumbs" directory as I needed to set the attributes to 777 for read/write, all atrib's.

After this, it seems to be working.

Test Location: http://www.challengers101.com/phpBB2/vi ... hp?p=10#10

Art
Art

User avatar
DavidIQ
Site Admin
Posts: 581
Joined: Thu Sep 07, 2006 4:31 pm
Location: Earth
Contact:

Post by DavidIQ » Mon May 14, 2007 9:14 pm

Woot! Another happy lightbox user. Glad you got it straightened out. 8)

Cool isn't it? ;-)

Cama
Posts: 1
Joined: Wed May 16, 2007 1:08 am
Contact:

Post by Cama » Wed May 16, 2007 1:18 am

Hello DavidIQ.
Your effect has very much liked :)
Wished to ask - the counter of viewings does not work. Thought it bag, there was at you it too is not visible.
It is planned to restore the counter of viewings? And for what files next.gif, prev.gif are necessary? They are not used, them it is not visible in work.
Thanks.

User avatar
DavidIQ
Site Admin
Posts: 581
Joined: Thu Sep 07, 2006 4:31 pm
Location: Earth
Contact:

Post by DavidIQ » Wed May 16, 2007 7:35 am

You can add something to the page if you want but the download counter does not increment for images with the lightbox hack installed. This is why the counter is removed for images. Anytime the page is accessed the counter was incremented anyways so it wasn't necessarily when or if the picture was downloaded and it still counts when it's any other filetype.

russell235
Posts: 2
Joined: Fri Sep 21, 2007 7:44 pm

Re: Lightbox Implementation

Post by russell235 » Fri Sep 21, 2007 7:50 pm

this looks like it would be a great addition, and it almost works for me, but not quite. When I click on the thumb, the loading screen appears for a sec. In firefox, a white box resizes itself to the dimensions of my full size image, then nothing more happens. it's just a whitebox. In IE, it's the same thing but it doesn't resize itself to my image dimensions. It's just a smaller whitebox.

I hope you can help. :(

Locked

Who is online

Users browsing this forum: No registered users and 1 guest