Display A Blip.tv Video In A PrettyPhoto Lightbox

Blip.tv video in a PrettyPhoto lighbox

PrettyPhoto has built in support for videos, and can already handle YouTube & Vimeo out of the box.  However on the new DAXKO Connect website, we wanted to use blip.tv to host our videos, and I figured out a way to easily show the video in a PrettyPhoto lighbox.

Here’s how you can do it, too.

1) Go to the episode dashboard on blip.tv for the video you want to show in the PrettyPhoto lightbox.

2) In the Embed section on the right, choose the player you want to use then copy the URL in the “src” parameter (not the whole <embed/> code).  It should be something like “http://blip.tv/play/xxxxxxxxx”

3) Paste the URL you copied in step into a new browser window.  It should redirect to another URL and your video should start playing.  This is the URL you’ll use for the PrettyPhoto lighbox link.  Copy the entire URL.

4) Use PrettyPhoto exactly how the docs describe, and use the link you copied in step #3 as source of the lightbox.  For our DAXKO Connect Whiteboard Video, the code looked like the following example.  (Pro Tip: Add height & width parameters to the end of the video URL to let PrettyPhoto know how to size the lightbox)