[wp-hackers] Drag and drop panels in plugin's page

Helen Hou-Sandi helen.y.hou at gmail.com
Wed May 18 14:02:08 UTC 2011


I hadn't gotten around to the store in DB part yet (would love to hear how
you're doing it), but this is what I've got for expand/collapse and
draggable on a custom panel (a Help/Instructions bit for a client in my
case). Don't want to guarantee everything I've done is best practice, though
:)

function yourprefix_admin_menu() {
// help page menu item
$help_page = add_dashboard_page( 'Help and Instructions', 'Help and
Instructions', 'edit_posts', 'instructions', 'yourprefix_help_page');
 add_action('load-'.$help_page, 'yourprefix_help_page_scripts');
}
add_action('admin_menu', 'yourprefix_admin_menu');

function yourprefix_help_page_scripts() {
wp_enqueue_style('dashboard');
 wp_enqueue_script('postbox');
wp_enqueue_script('dashboard');
}

// help page output
function yourprefix_help_page() {
echo '<div class="wrap">
<h2>Help and Instructions for www.yourdomain.com</h2>
 <div class="postbox-container" style="width:80%">
 <div class="metabox-holder">
<div class="meta-box-sortables">
 <div id="edit-pages" class="postbox">
<div class="handlediv" title="Click to toggle"><br /></div>
 <h3 class="hndle"><span>Editing Pages</span></h3>
<div class="inside">
 <p>This is where information about editing pages would go.</p>
</div><!-- .inside -->
 </div><!-- #edit-pages -->
 <div id="add-media" class="postbox">
 <div class="handlediv" title="Click to toggle"><br /></div>
<h3 class="hndle"><span>Adding Media</span></h3>
 <div class="inside">
<p>This is where information about adding media would go.</p>
 </div><!-- .inside -->
</div><!-- #add-media -->
 </div><!-- .meta-box-sortables -->
</div><!-- .metabox-holder -->
 </div><!-- .postbox-container -->
</div><!-- .wrap -->
 ';
}


--
Helen Hou-Sandi
http://www.helenhousandi.com



On Wed, May 18, 2011 at 9:01 AM, Andy Charrington-Wilden <
andycharrington at gmail.com> wrote:

> Checkout the classes on the widgets page. Once you enque the same scripts
> you can have it act the same way as the widgets page. I'm not at my computer
> right now but essentially you're looking for 3 things in the widgets page.
> 1. The class that defines an area where something can be dragged.
> 2. The class that defines something as draggable
> 3. The correct scripts to enque.
>
> I would really like to know how you get on. :-)
>
> Sent from my iPhone
>
> On 18 May 2011, at 13:46, Dino Termini <dino at duechiacchiere.it> wrote:
>
> > Hi all,
> >
> > one of the plugins I've developed has a layout made of small panels,
> something similar to Wordpress Dashboard. I would like to implement the same
> drag and drop feature, to move those panels around and store their position
> in the database. I've already figured out the 'store in the DB' part, but I
> can't seem to be able to leverage the existing JQuery libraries to enable
> this functionality. Any ideas on how to implement this?
> >
> > Thanks,
> > Dino.
> > _______________________________________________
> > wp-hackers mailing list
> > wp-hackers at lists.automattic.com
> > http://lists.automattic.com/mailman/listinfo/wp-hackers
> _______________________________________________
> wp-hackers mailing list
> wp-hackers at lists.automattic.com
> http://lists.automattic.com/mailman/listinfo/wp-hackers
>


More information about the wp-hackers mailing list