1

我想要达到的目标:

我想在我的 Wordpress 网站上使用自定义图标(包括在管理菜单中)。

到目前为止我做了什么

我已经在 fontastic.me 上设置了一个帐户,并使用以下与“管理打印样式”挂钩的 functions.php 将字体排入队列

wp_enqueue_style('fontastic-css', 'https://file.myfontastic.com/<mycode>/icons.css');

我已将 fontastic me 上的图标名称设置为“dashicons”,因为这样您可以直接在管理菜单中使用它们,例如

add_menu_page(
            'Page Title',
            'Menu Title',
            'Capability',
            'menu_slug',
            [ $this, 'call_back' ],
            'dashicons-custom-icon-name',
            1
        );

如果您将它们称为其他东西,例如自定义图标,您就不能那么容易地使用它们。

我也尝试过以其他方式排队,但问题与我在下面记录的相同。

有什么问题?

但是,通过这样做,我显然会覆盖/阻止/通常干扰 Wordpress 提供的现有“dashicons”库。

这意味着整个 Wordpress 中不在我的库中的任何破折号都无法加载,并且我在它们的空间中留下了空白方块。

任何帮助确定我如何添加到 dashicons 库,而不是覆盖它,将不胜感激。谢谢。

4

1 回答 1

0

解决此问题的方法是执行以下操作:

1) 返回 fontastic.me 并更改字体,使其不再是“dashicons”,而是其他内容,例如“customicons”。

2) 从菜单功能中删除代码 'dashicons-custom-icon-name' - 让它默认为标准的 'dashicons-admin-generic'。

3) 从 fontastic me 下载你的字体并用编辑器打开它——这样你就有了所有图标代码的参考——我在网站上找不到这些。

4)将以下内容添加到您想要定位的每个图标的样式表中

#adminmenu li.toplevel_page_bnfo_database div.wp-menu-image.dashicons-admin-generic:before { // change 'menu_slug' to whatever your menu slug is
font-family: yourfont; // this needs to be whatever you called it on fontastic.me
content: "\62"; // Whichever icon you want to show.
}

为什么这不是一个完美的解决方案

与我最初追求的解决方案相比,这似乎需要更多代码并且更麻烦。

但是,它是插件提供商(例如 WooCommerce)正在使用的解决方案,因此可能是最好的选择。

于 2017-11-10T11:55:49.993 回答