WordPress 在后台管理菜单中使用Dashicons图标

主题或插件开发者,也应该与时俱进,今天就简单说说如何在后台管理菜单中使用Dashicons图标。

关于 Dashicons

Dashicons 是一个开源的字体图标项目,目前托管于 GitHub,目前主要用于 WordPress 后台,当然, 你也可以在自己的主题或插件中使用。更多的介绍,请访问http://melchoyce.github.io/dashicons/。你可以点击任何一个图标,然后就可以获取它对应的 HTML、CSS 或 Glyph 调用方法。

在菜单中使用 Dashicons

1.在自定义文章类型中使用 Dashicons

下面我们简单说说如何在自定义文章类型(custom post type)中使用Dashicons。我们注册了一个 Slides 类型,然后使用 ‘dashicons-images-alt2’ 作为菜单的图标:

register_post_type(‘slides‘,
    array(
        ‘labels‘ => array(
            ‘name‘ => ‘Slides‘,
            ‘singular_name‘ => ‘Slide‘
            ),
        ‘public‘ => true,
        ‘has_archive‘ => true,
        ‘menu_icon‘ => ‘dashicons-images-alt2‘
        )
    );

2.在插件顶级菜单中使用 Dashicons

你还可以在创建插件菜单时使用 Dashicons ,比如下面使用 add_menu_page() 函数添加一个顶级菜单:

add_menu_page(
    ‘Menu Page Title‘,
    ‘Menu Title‘,
    ‘manage_options‘,
    ‘menu-slug‘,
    ‘mytheme_menu_callback‘,
    ‘dashicons-wordpress‘ // Dashicon 图标的CSS类
    );

你需要熟悉 add_menu_page() 函数的参数用法,它的第 6 个参数就是图标。

如果你还有更多关于 Dashicon 的技巧,欢迎和我们一起交流。

兼容3.8以下版本

Dashicons 只能在 WordPress 3.8及以上版本中可用,但并不是所有的用户都会升级到最新版 ,作为开发者,不得不考虑兼容问题。其实我们要做的就是添加一个WP的版本比对,具体示例如下:

// 默认使用 Dashicons 图标
$icon = ‘dashicons-images-alt2‘;
// 如果当前的WP版本低于3.8,就使用图片图标
if( version_compare( $GLOBALS[‘wp_version‘], ‘3.8‘, ‘<‘ ) ) {
    //定义图标的地址
    $icon = get_template_directory_uri() . ‘/images/slider-icon.png‘;
}

register_post_type(‘slides‘,
    array(
        ‘labels‘ => array(
            ‘name‘ => ‘Slides‘,
            ‘singular_name‘ => ‘Slide‘
            ),
        ‘public‘ => true,
        ‘has_archive‘ => true,
        ‘menu_icon‘ => $icon //使用变量作为参数
        )
    );

关于 Dashicons 的使用,就介绍到这里,如果你有更多关于 Dashicons 的使用技巧,欢迎和我们分享。

出处:http://www.wpdaxue.com/using-dashicons-for-menu-items.html

时间: 2024-10-03 22:25:19

WordPress 在后台管理菜单中使用Dashicons图标的相关文章

wordpress——在插件后台管理页面中添加javascript和ajax

最近在开发一个wordpress插件,需要在插件的后台管理页面上,添加自己写的javascript文件,以达到一些功能. 查了好几天的文档和资料,终于实现了. 这里先介绍下wordpress后台页面添加javascript的过程,再介绍添加ajax的过程. 添加javascript 首先我们需要知道wordpress插件开发的框架,然后再介绍javascript添加的步骤. 添加插件设置页面 开发插件,总需要在管理后台添加自己的插件设置页面.插件设置子页面,在这些页面中,可以设置和保存插件的一些

discuzx3.2后台管理菜单定制,管理菜单二次开发,discuzx3.2后台管理菜单自定义

