Lightbox - remove "click here" link and replace with image title

amhoffmaster · **Joined:** Sat Jan 03, 2009 5:05 pm **Posts:** 114

I've implemented the lightbox module (by Lokesh Dhakar) and it works fine. I'm using the tinyMCE editor.

The problem is that I can't figure out how to remove the "click here to save a version of this image" link and having the actual title of the image display in that spot.

Here's the page: http://www.bethel.nurelm.com/index.php?page=coffeecakes

I'm sure it's a simple fix, but I can't seem to find anything on the forums about it.

Thanks.

Peciura · **Posted:** Tue Dec 22, 2009 2:44 pm

1. Note, after this small hack don't expect any support from module developer.
2. Back up "/modules/LightBox/js/lightbox.js"
3. Locate function "updateDetails". It is on line 512 in LightBox revision 12 (the same as yours).
Modified function replaces link text "Click here to save a version of this image" with value of LightBox "title" attribute if available. Also it does not show picture title in it's default place.

Code:

   updateDetails: function() {
   
      // if caption is not null
      
      download_text = 'Click here to save a version of this image';
      if(imageArray[activeImage][1]){
      //   Element.show('caption');
      //   Element.setInnerHTML( 'caption', imageArray[activeImage][1]);
         download_text = imageArray[activeImage][1];
      }
      
      // if image is part of set display 'Image x of x' 
      if((imageArray.length > 1) || (saveImage == true)){
         Element.show('numberDisplay');
      Element.setInnerHTML( 'numberDisplay', "Image " + eval(activeImage + 1) + " of " + imageArray.length + "<br><a target=_blank href=" + imageArray[activeImage][0] + ">" + download_text + "</a>");;
         //Element.setInnerHTML( 'numberDisplay', "Image " + eval(activeImage + 1) + " of " + imageArray.length);
      }

      new Effect.Parallel(
         [ new Effect.SlideDown( 'imageDataContainer', { sync: true, duration: resizeDuration, from: 0.0, to: 1.0 }), 
           new Effect.Appear('imageDataContainer', { sync: true, duration: resizeDuration }) ], 
         { duration: resizeDuration, afterFinish: function() {
            // update overlay size and update nav
            var arrayPageSize = getPageSize();
            Element.setHeight('overlay', arrayPageSize[1]);
            myLightbox.updateNav();
            }
         } 
      );
   },

amhoffmaster · **Joined:** Sat Jan 03, 2009 5:05 pm **Posts:** 114

Hi There,

Thanks for the direction on this. Just one more thing...I don't want there to be a link at all. The object isn't to have people download the photo...just see the title.

Any way to remove the link entirely?

calguy1000 · **Posted:** Thu Jan 28, 2010 5:16 pm

I don't suggest using the LightBox module for any further development.... fancybox addon to jquery is so much more powerful and easy to work with

Dr.CSS · **Posted:** Thu Jan 28, 2010 10:51 pm

I believe the call to not have a link is one of the variables you can set in the JS call...

amhoffmaster · **Joined:** Sat Jan 03, 2009 5:05 pm **Posts:** 114

Where might I find that call in the js? I'm not a programmer so you'll have to spell it out for me. The link is only thing I don't like about this method of enlarging the photos.

Dr.CSS · **Posted:** Tue Feb 09, 2010 3:50 pm

The link in first post is "page not found" I would have to see it to tell you how or if you can add the variable...

amhoffmaster · **Joined:** Sat Jan 03, 2009 5:05 pm **Posts:** 114

Sorry, content is being added and the customer is testing quite a few features.

Here's a new link: http://www.bethel.nurelm.com/index.php? ... ee-cakes-2

Notice that when you click on the image, there's a brief description of the product...the link on the description is what I want to remove.

Dr.CSS · **Posted:** Wed Feb 17, 2010 5:19 pm

Most likely what is happening, since you are using tiny to do this is, a quote from the lightbox site,...

Can I insert links in the caption?
Yes, but you need to convert quotes and greater and less than symbols into their html entity equivalents. For example:
Image

I bet if you turn off tiny you will see the < > turned into those < > like above...

kazuking · **Joined:** Thu Mar 04, 2010 10:01 pm **Posts:** 1

I had the same issue and this is how I solved it.
The file to edit is \modules\LightBox\action.js.php
Content of this PHP is what gets inserted in place of {LightBox action='js'} in the template.
It has a lot of Code but the section that matters is...

Code:

<script type="text/javascript">
var fileLoadingImage = "%smodules/LightBox/images/loading.gif";
var fileBottomNavCloseImage = "%smodules/LightBox/images/closelabel.gif";
var overlayOpacity = 0.8;
var animate = true;
var resizeSpeed = 7;
var borderSize = 10;
var imgMaxWidth=800;
var saveImage=true;
</script>

I think it's self explanatory but in this case we just change the last variable "saveImage" to false.
You can change other options such as Maximum Width, animation, opacity, etc.
I hope this helps.

amhoffmaster · **Joined:** Sat Jan 03, 2009 5:05 pm **Posts:** 114

Well setting the var saveImage=false made the link go away, but it also made the description go away.

Dr.CSS · **Posted:** Thu May 06, 2010 8:21 pm

It looks to me like your lightbox template in Album is borked, I use the same one and get no link in the pop up like you do...

Lightbox - remove "click here" link and replace with image title

Who is online