41b37afe5675a36b1941810d6a92499dc51e7504
[project/lightbox2.git] / README.txt
1 LIGHTBOX V2 MODULE
2 ------------------
3
4 Drupal Lightbox V2 Module:
5 By: Mark Ashmead
6 Mailto: bugzie@gmail.com
7
8 Licensed under the GNU/GPL License
9
10 Permission has been granted by Lokesh Dhakar to distribute the lightbox.js file via Drupal.org under this license scheme, as allowed by the Creative Commons License.
11
12 This module enables the use of lightbox V2 which places images above your current page, not within. This frees you from the constraints of the layout, particularly column widths.
13
14 ---------------------------------------------------------------------------------------------------------
15
16 Pre-Installation
17 ----------------
18
19 Due to variation in licensing, you will need to download the Scriptaculous/Prototype libraries seperately. Please visit: http://script.aculo.us/downloads - and download the latest version of the libraries. You will then need to copy the files located in \lib and \src directories of this download into the \lightbox2\js\ directory of the LightboxV2 module. 
20
21 The files required are: 
22
23 \lib\prototype.js
24 \src\builder.js
25 \src\dragdrop.js
26 \src\effects.js
27 \src\scriptaculous.js
28 \src\slider.js
29 \src\unittest.js
30
31 When copied, the directory should look like:
32
33 \lightbox2\js\prototype.js
34 \lightbox2\js\builder.js
35 \lightbox2\js\dragdrop.js
36 \lightbox2\js\effects.js
37 \lightbox2\js\scriptaculous.js
38 \lightbox2\js\slider.js
39 \lightbox2\js\unittest.js
40
41
42 Installation
43 ------------
44 1. Copy lightbox2 folder to modules directory
45 2. At admin/modules enable the module
46 3. Add rel="lightbox" attribute to any link tag to activate the lightbox. For example:
47
48 <a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
49
50 Optional: Use the title attribute if you want to show a caption.
51
52 4. If you have a set of related images that you would like to group, follow step one but additionally include a group name between square brackets in the rel attribute. For example: 
53
54 <a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
55 <a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
56 <a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
57
58 No limits to the number of image sets per page or how many images are allowed in each set. Go nuts! 
59
60 5. If you wish to turn the caption into a link, format your caption in the following way:
61
62 <a href="images/image-1.jpg" rel="lightbox" title='<a href="http://www.yourlink.com">Clicky Visit Link</a>'>image #1</a>
63
64
65 Information
66 ------------
67
68 This module will include the lightbox CSS and JS files in your Drupal Installation without the need to edit the theme. The module comes with a Lightbox2 Lite option which does not use the Scriptaculous/Prototype libraries; it is therefore less likely to conflict with anything else. 
69
70 Known Issues:
71 -------------
72
73 Image Issues - An issue has been identified with the loading of certain images when using the module. (close.gif, prev.gif, next.gif)
74
75 If your installation of Drupal exists in the root of your domain, i.e., www.yourinstallation.com then you shouldn't have any problems. The issue only occurs when Drupal is installed in a subdirectory, i.e., www.yourinstallation.com/subdirectory.
76
77 If this is the case, you will need to edit the lightbox.js on lines 63, 64 and 65 to reflect the fully qualified URL of your images. In the above case, this would be as follows;
78
79 var fileLoadingImage = "/modules/lightbox2/images/loading.gif";
80 var fileBottomNavCloseImage = "/modules/lightbox2/images/closelabel.gif";
81 var fileBottomNavZoomImage = "/modules/lightbox2/images/expand.gif"; //Update to 2.02+
82
83 should be changed to
84
85 var fileLoadingImage = "/subdirectory/modules/lightbox2/images/loading.gif";
86 var fileBottomNavCloseImage = "/subdirectory/modules/lightbox2/images/closelabel.gif";
87 var fileBottomNavZoomImage = "/subdirectory/modules/lightbox2/images/expand.gif"; //Update to 2.02+
88
89 There may be other methods that can be used to acheive this, but this should be the simplest for those with little or no programming experience. If you choose to use Lightbox2 Lite option, then you will no to edit the lightbox_lite.js file in a similar manner.
90