自定義 WordPress 后臺頂部工具欄菜單

WordPress 后臺頂部工具欄默認只提供了一些基礎的操作鏈接菜單。 如果想要擴展一些自定義菜單,可以通過下面的方法添加。當然,如果你不想顯示這個頂部工具欄,也可以通過 CSS 樣式強行隱藏。不過,這篇內容主要介紹擴展自定義菜單,對于隱藏頂部工具欄的方法,就不多說,可以自行搜索方法。

$wp_admin_bar

你可以通過操作 $wp_admin_bar 對象來自定義 WordPress 工具欄。


add_action( 'admin_bar_menu', 'modify_admin_bar' );
function modify_admin_bar( $wp_admin_bar ){
    //在這里修改 $wp_admin_bar;
}

node(節點)

每個菜單項都是一個節點(node),保存在 $wp_admin_bar 中名為 $nodes 的關聯數組中。

每個節點都擁有一個唯一的 ID,你可以通過查看 HTML 源代碼來找到它。

在 HTML 中,每個菜單項都有一個以 "wp-admin-bar-" 開始的 ID。比如工具欄左側的 WordPress Logo 的 ID 是 "wp-admin-bar-wp-logo":


<li id="wp-admin-bar-wp-logo" class="menupop"> … </li>

移除菜單項中 ID 的 "wp-admin-bar-" 部分,那么余下的 "wp-logo" 就是它的 ID。

節點屬性

每個節點都有這些屬性:

id 節點 ID

title 顯示在工具欄中的文本,支持 HTML 標簽

parent 父節點的 ID

href 節點的鏈接地址,如果不設置,節點會顯示為純文本

group 為節點編組,不常用

meta 設置節點的 class、onclick、target 等屬性

get_node() 你可以通過 get_node() 方法來獲取某一個節點,你必須將節點 ID 作為參數傳入。

示例

獲取工具欄中"更新"這一節點。


add_action( 'admin_bar_menu', 'check_updates_node', 999 );
function check_updates_node( $wp_admin_bar ) {
    $updates_node = $wp_admin_bar->get_node( 'updates' );
}

remove_node()

你可以通過 remove_node() 方法來移除某一個節點,你必須將節點 ID 作為參數傳入。

示例

移除工具欄中的 WordPress Logo。


add_action( 'admin_bar_menu', 'remove_wp_logo', 999 );
function remove_wp_logo( $wp_admin_bar ) {
    $wp_admin_bar->remove_node( 'wp-logo' );
}

add_node()

你可以通過 add_node() 方法來添加一個節點,參數是節點屬性組成的數組。

如果你添加的節點ID是已經存在的,WordPress 會將新參數覆蓋原來已經存在的節點參數。你也可以簡單的理解是在編輯同一 ID 的節點。

示例

修改工具欄右邊的賬戶文本,根據時間段顯示不同的問候語


add_action( 'admin_bar_menu', 'custom_account_greeting', 999 );
function custom_account_greeting( $wp_admin_bar ) {
    $my_account_node = $wp_admin_bar->get_node( 'my-account' );
    if ( $my_account_node ) {
        $hour = date( 'G', current_time( 'timestamp' ) );
        $greeting = '晚上好';
        if ( $hour >= 18 ) {
            $greeting = '晚上好';
        } elseif ( $hour >= 14 ) {
            $greeting = '下午好';
        } elseif ( $hour >= 11 ) {
            $greeting = '中午好';
        } elseif ( $hour >= 5 ) {
            $greeting = '早上好';
        };
        $args = array(
            'id'    => 'my-account',
            'title' => str_replace( '您好', $greeting, $my_account_node->title )
        );
        $wp_admin_bar->add_node( $args );
    };
}

在站點標題的菜單下,添加一個主題選項鏈接。


add_action( 'admin_bar_menu', 'minty_add_theme_options_to_admin_bar', 999 );
function minty_add_theme_options_to_admin_bar( $wp_admin_bar ) {
    $args = array(
        'id'    => 'theme-options',
        'title' => '主題選項',
        'href'  => admin_url( 'themes.php?page=theme-options.php' ),
        'parent'=> 'appearance'
    );
    $wp_admin_bar->add_node( $args );
}

在文章頁的工具欄上,添加分享菜單,可以快速分享到新浪微博、人人網和QQ空間。


add_action( 'admin_bar_menu', 'c7sky_share', 999 );
function c7sky_share( $wp_admin_bar ) {
    if ( is_single() ) {
        $title = get_the_title();
        $link = get_permalink();
        $wp_admin_bar->add_node( array(
            'id'    => 'c7sky-share',
            'title' => '分享',
            'href'  => "http://service.weibo.com/share/share.php?url={$link}&title={$title}",
            'meta'  => array( 'target' => '_blank' )
        ) );
        $wp_admin_bar->add_node( array(
            'parent'=> 'c7sky-share',
            'id'    => 'c7sky-share-weibo',
            'title' => '新浪微博',
            'href'  => "http://service.weibo.com/share/share.php?url={$link}&title={$title}",
            'meta'  => array( 'target' => '_blank' )
        ) );
        $wp_admin_bar->add_node( array(
            'parent'=> 'c7sky-share',
            'id'    => 'c7sky-share-qzone',
            'title' => 'QQ空間',
            'href'  => "http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url={$link}&title={$title}",
            'meta'  => array( 'target' => '_blank' )
        ) );
        $wp_admin_bar->add_node( array(
            'parent'=> 'c7sky-share',
            'id'    => 'c7sky-share-renren',
            'title' => '人人網',
            'href'  => "http://widget.renren.com/dialog/share?resourceUrl{$link}&title={$title}",
            'meta'  => array( 'target' => '_blank' )
        ) );
    }

    //為分享菜單添加圖標
    function minty_admin_bar_css() {
        echo '#wpadminbar #wp-admin-bar-c7sky-share>.ab-item:before { content: "\f237"; top: 2px; }';
    }
    add_theme_support( 'admin-bar', array( 'callback' => 'minty_admin_bar_css' ) );
}

本文轉自小影志:點擊這里查看原文鏈接

相關推薦

1 條評論

  1. 吳浩霖

    小影志

發表評論

微信掃一掃

微信掃一掃

微信掃一掃,分享到朋友圈

自定義 WordPress 后臺頂部工具欄菜單
返回頂部

顯示

忘記密碼?

顯示

顯示

獲取驗證碼

Close
体彩6场半全场胜负投注