Not signed in (Sign In)

Vanilla 1.1.10 is a product of Lussumo. More Information: Documentation, Community Support.

    • CommentAuthorAnnie
    • CommentTimeSep 23rd 2009
     
    Is it possible to get Lightbox1 to work by opening a larger image from the picture page and not the album page? I'd like site visitors to be able to view the large_thumbs from the standard page and click 'next' if they want. But then I'd like them to have the option of being able to click the image on the main picture page to see the larger original in the lightbox, rather than from the album.

    I haven't seen a tutorial to find out how to implement lightbox into plogger but I am familiar with the Lightbox1 in standard web pages.
    •  
      CommentAuthorsidtheduck
    • CommentTimeSep 23rd 2009
     
    You should be able to add:rel="lightbox" to the link already present in 'picture.php' in your theme file. Then you need to add the lightbox javascript lines to the 'head.php' and then have a call to initLightbox() as an onload to the body or as a standalone script tag in 'picture.php' after the large image container in 'picture.php'
    • CommentAuthorAnnie
    • CommentTimeSep 23rd 2009
     
    Are we talking about this line?

    $imgtag = '<img class="photos-large" src="'.plogger_get_picture_thumb(THUMB_LARGE).'" title="'.$capt.'" alt="'.$capt.'" />';

    I don't see an 'a' link in picture.php. I normally implement the rel="lightbox" tag like
    <a rel="lightbox" target="_blank" title="******" href="********.jpg">
    <img class="*****" src="*****thumbs/*****.jpg" width="120" height="90" alt="*********"></a>
    •  
      CommentAuthorsidtheduck
    • CommentTimeSep 23rd 2009
     
    nope, further down you should see something like this:
    print '
    <div id="picture-holder">
    <a accesskey="v" href="'.plogger_get_source_picture_url().'">'.$imgtag.'</a>
    </div>';


    Change it like so:
    print '
    <div id="picture-holder">
    <a accesskey="v" href="'.plogger_get_source_picture_url().'" rel="lightbox">'.$imgtag.'</a>
    </div>';
    • CommentAuthorAnnie
    • CommentTimeSep 23rd 2009
     
    Ah, I see. Originally I wasn't going to use a link for the largest image and I'd forgotten that I'd stripped this out of the template. I'll give this a go tomorrow.

    Cheers.
    Annie
    • CommentAuthorAnnie
    • CommentTimeSep 27th 2009
     
    Well I've got most of the lightbox working but there are one or two things which don't seem to be working correctly.

    I see the 'close' image in the top of the picture but don't get the 'loading' image. I also cannot see the background. I have tried putting the full path in just in case I wasn't linking to it correctly but it still doesn't work.

    There's one last thing - for some reason, I get a horizontal scrollbar when I click for the lightbox image and it doesn't seem to matter what screen resolution I use. This doesn't happen when I integrate lightbox on a conventional html page.

    Here is an example in my plogger gallery - http://www.hibbitt.org.uk/gallery/?level=picture&id=7
    and here's an example in my normal pages - http://www.hibbitt.org.uk/photos/geake_hellyer/photos_goldenwedding.html
    • CommentAuthorAnnie
    • CommentTimeSep 30th 2009
     
    I've managed to sort this. If anyone wants to know, the overlay id in the lightbox css and js was interfering with the same id within the default plogger theme's css. I just renamed it in the lightbox files and it now works.