In this theme, we used prettyPhoto as a script to display content in a popup window. It is a jQuery lightbox clone. Not only does it support images, it also support for videos, flash, YouTube, iframes and ajax.
Full list of supported media formats and more information about this powerful plugin you find on plugin home site
In OpenSpace theme is also built-in LightBox shortcode allows you to easily place any type of content without any programming knowledge.Below some examples of usage and syntax
Single Image
Get Code
[lightbox title="Sample Caption for Sample Image" thumb="http://www.dynamicpress.eu/democontent/cameleon/small-4.jpg"]http://www.dynamicpress.eu/democontent/cameleon/big-4.jpg[/lightbox]
Image Group
Get Code
[lightbox title="Sample Caption for Sample Image 1" album="demo" thumb="http://www.dynamicpress.eu/democontent/cameleon/small-4.jpg"]http://www.dynamicpress.eu/democontent/cameleon/big-4.jpg[/lightbox]
[lightbox title="Sample Caption for Sample Image 2" album="demo" thumb="http://www.dynamicpress.eu/democontent/cameleon/small-5.jpg"]http://www.dynamicpress.eu/democontent/cameleon/big-5.jpg[/lightbox]
[lightbox title="Sample Caption for Sample Image 3" album="demo" thumb="http://www.dynamicpress.eu/democontent/cameleon/small-6.jpg"]http://www.dynamicpress.eu/democontent/cameleon/big-6.jpg[/lightbox]
Image (text instead of thumbnail)
This demo will load a image and use text instead of a thumbnail”.
Lightbox link with no ThumbnailGet Code
[lightbox title="Sample Caption for Sample Image" text="Lightbox link with no Thumbnail"]http://www.dynamicpress.eu/democontent/cameleon/big-4.jpg[/lightbox]
SWF File
This demo will load a simple flash movie (.swf) file.
This demo simply load a .swf file but queries works the same (i.e. “myfile.swf?bgcolor=true&color=ffffff”). |
Get Code
[lightbox title="Envato Logo's flash movie" width="280" height="140" thumb="http://www.dynamicpress.eu/democontent/cameleon/flash.png"]http://www.dynamicpress.eu/democontent/cameleon/sample.swf[/lightbox]
Video – YouTube
This demo will load a YouTube movie.
YouTube links must be the same as you get from within the URI bar. You can pass all the options to the URI (ie, &hd=1&autoplay=1). For our demo we’re going to use this link: http://www.youtube.com/watch?v=6RWQz0Q7_zY |
Get Code
[lightbox title="Old Nike spot in the cage" thumb="http://www.dynamicpress.eu/democontent/cameleon/youtube.jpg"]http://www.youtube.com/watch?v=e0MBxEAv-30&autoplay=1[/lightbox]
Video – YouTube HQ
Get Code
[lightbox title="YouTube High Quality :: Where the Hell is Matt?" thumb="http://www.dynamicpress.eu/democontent/cameleon/youtube-hq.jpg"]http://www.youtube.com/watch?v=zlfKdbWwruY[/lightbox]
Video – Vimeo
This demo will load a Vimeo movie.
Get Code
[lightbox title="The Artist" thumb="http://www.dynamicpress.eu/democontent/openspace/artist.jpg"]http://vimeo.com/33670490[/lightbox]
Remote Site
This demo will loads an external site, in our case Theme Forest home page.
Get Code
<a title=”Themeforest site opened at 100%” href=”http://www.themeforest.net?iframe=true&width=100%&height=100%” rel=”dp_lightbox”><img src=”http://www.dynamicpress.eu/democontent/openspace/themeforest.jpg” alt=”” /></a>
This demo will open PDF document.
Get Code
<a title=”Sample PDF document” href=”http://www.dynamicpress.eu/democontent/amoveo/envato.pdf?iframe=true&width=100%&height=100%” rel=”dp_lightbox”><img src=”http://www.dynamicpress.eu/democontent/openspace/pdf.png” alt=”” /></a>