post

Using ThickBox with a Hyperlink on a WordPress Post or Page

Thickbox ExampleThere are quite a few default scripts installed along with WordPress including Scriptaculous, jQuery and ThickBox to name just a few. For a recent job, I needed to include a popup of member details, driven off of a dynamically created hyperlink. As I searched WordPress.org for a solution, I came across a Function Reference for the wp_enqueue_script. I was intrigued to learn that ThickBox was delivered with WordPress, so I started looking for ThickBox related plugins. There are many of them, but I couldn’t find any that worked through dynamic hyperlinks. They all seemed to use short codes in posts or pages.

Using ThickBox with dynamic hyperlinks is actually very simple. It’s so simple, it’s easier than installing a plugin. It requires modifying your theme’s functions.php file. To do this, open functions.php in the theme editor and add the following code at the bottom of the file:

  1.  
  2. function add_themescript()
  3.    {
  4.       if(!is_admin())
  5.          {    wp_enqueue_script('jquery');
  6.               wp_enqueue_script('thickbox',null,array('jquery'));
  7.               wp_enqueue_style('thickbox.css', '/'.WPINC.'/js/thickbox/thickbox.css', null, '1.0');
  8.          }
  9.    }
  10. add_action('init','add_themescript');
 
function add_themescript()
   {
      if(!is_admin())
         {    wp_enqueue_script('jquery');
              wp_enqueue_script('thickbox',null,array('jquery'));
              wp_enqueue_style('thickbox.css', '/'.WPINC.'/js/thickbox/thickbox.css', null, '1.0');
         }
   }
add_action('init','add_themescript');

Save the file and you’re done. Next, when you construct your hyperlink, include a class=’thickbox’ in the declaration.


<a class="thickbox" title="Popup Title" href="http://www.your-url.org/displaycode.php?id=5&height=300&width=400">Link Text</a>

To understand how the displaycode.php program works, see Raising the WP eMember Public Directory Bar to the Next Level.

VictorFont.com runs on the Genesis Framework

Genesis FrameworkThe Genesis Framework empowers you to quickly and easily build incredible websites with WordPress. Genesis provides the secure and search-engine-optimized foundation that takes WordPress to places you never thought it could go.

Check out the incredible features and the selection of designs. It's that simple—start using Genesis now!

Click here to download The Genesis Guide for Absolute Beginners (PDF - 1.4 MB)

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code lang=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" extra="">

Current ye@r *