X

Add Custom Pointers in Themes and Plugins

Snippets by IsItWP

You can take advantage of a WordPress feature called “Pointers”. Pointers can be used to explain important features to users.

Instructions: Add the following code to the functions.php file of your WordPress theme.
After that you can change the pointer variables with the information that you want to show and replace ID with jQuery to assign it to the pointer.

add_action( 'admin_enqueue_scripts', 'my_admin_enqueue_scripts' );
function my_admin_enqueue_scripts() {
    wp_enqueue_style( 'wp-pointer' );
    wp_enqueue_script( 'wp-pointer' );
    add_action( 'admin_print_footer_scripts', 'my_admin_print_footer_scripts' );
}
function my_admin_print_footer_scripts() {
    $pointer_content = '<h3>wpsnipp.com | Notice</h3>';
    $pointer_content .= '<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>';
?>
   <script type="text/javascript">
   //<![CDATA[
   jQuery(document).ready( function($) {
    $('#menu-appearance').pointer({
        content: '<?php echo $pointer_content; ?>',
        position: 'left',
        close: function() {
            // Once the close button is hit
        }
      }).pointer('open');
   });
   //]]>
   </script>
<?php
}

You may also enjoy using the custom backgrounds theme feature.

Comments   Leave a Reply

  1. Hi, just wondering if this works on the front end of a website or if you know of a plugin for WordPress that allows this functionality? Thanks.

    1. No support for the front end yet… But I think it may be coming. I know my company is developing API for a front end version and we may contribute it to the core.

    2. No support for the front end yet… But I think it may be coming. I know my company is developing API for a front end version and we may contribute it to the core.

    3. No support for the front end yet… But I think it may be coming. I know my company is developing API for a front end version and we may contribute it to the core.

  2. danbodenstein May 2, 2012 at 9:39 am

    I agree, there has to be a way to only show this once. 

    1. Yes, I wish the same!

  3. Nice little function! However I noticed that even if you click “Dismiss” the notice comes back your next page. Are we missing some sort of save function to make sure it is dismissed permanently?

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

WordPress Launch Checklist

The Ultimate WordPress Launch Checklist

We've compiled all the essential checklist items for your next WordPress website launch into one handy ebook.
Yes, Send Me the Free eBook!