How to use WP Pointer ToolTip in WordPress 3.3

With WordPress 3.3 the new ToolTip called “WP Pointer” comes to point new features of WordPress. I was thinking, this tooltip will be nice to implement with my plugins to direct users step by step pointing and explaining each features. So I started looking for the api to implement it. Actually I got nothing to help me out there, So I back to wp-admin again and started digging inside and WOW, I got the way to implement it.You just need to follow the steps here:

Include css file for wp-pointer :

wp_enqueue_style(‘wp-pointer’);

Include javascript files for wp-pointer :

wp_enqueue_script(‘wp-pointer’);

Finally add js code to show wp pointer:

function  add_js_code(){

?><script>
jQuery(document).ready( function($) {
var options = {“content”:”<h3>Title<\/h3><p>Contents<\/p>”,”position”:{“edge”:”left”,”align”:”center”}};
if ( ! options )
return;
options = $.extend( options, {
close: function() {
//to do
}
});
$(‘#id’).pointer( options ).pointer(“open”);
});

</script>

<?php

}

add_action(“admin_footer”,”add_js_code”);

That’s all. Let try now…


Post Tags


About The Author


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> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>