From Tired Guy MusingsSubscribe Now

Lightbox a PDF Document

I don’t usually cover this type of topic here on Tired.  Today I’m making and exception.   Recently I’ve had several clients with the need to lightbox documents on their website.

The best document type for doing this is PDF, since most people have a browser that can open PDF files.

Lightboxing a document means opening it in a window that appears in front of your site and keeps the visitor on the page instead of taking them to another url to view the document.

Lightbox PDF

Test PDF

Tucson Real Estate

Above are three examples of how this works using a WordPress Plugin called Lightbox Plus
Two are PDF documents on different sites and one is a website itself.

Briefly here is the setup:

  1. Enable the Lightbox Plus Plugin
  2. Go to the plugins page to lightbox plus and click on Settings
  3. Enable the secondary lightbox check box Save
  4. Scroll down to the secondary lightbox area and on the Other tab
    Check Iframe, check Class (I set this to PDF)  Save
  5. On the Tab Size set your window settings to your desired settings
  6. On the General LD styles tab at the top select your Look, I prefer Black
  7. Finally set the link class to PDF

Setting the link class looks like this from the Text or HTML tab in WP.  <a class=”PDF” href  etc.

If for some reason this doesn’t work on your site 99% of the time there is a plugin conflict.

If you need/want to lightbox a PDF or any other link including a link to another site you can do this with Lightbox Plus

Pin It