discuzx3.2后台管理菜单定制,管理菜单二次开发 详情请参考:http://www.infosz.com/forum.php?mod=viewthread&tid=199 第一步:source\admincp\menu下添加 menu_infosz.php,内容如下: 第二步:source\admincp目录下添加admincp_infosz.php 文件,内容如下: 第三步: source\language\lang_admincp_menu.php添加如下内容: 第四步:source\

java 通过接口在后台管理器中生成数据

需求:测试人员在后台批量添加数据很麻烦,特别是针对一款商品配置了英语,还需要手动添加法语.俄语.阿拉伯语,很麻烦,但是因为没有项目组配合,做个小工具批量生成数据就只有自己去研究了 第一步:通过抓包工具fiddler查看接口走向 第二步:模拟url,进行请求 第三步:验证结果 第一步:从接口中我了解到,我们需要获取原始语言的数据,如:标题.名称.文件标题.详细信息,在把数据取出来,取出来后,在调用商品增加的接口,把数据内容填充进去,进行提交,就完了 目前我们排除登录态的问题,默认是可以登录成功的,

5. 添加后台管理页面

接着上篇继续,博客网站少不了后台管理页面,在后台可以添加文章以及维护基础数据,因此本文主要就介绍怎样添加视图页面.怎样使用视图模型.绑定静态资源以及ThymeLeaf模板引擎的基本使用,具体如下:1. 添加Menu类,表示后台管理页面中的左侧菜单 1 package com.lvniao.blog.model; 2 3 import java.util.ArrayList; 4 import java.util.List; 5 6 public class Menu { 7 8 private

黄聪:WordPress 多站点建站教程(二):后台(管理网络)设置详解,如何管理子站的用户、主题、插件、设置等功能

建立好了子站,我们需要有个地方配置所有子站的主题.插件等功能,我们可以在后台看到 我的站点--管理网络 如下图: 在 管理网络--仪表盘 里面,我们可以创新用户和站点,也提供了查询功能. 要注意的是:当你新上传的主题或者插件,都需要在管理网络那边的主题和插件里面将你上传的主题和插件开启.这样才可以在你的子站点中查看的到. 黄聪:WordPress 多站点建站教程(二):后台(管理网络)设置详解,如何管理子站的用户.主题.插件.设置等功能

【小白到大牛之路】交换机后台管理之登录菜单

交换机后台管理之登录菜单 项目需求 用户打开交换机后台管理程序时,需要进行"登录"操作,以确认用户身份的合法性.所以,我们需要先实现一个登录菜单,以提示用户执行相关操作. 项目实现 启动命令窗口:在运行窗口输入notepad++,再单击"确定". 设置notepad++的语言为C语言: 设置notepad++的编码为ANSI格式编码(便于再CMD中显示中文) main.c #include <stdio.h> int main(void) {// 打印登

JavaScript内容梳理 示例之模态对话框 示例之全选和反选以及取消 示例之后台管理左侧菜单

1 <!DOCTYPE html> 2 <!--示例之模态对话框--> 3 <html lang="en"> 4 <head> 5 <meta charset="UTF-8"> 6 <title>Title</title> 7 <style> 8 .hide{ 9 display: none; 10 } 11 .c1{ 12 position: fixed; 13 lef

WordPress 去除后台标题中的“—— WordPress”

/** * WordPress 去除后台标题中的“—— WordPress” */ add_filter('admin_title', 'doocii_custom_admin_title', 10, 2); function doocii_custom_admin_title($admin_title, $title){ return $title.' ‹ '.get_bloginfo('name'); }

zencart后台管理中选项名称和选项内容和属性控制页面出错解决办法 WARNING: An Error occurred, please refresh the page and try again

后台管理中选项名称和选项内容和属性控制出现以下错误的解决办法WARNING: An Error occurred, please refresh the page and try again zen cart v1.5.1 的一个bug,重新下载更新的zencart安装包,然后取出以下三个文件替换:admin/attributes_controller.phpadmin/option_names_manager.phpadmin/option_values_manager.php 或者手工修复如