Ever wondered how you could add custom icons for your 自定义帖子类型 in WordPress? If so, then you’re in the right place. In this article, we will show you how to add icons for custom post types in WordPress.
是否曾经想过如何在WordPress中为自定义帖子类型添加自定义图标? 如果是这样,那么您来对地方了。 在本文中,我们将向您展示如何在WordPress中为自定义帖子类型添加图标。
WordPress started using an icon font called Dashicons since WordPress 3.8. These font icons look great on any device or screen size. Well, you can leverage these icons to assign custom icons to your post types.
自WordPress 3.8起,WordPress就开始使用名为Dashicons的图标字体。 这些字体图标在任何设备或屏幕尺寸上都很好看。 好了,您可以利用这些图标为您的帖子类型分配自定义图标。
影片教学 (Video Tutorial)
如果您不喜欢该视频或需要更多说明,请继续阅读。
如果您不喜欢该视频或需要更多说明,请继续阅读。
使用插件添加自定义帖子类型图标 (Adding Custom Post Type Icons using a Plugin)
First thing you need to do is install and activate the CPT 自定义图标 plugin. Upon activation, simply go to 设置 » CPT 自定义图标设置 where you will see your custom post types listed. Next, click on the ‘Choose icon’ button next to a custom post type and then select a font from the menu.
您需要做的第一件事是安装并激活CPT 自定义图标插件。 激活后,只需转到设置»CPT 自定义图标设置 ,您将在其中看到自定义帖子类型。 接下来,点击自定义帖子类型旁边的“选择图标”按钮,然后从菜单中选择一种字体。

使用自定义帖子类型UI插件添加图标 (Adding Icons using Custom Post Type UI Plugin)
If you’re new to registering a custom post type, then we recommend that you use 自定义帖子类型 UI plugin to 创建和管理自定义帖子类型 and 分类法.
如果您不熟悉注册自定义帖子类型,那么我们建议您使用“ 自定义帖子类型”UI插件来创建和管理自定义帖子类型和分类 。
Adding an icon to a custom post type created with CPT UI plugin is very simple. It supports Dashicons by default, so first you need to visit the 大石图标网站 and select the icon you want to use for your post type.
将图标添加到使用CPT UI插件创建的自定义帖子类型非常简单。 默认情况下,它支持Dashicons,因此首先您需要访问大石图标网站并选择要用于帖子类型的图标。

Clicking on an icon in the list will show a larger version of the icon on the top. Next to it, you will see the icon’s CSS class. It will be something like dashicons-groups, dashicons-calendar, dashicons-cart, etc. You need to copy the CSS class and edit the custom post type you want to edit in CPT UI. All you need to do is click on the 高级选项 link and scroll down to the Menu Icon section, then paste the CSS class and save your changes.
单击列表中的图标将在顶部显示该图标的较大版本。 在它旁边,您将看到该图标CSS类。 它将类似于dashicons-groups,dashicons-calendar,dashicons-cart等。您需要复制CSS类并编辑要在CPT UI中编辑的自定义帖子类型。 您需要做的就是单击“ 高级选项”链接并向下滚动到“菜单图标”部分,然后粘贴CSS类并保存您的更改。

You can also create an image icon yourself and upload it by clicking 媒体 » 添加新内容. After the upload, click on the Edit link and copy the image file URL. Now simply paste this URL in the menu icon field in CPT UI settings.
您也可以自己创建图像图标并通过单击媒体 » 添加新内容图标将其上传。 上传后,单击“编辑”链接并复制图像文件URL。 现在,只需将此URL粘贴到CPT UI设置的菜单图标字段中即可。
手动将图标添加到自定义帖子类型 (Manually Adding Icon to a Custom Post Type)
如果您通过将代码放置在站点特定的插件或functions.php 文件中来创建自定义帖子类型,那么您可以手动添加菜单图标。再次访问 Dashicons 网站选择一个图标并复制 CSS 类即可。之后将其添加到您的自定义帖子类型代码中,如下所示:
如果您通过将代码放置在特定于站点的插件或functions.php 文件中来创建自定义帖子类型,则可以手动添加菜单图标。再次访问 Dashicons 网站选择一个图标并复制 CSS 类即可。之后,将其添加到您的自定义帖子类型代码中,如下所示:
'menu_icon' => 'dashicons-cart',
您还可以添加要显示为图标的图像文件的完整 URL,如下所示:
您还可以添加要显示为图标的图像文件的完整 URL,如下所示:
'menu_icon' => 'http://www.example.com/wp-content/uploads/2014/11/your-cpt-icon.png',
下面是一个完整的代码片段,它创建一个名为 products 的自定义帖子类型,并带有菜单图标:
以下是创建带有名为“产品”的菜单图标的自定义帖子类型的完整代码片段:
// Register Custom Post Type
function custom_post_type() {
$labels = array(
'name' => _x( 'products', 'Post Type General Name', 'text_domain' ),
'singular_name' => _x( 'Product', 'Post Type Singular Name', 'text_domain' ),
'menu_name' => __( 'Products', 'text_domain' ),
'parent_item_colon' => __( 'Parent Item:', 'text_domain' ),
'all_items' => __( 'All Items', 'text_domain' ),
'view_item' => __( 'View Item', 'text_domain' ),
'add_new_item' => __( 'Add New Item', 'text_domain' ),
'add_new' => __( 'Add New', 'text_domain' ),
'edit_item' => __( 'Edit Item', 'text_domain' ),
'update_item' => __( 'Update Item', 'text_domain' ),
'search_items' => __( 'Search Item', 'text_domain' ),
'not_found' => __( 'Not found', 'text_domain' ),
'not_found_in_trash' => __( 'Not found in Trash', 'text_domain' ),
);
$args = array(
'label' => __( 'Products', 'text_domain' ),
'description' => __( 'Post Type Description', 'text_domain' ),
'labels' => $labels,
'supports' => array( ),
'taxonomies' => array( 'category', 'post_tag' ),
'hierarchical' => false,
'public' => true,
'show_ui' => true,
'show_in_menu' => true,
'show_in_nav_menus' => true,
'show_in_admin_bar' => true,
'menu_position' => 5,
'menu_icon' => 'dashicons-cart',
'can_export' => true,
'has_archive' => true,
'exclude_from_search' => false,
'publicly_queryable' => true,
'capability_type' => 'page',
);
register_post_type( 'Products', $args );
}
// Hook into the 'init' action
add_action( 'init', 'custom_post_type', 0 );
We hope this article helped you add icons for your custom post types in WordPress. You may also want to check out how to 在 WordPress 帖子编辑器中使用图标字体.
我们希望本文能帮助您在WordPress中为自定义帖子类型添加图标。 您可能还想了解如何在 WordPress 帖子编辑器中使用图标字体 。
If you liked this article, then please subscribe to our YouTube 频道 for WordPress video tutorials. You can also find us on 推特 and 谷歌+.
如果您喜欢这篇文章,请订阅我们的YouTube 频道 WordPress视频教程。 您也可以在推特和谷歌+上找到我们。
翻译自: https://www.wpbeginner.com/wp-tutorials/how-to-add-icons-for-custom-post-types-in-wordpress/