MyBB Community Forums

This tutorial will show you how to easily get image attachemtns to open in Lightbox.

This tutorial should not take any longer than 5 minutes.
This tutorial is easy to do, and everyone should be able to do it.

Step 1
Download the compressed folder and upload it to the root of your folder. The compressed file is the files needed to allow Lightbox to work. The file has been scanned for your security.

Step 2
Login to your Admin CP
Locate to "Templates & Styles" then select the "Templates" option from the sub menu to the left.
Select your template you use for your boards.

Step 3
Select the "Ungrouped Templates" option from the very bottom. Then select "headerinclude". You should now be at an editor...

Under,

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1400"></script>

Add,

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/lb/prototype.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/lb/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/lb/lightbox.js"></script>
<link rel="stylesheet" href="{$mybb->settings['bburl']}/css/lightbox.css" type="text/css" media="screen" />

Click, "Save and Return to Listing".

Step 4
Now select "Post Bit Templates" found near the middle of the page. Next select "postbit_attachments_thumbnails_thumbnail".

Once again you will be taken to an editor. Delete everything in it, and paste the following,

<a href="attachment.php?aid={$attachment['aid']}" rel="lightbox[attach]"><img src="attachment.php?thumbnail={$attachment['aid']}" alt="" /></a>&nbsp;&nbsp;&nbsp;

Click, "Save and Return to Listing"

Step 5
That's you done. Easy, eh? Now go off and try it out simply by uploading an image attachment to your post. This particular coding has allowed to all the images in one thread to link together. If you don't want it to do this simply,

Select "Post Bit Templates" found near the middle of the page. Next select "postbit_attachments_thumbnails_thumbnail".
When you see the coding simply locate,

rel="lightbox[attach]"

Delete,

[attach]

Done.

---

Live Demo! - http://lightbox.forumhost.cn/index.php

Nice tutorial

You are to post here first where someone will move it to the Tutorials forum.

Why have you included prototype again when it's a standard javascript of MyBB?

I've just included the files that came with Lightbox. I havn't altered them so that's why I didn't notice...

Alright but it's not needed

I think it's got a bug though. If the user is logged in as a guest, thus no permission to load the image, the lightbox it appears just keeps trying to load the image without ever loading it. Can you confirm this bug?

Ah, yes. Let me think of how to overcome this...

Has it been ovecome?

Hi,

I made a plugin that does the job without modify any template. Also users who are nor allowed to see attachments are handled (there isn't the bug that was reported here in the plugin):

Lightbox 2