如何将部分添加到菜单配置中,提供硬编码项目?

时间:2013-06-12 作者:ndm

所以,让我来解释一下我到底想做什么,也许有更好的方法来实现它。我正在处理一个主题,我希望用户能够轻松地在菜单中定位“特殊”项,以便在主题前端执行“特殊”操作,在这种情况下(除其他外),可以基于自定义分类法及其链接帖子构建嵌套菜单结构。

所以我在WordPress中想到了一个新的“部分”Appearance > Menus“配置,其中将提供一些硬编码项,如下所示:

Custom Menu Section

现在我可以想出两种方法来处理这个问题,一种是只在导航菜单中显示的自定义帖子类型,另一种是自定义元框(这似乎需要做很多工作,至少wp_nav_menu_item_post_type_meta_box() 看起来像是几个小时的反复试验)。

我想知道这两个选项中是否有一个是解决这个问题的推荐方法?

顺便说一句,我不会考虑使用wp_update_nav_menu_item() 作为一个选项,因为使用它创建的项目似乎只是位于菜单中,而没有UI,以便在删除它们时重新添加它们。因此,无论如何,这都需要一个自定义的元框,而且它会将项目直接保存到菜单中,打破“add item > save menu“从WordPress UI使用约定人。

1 个回复
最合适的回答,由SO网友:Stephen Harris 整理而成

菜单项是post类型,它们所属的菜单是分类术语。因此,创建一个post类型以获得一个元盒,从中可以添加菜单项,这似乎有点多余(有效地复制了数据库中的每个“特殊项”)。在任何情况下,设置post类型的Visibility使其仅在菜单屏幕上显示都可能很棘手。

无论如何,这是一项相当复杂的任务,所以我将在这里概述我将如何做到这一点。您可以在中看到这方面的“工作示例”this plug-in 我与Kaiser和Ryan Urban一起建造。该插件添加了一个帖子类型存档元盒,用于链接到帖子类型的存档页面。

添加元盒时,您需要挂接到admin_init 挂钩和add_meta_box() (参见codex). 该页面的屏幕ID为nav-menus

add_action( \'admin_init\', \'wpse102735_add_meta_boxe\' );
public function wpse102735_add_meta_boxe() {
    add_meta_box(
        \'wpse102735-metabox-id,
        \'My Custom Section\'
        \'wpse102735_metabox_callback\',
        \'nav-menus\',
        \'side\',
        \'low\'
    );
}
功能wpse102735_metabox_callback() 负责元数据库的内容。并且应该生成一个“特殊项目”的复选框列表,所有这些项目都有一个值/ID,您可以用它来标识该项目。(参见metabox() 上述插件中的方法,或this function 在core中,为标准帖子/页面元数据库生成HTML标记。

Javascript在上一步中,您应该添加一个“提交”按钮。您需要监听该按钮的单击时间,然后向发送自定义ajax请求ajaxurl (一个指向WordPress的ajax处理程序的全局javascript变量)。以下是框架代码:

jQuery( document ).ready( function($) {
     $( \'#my-submit-id\' ).click( function( event ) {
        event.preventDefault();

        var item_identifiers = []; 

        //Collect the IDs of the selected items and put them in $item_identifiers

        // Show spinner - you need to add this in the mark-up.
        $( \'#wpse102735-metabox-id\' ).find(\'.spinner\').show();

        // Disable button
        $(this).prop( \'disabled\', true );

        // Send checked post types with our action, and nonce
        $.post( ajaxurl, {
                action: wpse102735_add_menu_items,
                items: item_identifiers,
            },

            // AJAX returns html to add to the menu, hide spinner
            function( response ) {
                $( \'#menu-to-edit\' ).append( response );
                $( \'#wpse102735-metabox-id\').find(\'.spinner\').hide();
                $(this).prop( \'disabled\', false );
                            //Uncheck checkboxes too
            }
        );
    } );
} );
Note 我省略了上面(和下面)的nonce。您需要将这些添加到中。此外,您还需要正确注册/排队上述脚本。有关详细信息,请参阅引用的插件。

处理ajax在上面我们将操作设置为wpse102735_add_menu_items, 我们需要ajax处理程序挂钩。

 add_action( \'wp_ajax_wpse102735_add_menu_items\', \'wpse102735_ajax_handler\' );
我们的ajax处理程序将完成两件事:

使用创建菜单项wp_update_nav_menu_item() (最佳外观source / 从返回的ID中,检索菜单对象并为管理屏幕生成HTML。(在上一步中,我们将返回的HTML附加到菜单中)ajax处理程序:

add_action( \'wp_ajax_wpse102735_add_menu_items\', \'wpse102735_ajax_handler\' );
function wpse102735_ajax_handler(){

   //Perform any necessary nonce/permission checks

   $items = $_POST[\'items\']

   //For each item, set up the details for the menu item:
   foreach( $items as $item ){
      $menu_item_data= array(
         \'menu-item-title\'  => \'Item title\',
         ...
      );

      // Collect the items\' IDs.
      $item_ids[] = wp_update_nav_menu_item( 0, 0, $menu_item_data );
   }

   // If there was an error die here
   if( is_wp_error( $item_ids ) )
        die( \'-1\' );

   //Finally we want to generate mark-up to be added to the menu admin screen
   //First we set up the menu items we\'ve just created

   // Set up menu items
   foreach ( (array) $item_ids as $menu_item_id ) {
        $menu_obj = get_post( $menu_item_id );
        if ( ! empty( $menu_obj->ID ) ) {
             $menu_obj = wp_setup_nav_menu_item( $menu_obj );
             // don\'t show "(pending)" in ajax-added items
             $menu_obj->label = $menu_obj->title;
             $menu_items[] = $menu_obj;
         }
    }

    //Now generate HTML using Walker_Nav_Menu_Edit walker

    // Needed to get the Walker up and running
    require_once ABSPATH.\'wp-admin/includes/nav-menu.php\';

    // This gets the HTML to returns it to the menu
    if ( ! empty( $menu_items ) ) {
         $args = array(
              \'after\'       => \'\',
              \'before\'      => \'\',
              \'link_after\'  => \'\',
              \'link_before\' => \'\',
              \'walker\'      => new Walker_Nav_Menu_Edit
         );

          echo walk_nav_menu_tree( $menu_items, 0, (object) $args );
     }

     exit();
}
我希望这能让你走上正轨:)

结束

相关推荐

Thesis -style Navigation

我正在研究一个主题,我希望用户能够像论文一样选择要在主题选项页面中显示的页面。我已经在谷歌上搜索了几个小时的逆向工程论文,但还没有找到一个很好的解决方案。我想知道是否有人做过这件事或看过教程。