wordpress 自定义_如何自定义WordPress工具栏
wordpress 自定义
This article is part of a series created in partnership with SiteGround. Thank you for supporting the partners who make SitePoint possible.
本文是与SiteGround合作创建的系列文章的一部分。 感谢您支持使SitePoint成为可能的合作伙伴。
I have a love/hate affair with the dark grey toolbar introduced in WordPress 3.3. (It was previously named the Admin Bar in WordPress 3.1 and that name stuck for many — including the API authors!). Looking at the positives, the toolbar provides a consistent set of quick links when you’re viewing the administration panels or the live website. That said, it can cause problems when creating themes or confuse site editors who think everyone can see it.
我对WordPress 3.3中介绍的深灰色工具栏有爱又恨的事情。 (它以前在WordPress 3.1中被命名为“ 管理栏” ,这个名称对许多人来说都是棘手的- 包括API作者! )。 从正面看,当您查看管理面板或实时网站时,工具栏提供了一组一致的快速链接。 也就是说,这可能会在创建主题时引起问题,或者会使认为每个人都可以看到它的网站编辑感到困惑。
Fortunately, it’s easy to change the toolbar. We’re going to achieve it using a custom WordPress plugin, but you could also consider adding identical code to your theme’s functions.php file.
幸运的是,更改工具栏很容易。 我们将使用自定义的WordPress插件来实现它,但是您也可以考虑将相同的代码添加到主题的functions.php文件中。
WordPress Admin Bar API (The WordPress Admin Bar API)
The WP_Admin_Bar class provides the following methods:
WP_Admin_Bar类提供以下方法:
-
add_node() — creates a new menu item (or child menu item) on the toolbar
add_node() —在工具栏上创建一个新的菜单项(或子菜单项)
-
remove_node() — remove a menu item from the toolbar
remove_node() —从工具栏中删除菜单项
-
add_group() — allows toolbar items to be grouped into distinct sections
add_group() —允许将工具栏项目分组为不同的部分
-
get_node() — returns a Toolbar object with the properties of a single toolbar item.
get_node() —返回具有单个工具栏项目属性的工具栏对象。
We’re going to use add_node()
and remove_node()
in our new plugin…
我们将在新插件中使用add_node()
和remove_node()
…
创建一个新插件 (Create a New Plugin)
Create a new file in the WordPress wp-content/plugins/ folder named admin-bar.php then add the following plugin header:
在WordPress wp-content / plugins /文件夹中创建一个名为admin-bar.php的新文件,然后添加以下插件头:
<?php
/*
Plugin Name: Admin Bar
Plugin URI: https://www.sitepoint.com/
Description: Modifies the WordPress admin bar
Version: 1.0
Author: Craig Buckler
Author URI: http://twitter.com/craigbuckler
License: MIT
*/
You can now activate this plugin in the WordPress administration panel. It won’t do anything yet but you can make additions, save then refresh to view the updates.
您现在可以在WordPress管理面板中**此插件。 它什么都不会做,但是您可以添加,保存然后刷新以查看更新。
删除整个工具栏 (Remove the Entire Toolbar)
Add the following line to the plugin code to remove the toolbar:
将以下行添加到插件代码中以删除工具栏:
// remove admin bar
add_filter('show_admin_bar', '__return_false');
Save then refresh to check that it’s gone!
保存然后刷新以检查它是否消失了!
删除工具栏项 (Remove Toolbar Items)
Presuming you haven’t removed the toolbar, you can remove existing items with the remove_node() method. For this, we need to create a new function named update_adminbar()
which is passed an WP_Admin_Bar object ($wp_adminbar
). This function is called when the admin_bar_menu
action hook is activated:
假设尚未删除工具栏,则可以使用remove_node()方法删除现有项。 为此,我们需要创建一个名为update_adminbar()
的新函数,该函数将传递给WP_Admin_Bar对象( $wp_adminbar
)。 **admin_bar_menu
操作挂钩时,将调用此函数:
// update toolbar
function update_adminbar($wp_adminbar) {
// remove unnecessary items
$wp_adminbar->remove_node('wp-logo');
$wp_adminbar->remove_node('customize');
$wp_adminbar->remove_node('comments');
}
// admin_bar_menu hook
add_action('admin_bar_menu', 'update_adminbar', 999);
In this example we’re removing the:
在此示例中,我们将删除:
- the “About WordPress” menu which is rarely necessary for post editors “关于WordPress”菜单,这对于帖子编辑者几乎是不必要的
- the “Customize” theme editor, and “自定义”主题编辑器,以及
- the “Comments” link (perhaps because we’ve disabled comments). “评论”链接(可能是因为我们已禁用评论)。
Save admin-bar.php then refresh to verify it worked.
保存admin-bar.php,然后刷新以验证其是否有效。
You can remove any item by passing its ID to the remove_node()
method. The ID can be found in the HTML source:
您可以通过将其ID传递给remove_node()
方法来删除任何项目。 可以在HTML源代码中找到该ID:
Find the HTML ID then remove “wp-admin-bar-” from the start of the string to give you the toolbar menu ID name.
找到HTML ID,然后从字符串的开头删除“ wp-admin-bar-”,为您提供工具栏菜单ID名称。
添加新的工具栏项 (Add New Toolbar Items)
The add_action()
hook we called above sets a priority of 999. Any new menus we define in update_adminbar()
will appear at the right-hand end of the toolbar after all other items. You can set a lower priority to use a different position. The WordPress logo has a priority of 10 with each additional toolbar item adding another 10 to that total. Therefore, using a priority of 11 would add items to the right of the WordPress logo, e.g.
我们在上面调用的add_action()
钩子将优先级设置为999。我们在update_adminbar()
定义的任何新菜单都将出现在工具栏的所有其他项目之后的右端。 您可以设置较低的优先级以使用其他位置。 WordPress徽标的优先级为10,其他每个工具栏项的总和又为10。 因此,使用优先级11将在WordPress徽标的右侧添加项目,例如
add_action('admin_bar_menu', 'update_adminbar', 11);
We’ll leave the priority at 999 because we’re removing items which have to be added before we can remove them!
我们将优先级保留为999,因为我们正在删除必须删除的项目,然后才能删除它们!
Next, we’ll add two new menu items which link to the SitePoint home page and the SitePoint Community Forums. The add_node()
method accepts an associative array which defines a single toolbar item:
接下来,我们将添加两个新菜单项,这些菜单项链接到SitePoint主页和SitePoint社区论坛 。 add_node()
方法接受一个定义单个工具栏项的关联数组:
-
id
— the toolbar item ID (required)id
—工具栏项目ID(必填) -
title
— the toolbar item text. HTML tags are also permitted.title
工具栏项目文本。 也允许使用HTML标签。 -
parent
— the ID of the parent node (if the item is part of a sub-menu)parent
—父节点的ID(如果该项是子菜单的一部分) -
href
— the linkhref
attributehref
—链接href
属性 -
group
— makes the node a group (boolean). Group nodes are not visible in the toolbar, but nodes added to it are.group
—将节点设为一个组(布尔值)。 组节点在工具栏中不可见,但添加到其中的节点却可见。 -
meta
— an array of further link attributes:class
,rel
,onclick
,target
,title
andtabindex
. A specialhtml
value can set the HTML used for the node.meta
—其他链接属性的数组:class
,rel
,onclick
,target
,title
和tabindex
。 特殊的html
值可以设置用于节点HTML。
We can therefore add the SitePoint main menu and Forum sub-menu item in our plugin’s update_adminbar()
function:
因此,我们可以在插件的update_adminbar()
函数中添加SitePoint主菜单和Forum子菜单项:
// update toolbar
function update_adminbar($wp_adminbar) {
// remove unnecessary items
$wp_adminbar->remove_node('wp-logo');
$wp_adminbar->remove_node('customize');
$wp_adminbar->remove_node('comments');
// add SitePoint menu item
$wp_adminbar->add_node([
'id' => 'sitepoint',
'title' => 'SitePoint',
'href' => 'https://www.sitepoint.com/',
'meta' => [
'target' => 'sitepoint'
]
]);
// add Forum sub-menu item
$wp_adminbar->add_node([
'id' => 'spforum',
'title' => 'Forum',
'parent' => 'sitepoint',
'href' => 'https://www.sitepoint.com/community/',
'meta' => [
'target' => 'sitepoint'
]
]);
}
// admin_bar_menu hook
add_action('admin_bar_menu', 'update_adminbar', 999);
Note: []
declares an array in PHP 5.4 and above. If you’re using a previous version, replace it with array()
.
注意: []
在PHP 5.4及更高版本中声明了一个数组。 如果您使用的是以前的版本,请用array()
替换它。
Save admin-bar.php then refresh to see the new toolbar:
保存admin-bar.php,然后刷新以查看新的工具栏:
You should now be able to create the perfect WordPress toolbar for every project!
您现在应该能够为每个项目创建完美的WordPress工具栏!
wordpress 自定义
下一篇: 73. 矩阵置零