Adding jquery and thickbox to wordpress theme

Question

I would like to add thickbox for the template which I develop to wordpres. At this time I'm trying with a clean template that have only header.php footer.php index.php and functions.php I've included the <?php wp_head(); ?> into header.php and the <?php wp_footer(); ?> into footer.php

I've included the wp_head like this:

<?php
wp_enqueue_script('jquery');
wp_enqueue_script('thickbox');
wp_enqueue_style('thickbox');
wp_head();
?>

I've changed the gallery link classes to thickbox with this code in functions.php

<?php add_filter( 'wp_get_attachment_link', 'sant_prettyadd');

function sant_prettyadd ($content) {
    $content = preg_replace("/<a/","<a class=\"thickbox[slides]\"",$content,1);
    return $content;
}
?>

When I'm clicking on to a gallery image it should open with thickbox but it opens the imagefile only...

I would be very greatful if someone could help what did I do wrong. I have to finish with this site on this week and this is the last

Answer 1

You need to use the wp_enqueue_script function (in your functions.php file) to call the relevant scripts you need. It allows for both built-in libraries and to add any custom that you're including in your theme.

Answer 2

All you need to do is a simple call in your functions.php:

add_action( 'wp_enqueue_scripts', 'add_thickbox' );

That’s it. WordPress will now enqueue jQuery and the thickbox script. By default, linked images aren’t thickboxy yet. You need to:

1. Add a class thickbox to the links manually/per PHP, or
2. Use a second script to add these classes automagically.

Sample code for footer.php:

<script>
jQuery('a img.size-medium').parent().addClass('thickbox').attr('rel', 'page');
</script>
<?php
wp_footer();

This code adds the class thickbox to all links around medium sized images, and it groups these links to enable the next/prev navigation links.

Now you get a basic thickbox with translated navigation links:

Since this is a script managed by the core it is not keyboard user friendly: The arrow keys don’t do anything. If you need a more usable solution – take a plugin.

Another note: Thickbox may be removed sooner or later from the core. See Ticket 10955.