在管理员的“屏幕选项”和“帮助”旁边添加我自己的按钮

时间:2011-08-14 作者:agileapricot

我想在这两个按钮旁边添加我自己的按钮链接。这可能吗?

enter image description here

4 个回复
SO网友:Ralf912

HTML

echo \'<div id="screen-meta-links">\';
echo \' <div id="contextual-help-link-wrap" class="hide-if-no-js screen-meta-toggle">\';
echo \'  <a href="#" id="your-own-button" class="show-settings">Text for your button</a>\';
echo \' </div>\';
echo \'</div>\';
echo \'<br style="clera:both" />\';

echo \'<div id="your-button-content" class="your-button-hide">\';
// your content goes here
echo \'</div>\';
您需要一些自定义JavaScript

jQuery(document).ready( function($){

$( \'.your-button-hide\' ).each(
  function(e){
    $( this ).hide();
  }
);

$( \'#your-own-button\' ).click(
  function( e ){
    e.preventDefault();

    $( \'#your-button-content\' ).toggle();

    var hasclass = $( \'#your-own-button\' ).hasClass( \'screen-meta-active\' );
    if( hasclass ){
      $( \'#your-own-button\' ).removeClass( \'screen-meta-active\' );
    } else {
      $( \'#your-own-button\' ).addClass( \'screen-meta-active\' );
    }
  }
);

});
HTML部分添加按钮,JavaScript添加功能。

完整的代码可能如下所示:

add_action( \'admin_menu\', \'register_backendpage\', 10, 0 );

function register_backendpage() {
  $pagehook = add_management_page(
    \'Your backend page\',
    \'Your backend page\',
    \'manage_options\',
    \'a-menu-slug-of-your-choice\',
    \'backendpage_callback\',
    false,
    \'bottom\'
  );

  add_action( \'load-\' . $pagehook, \'enqueue_button_script\', 10, 0 );
}

function backendpage_callback() {

    // output your button here, see code above

    echo \'<div class="wrap">\';
    /*
     * the rest of your page content
     */
}

function enqueue_button_script() {
    // the js above
    wp_enqueue_script( \'your-button-script\', ... );
}

SO网友:gdaniel

不知道为什么这个问题这么快就被驳回了。这实际上是一个有效的问题,如果能够在上面添加一个按钮,甚至编辑每个屏幕选项的内容,那将非常有用。

我知道这是个老问题,但是。。。

如果你想在上面添加一个按钮,可以链接到其他地方。您可以添加一些jQuery来添加按钮。

jQuery("#screen-meta-links").append(\'<div id="contextual-help-link-wrap" class="hide-if-no-js screen-meta-toggle" style=""><a href="link.html" id="contextual-help-link" class="show-settings">My New Button</a></div>\');
现在,如果您真的希望该按钮以与其他按钮相同的方式工作,那么您需要深入查看管理文件。

您要查找的文件是:

wordpress\\wp admin\\includes\\screen。php

SO网友:realmag777

我已经为添加您自己的此类按钮编写了一个简单而精确的干净解决方案:

class TmMS_Controller extends TmMS {

    //...

    public function init() {
        //...            
        add_action(\'admin_footer\', array(&$this, \'admin_footer\'));
        // ...
    }



    public function admin_footer() {
    if (empty($_GET) OR (isset($_GET[\'post_type\']) AND $_GET[\'post_type\'] == \'post\')) {
        if ($_SERVER[\'SCRIPT_URI\'] == admin_url(\'edit.php\')) {
            ?>
            <script type="text/javascript">
                jQuery(function() {
                    jQuery(\'#screen-meta-links\').append(\'<div class="hide-if-no-js screen-meta-toggle" id="mail-subscriber-options-link-wrap" style=""><a aria-expanded="false" aria-controls="screen-options-wrap" class="show-settings" id="mail-subscriber-settings-link" href="#mail-subscriber-options-wrap">Newsplus</a></div>\');
                    var mail_subscriber_options_wrap = jQuery(\'#mail_subscriber_options\').html();
                    jQuery(\'#mail_subscriber_options\').remove();
                    jQuery(\'#screen-meta\').append(mail_subscriber_options_wrap);
                });

            </script>
            <?php
            $this->draw_prepared_posts_content();
        }
    }
}

    public function draw_prepared_posts_content() {
        $data = array();

        echo $this->draw_html(\'admin/prepared_posts_content\', $data);
    }

    // ...

}

$tm_ms_controller = new TmMS_Controller();
add_action(\'init\', array(&$tm_ms_controller, \'init\'), 1, 999);
在某处添加css说明:

#mail-subscriber-options-link-wrap {
float: right;
height: 23px;
padding: 0;
margin: 0 0 0 6px;
font-family: sans-serif;
}

#mail-subscriber-options-link-wrap {
    -webkit-border-bottom-left-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

/* screen options and help tabs */
#mail-subscriber-options-link-wrap {
    border-right: 1px solid #d1e5ee;
    border-left: 1px solid #d1e5ee;
    border-bottom: 1px solid #d1e5ee;
    background: #eff8ff;
    background-image: -webkit-gradient(linear, left bottom, left top, from(#def1ff), to(#eff8ff));
    background-image: -webkit-linear-gradient(bottom, #def1ff, #eff8ff);
    background-image:    -moz-linear-gradient(bottom, #def1ff, #eff8ff);
    background-image:      -o-linear-gradient(bottom, #def1ff, #eff8ff);
    background-image: linear-gradient(to top, #def1ff, #eff8ff);
}

#mail-subscriber-options-posts{
    padding: 0;
    margin: 0;
}
屏幕:Result of script workingcode architecturefunction to generate html

SO网友:scribu

这可能吗?

没有一些JavaScript就不行。

有可能吗?

这两个选项卡将转换为WP 3.3中管理栏中的菜单。看看测试版。

结束

相关推荐

Admin area 'toggle' w/ cookie

wordpress管理员已经在菜单和元数据库上使用了某种切换。。w/“点击切换”按钮,可记住打开与关闭状态。有人知道什么代码应该对此负责吗?我想将其实现到我的自定义Metabox的各个部分中,当WP默认具有此功能时,我似乎不需要向管理区域添加脚本(b/c它已经很慢了)。