But there’s no need to have the bloat of Thickbox and jQuery loading on all pages when most of them don’t even use it. That’s why Joost de Valk detailed a nice tip to only load thickbox when needed by checking the page content for references to it. All it takes is a few lines of code in your functions.php file.
Unfortunately, you end up with some broken images because the built-in Thickbox defines their locations in thickbox.js as relative paths:
var tb_pathToImage = "../wp-includes/js/thickbox/loadingAnimation.gif"; var tb_closeImage = "../wp-includes/js/thickbox/tb-close.png";
Those paths get tacked onto the URL of whatever page you’re on, which results in an invalid URL and a couple 404 errors for each use. Now that’s not unique to Joost’s solution. It happens whenever Thickbox is loaded with wp_enqueue_script( ).
My theme uses multiple loops so I had to add the wp_reset_query() to be able to examine the original content. Otherwise it would be looking at the last post in my recent posts box and not see that Thickbox was used in the current content.
There you have it. A nice technique from Joost and a simple addition to complement it.