Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I've recently upgraded to version 3.3.1 and noticed a nice feature that would be great for our non-Wordpress savvy clients - creating a tour of how to use Wordpress.

I've used the Yoast SEO plugin for a long time and they've added a tour feature, which when you click the next buttons it goes through the various features (see screenshot):

enter image description here

Is it possible to create a custom tour of Wordpress on how to add pages, posts etc and create our own help content to go with it.

I've got a standard set of plugins I tend to use so the tour (if possible) would need to jump through both the standard Wordpress setup as well as all the different plugins.

UPDATE:

I've dug around the web and found the following code. This will create a one off pointer that you can put custom content in. The only problems are that the popup appears with every reload even when it's dismissed (is there a way to improve the usability of this?) and also it's a one off window rather than a tour.

Just use Firebug to find the div you want to attach the pointer to.

/*
    Display custom WordPress Dashboard Pointers alerts
    Usage: Modify the $pointer_content message to the message you wished displayed
*/
add_action('admin_enqueue_scripts', 'enqueue_custom_admin_scripts');

function enqueue_custom_admin_scripts() {
    wp_enqueue_style('wp-pointer');
    wp_enqueue_script('wp-pointer');
    add_action('admin_print_footer_scripts', 'custom_print_footer_scripts' );
}
function custom_print_footer_scripts() {
    $pointer_content = '<h3>The Works http://www.teamworksdesign.com</h3>';
    $pointer_content .= '<p>Welcome to your custom WordPress installation. Please navigate to the settings page to change your site preferences</p>';
?>
   <script type="text/javascript">
   //<![CDATA[
   jQuery(document).ready( function($) {
    $('#menu-posts-events').pointer({
        content: '<?php echo $pointer_content; ?>',
        position: 'left',
        close: function() {
            // This function is fired when you click the close button
        }
      }).pointer('open');
   });
   //]]>
   </script>
<?php
}
share|improve this question
add comment

4 Answers

up vote 4 down vote accepted

If you look at this plugin I wrote as a demonstration on using pointers, you will see how to create them and have them close correctly:

https://github.com/Tarendai/WP-Pointer-Pointers

This plugin creates 'pointer pointers':

enter image description here

share|improve this answer
add comment

WordPress Pointers API is for core use only, some thing might be changed in API and that can cause your plugin site break or errors. You should avoid using then until API will be standardized and ready for plugin/theme use.

Konstantin Kovshenin wrote great introductory post about Pointers, that you might find interesting to read. Introducing Pointers in WordPress 3.3

share|improve this answer
add comment

Mark Jarquith has written a plugin, called WP-Help.

From it's description:

Administrators can create detailed, hierarchical documentation for the site's authors and editors, viewable in the WordPress admin. Powered by Custom Post Types, you get all the power of WordPress to create, edit, and arrange your documentation. Perfect for customized client sites. Never send another "here's how to use your site" e-mail again!

Combine that with a service like screenr or some YouTube WP how-to tutorials, you can bring an easy guid & tour to your users.

share|improve this answer
add comment

Make an option add_option() with a bool (false). At the begin if the option is false else show the tour. And at the end of the tour set the option to true, So it won't show again.

If possible set an ajax event when the dismiss is clicked to set the option to false.

Let me know if you get it running (or not)

pointers:

share|improve this answer
    
Thanks Jan, I wouldn't know where to start with that! Any chance of a code example? –  Rob Mar 22 '12 at 15:50
    
@Rob added pointers you can use, I don't have any own code ready –  janw Mar 23 '12 at 9:26
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.