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

Helen Hou-Sandi helen.y.hou at gmail.com
Thu May 19 19:50:54 UTC 2011


Dino - I could probably reverse engineer it from your plugin (which looks
great, BTW), but since there seem to be others interested in this same
topic, it might be worth sharing an example publicly if you are comfortable
doing so.

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



On Thu, May 19, 2011 at 3:19 PM, Dino Termini <dino at duechiacchiere.it>wrote:

> I just finished implementing this feature in my plugin (wp slimstat) and it
> works like a charm. Should I post an example here on the list?Or maybe a
> private message would be better?
>
> Thanks again Helen
>
> Dino
>
> On May 19, 2011, at 11:25 AM, Christopher Ross <cross at thisismyurl.com>
> wrote:
>
> > thanks Helen, this is wonderful!
> >
> > On 2011-05-18, at 11:02 AM, Helen Hou-Sandi wrote:
> >
> >> 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
> >>>
> >> _______________________________________________
> >> wp-hackers mailing list
> >> wp-hackers at lists.automattic.com
> >> http://lists.automattic.com/mailman/listinfo/wp-hackers
> >
> >
> >
> > __
> >
> > Christopher Ross
> > Online Portfolio - http://christopherross.ca
> > Personal Blog - http://thisismyurl.com
> >
> > Fredericton - 506.238.4661
> > San Diego   - 858.201.4912
> >
> > _______________________________________________
> > 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