Torn Elements » WordPress http://www.tornelements.com Larry Monte - Regaining the passion for design Wed, 05 May 2010 22:56:08 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 WordPress 2.7 – With Built In LightBox! http://www.tornelements.com/2009/01/07/wordpress-27-with-built-in-lightbox/ http://www.tornelements.com/2009/01/07/wordpress-27-with-built-in-lightbox/#comments Wed, 07 Jan 2009 16:13:39 +0000 Larry Monte http://www.tornelements.com/2009/01/07/wordpress-27-with-built-in-lightbox/ wordPress With three short lines of code in your theme’s header.php file, you can instantly have lightbox capabilities on your WordPress 2.7 Blog.

In case you haven’t poked around the backend since your upgrade to Wordpress 2.7, this version includes the ThickBox Script for previewing and selecting themes. (Or was this in 2.6 also? Can’t remember.) If the code to do this is already there, then why not use it on the front end too?

Here is all you need to do:

Go to your theme directory and load ‘header.php’ into your editor. Add the following three lines within the <head> </head> tags:

<script type="text/javascript" src="wp-includes/js/jquery/jquery.js"></script>

<script type="text/javascript" src="wp-includes/js/thickbox/thickbox.js">
</script>

<style type="text/css" media="all">
@import "wp-includes/js/thickbox/thickbox.css";</style>

Save/Upload the changes. That’s it! You’re now ready to use ThickBox on the front end.

You only need to add a couple extra parameters to your links to get it to work.

<a href="license.txt?height=600&width=800" title="WordPress – License.txt" class="thickbox">CLICK HERE FOR EXAMPLE</a>

In this example, I’m displaying a text document (the WordPress License) within a scrollable window. Appending ‘?height=600&width=800’ to the link defines the size of the lightbox. The class="thickbox” completes the job.

CLICK HERE FOR EXAMPLE (Note: May not work within all news readers – visit the site)

Works for images too! More options for using ThickBox, can be found here. Just ignore the download and install instructions as that’s already been done by WordPress. :)

I just stumbled onto this and thought I would share.

]]> http://www.tornelements.com/2009/01/07/wordpress-27-with-built-in-lightbox/feed/ 5