Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #7089

    Hey Dude/Chris

    A couple of questions about the Prettyphoto Lightbox.

    1. How can I turn off the thumbnails displayed over the main image in the lightbox?

    2. Is it possible to remove the expand button? It looks very similar to the close button. I’d rather get rid of it altogether.

    3. Is there a simple way to edit the overall design of the lightbox? It seems to have a few different styles built into it, but I don’t know how to change to a new one (eg square corners instead of rounded).

    Thanks again!

    rich

    #56568

    Hey,

    You can change the lightbox settings in js/avia.js. Open up the file and search for following line:

    elements.prettyPhoto({ "theme": 'premium_photo', 'slideshow': 5000 }); /* facebook /light_rounded / dark_rounded / light_square / dark_square */

    1) You can replace “premium_photo” with other skins like “facebook”, “light_rounded”, etc.

    2) You can remove the thumbnail gallery by adding: overlay_gallery: false – the code would look like:

    elements.prettyPhoto({ "theme": 'premium_photo', 'overlay_gallery': false, 'slideshow': 5000 }); /* facebook /light_rounded / dark_rounded / light_square / dark_square */

    3) You can add allow_resize: false to disable the resize feature. The code would look like:

    elements.prettyPhoto({ "theme": 'premium_photo', 'overlay_gallery': false, 'allow_resize': true, 'slideshow': 5000 }); /* facebook /light_rounded / dark_rounded / light_square / dark_square */

    #56569

    Thanks Dude. I had to remove the expand button with some css in the end. The allow-resize: false command doesn’t keep large images contained within the browser window.

    One other thing – I need to open a video in the lightbox. How do I create an html hyperlink to do that?

    Also, is there a way to make the featured images that open embedded videos in a slideshow window, open them in the light box instead?

    Thanks

    #56570

    Sample codes for all supported servives/video formats can be found here: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/ (scroll down to the demo section).

    2) I’m not sure but I think you can use the “Link manually” option and enter a youtube/vimeo video url there. Shoutbox will automatically apply the lightbox effect to it.

    #56571

    That’s what I was looking for!

    Thanks a lot Dude!

    :O)

    Oh wait, one last thing, sorry! How do I get rid of the “undefined” description in the lighbox? What do I have to add to the hyperlink to give the video a title in the lightbox (or remove it completely)?

    #56572

    I think I found it here:

    http://forums.no-margin-for-errors.com/discussion/454

    You have to add rel=”prettyPhoto[inline]” and then title=”Title goes here”.

    Is that right? Seems to work …

    #56573

    You can hide the description with:

    .pp_description {

    display: none !important;

    }

    You can see the complete link structure at the demo page – it’s a bit confusing:

    <a href="images/fullscreen/2.jpg" rel="prettyPhoto" title="This is the description"><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="This is the title" /></a>

    Basically the link title is used as description and the image alt tag as title xD.

Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘Editing the Lightbox’ is closed to new replies.