How to Use Video LightBox in WordPress

First off, many thanks to Video LightBox for sharing the code of their very clean, crisp video viewer. It’s quite easy to input into an html website, but as a page in WordPress, it had it’s own challenge.

You can do it on your WordPress blog. Filmmakers/Video Bloggers/CG & MotionGraphics Artists can all make use of this. The reason I chose it over just leaving it in a blog post, is this setup allows my Reels to be watched without distraction. Essentially the code dims your background (if you so choose) and brings your video(s) front in center for that important person to view.

Here’s how:

1. First I created the gallery inside of Video LightBox’s easy to use software. Find it HERE. In this case, say my Producer Reel. I tweaked all the settings and exported the files. This video shows you how to use the program:

2. I created a folder on my website ftp called “producer_reel” to hold all of it. I uploaded everything in the same file structure (even the html file, this may be redundant, but I wanted to cover all the bases just in case).

3. In the blog post itself (which is a “Page” in my theme), I copied and pasted the code from the singular .html file I created in Video LightBox. To get the code, I opened it in Microsoft Word, but you can open it in Dreamweaver or TextEdit too (whatever you’ve had more experience with).
– There is code for a head and a body. Make sure to close them too!

4. Inside the actual html code you have to input the file structure of your ftp so it can find the relevant information. THIS IS THE MOST IMPORTANT PART OR IT WON’T WORK.

Here is how my code reads in the post: Everything CAPITALIZED is what I had to add to make it work! Obviously, make sure you mimic the file structure (letter case included) so it works perfectly.

<....."stylesheet" href="PRODUCER_REEL/engine/css/videolightbox.css" type="text/css" />
<....."stylesheet" type="text/css" href="PRODUCER_REEL/engine/css/overlay-minimal.css"/>

It’s alotta work, but it is totally worth it.

GOOD LUCK! Any questions or comments, you can contact me.

Steve Long
Producer | Editor | Writer
Shoot By Daylight Productions

Leave a Reply