How do I include a JavaScript library without using a module? Note: I'm very new at using Drupal, so I may be missing something.

I've searched high and low, but I can't seem to find an answer to this.

I've got a custom Drupal theme based on Zen, and I want to include a jQuery plugin (specifically, Lightbox) into a page that needs it (I'm using Panels and Views to create custom landing pages). Frankly, I'd be happy even if I had to include it on the entire site.

I looked at JavaScript Libraries Manager, jQuery Plugins Module, but these didn't seem to be able to include CSS or images, which Lightbox requires.

I tried placed the script and CSS/image files in my theme's folder, and then using the following in mytheme_preprocess_page() in my theme's template.php:

$options = array('group' =&gt; JS_THEME);
drupal_add_js(drupal_get_path('theme', 'mytheme') . "/js/jquery.lightbox.js', $options);


This loads the JavaScript file OK, but it doesn't function correctly because it's looking for the images at the web root / (and I didn't include the CSS file, anyway).

I saw an example of using hook_library(), and this looks promising as it allows specification of CSS files as well, but I'm not sure where/how to include this setup code.

Also, I realize that there is a Lightbox module, but because the way that my content types and views are done, I can't add rel="lightbox" to the anchors...
It doesn't sound like you need to hook the theme system or deploy a module, why not try including the paths to Light Box's dependencies in one or more of your template files?

Better yet add the CSS and JS file paths (relative to the theme folder) to your theme's info file.

Stylesheets

Scripts