How can I add font awesome icons into Custom Post Type UI Menu Icon area?

Question

I want to add font awesome icons into Custom Post Type UI Menu Icon area but I couldn't add. How can I do any idea, guys? Thank you.

Answer 1

if you can paste these files into the functions.php and style.css and know the custom post type class looking at the body class given by wordpress

To use Font Awesome for a WordPress Custom Post Type, you’ll need to write a little CSS: just target a CPT menu item (inspect the WordPress admin sidebar to find the correct CSS ID) like this:

#adminmenu #menu-posts-custom_post_type_name .wp-menu-image:before {
 content: "\f135"; //find this by clicking on the individual icon on Font 
 Awesome's site.
font-family: 'FontAwesome' !important;
 font-size: 18px !important;
}

Next, add those styles to the WordPress admin by using the admin_head hook:

function namespaced_admin_styles_function() {

  echo '<link href="/link/to/admin-styles.css"  rel="stylesheet">';
}

add_action('admin_head', 'namespaced_admin_styles_function');

…and you’re off and running! Well, not quite. You still need to add the Font Awesome stylesheet to both the WordPress admin and the front-end of your site. Fortunately, you can kill two birds with one stone this way:

function FontAwesome_icons() {
echo '<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css"  rel="stylesheet">';
}

add_action('admin_head', 'FontAwesome_icons');
add_action('wp_head', 'FontAwesome_icons');

Refrence from:https://cnpagency.com/blog/3-ways-to-use-icon-fonts-in-your-wordpress-theme-admin/

Answer 2

in your post type array add fontawsome classes like so :

array(
'menu_icon' => 'dashicons-fa fa-book', /* the icon for the custom post type menu. uses built-in dashicons (CSS class name) */
);

Then add these hooks in your functions.php

add_filter( 'sanitize_html_class', function ( $sanitized, $class, $fallback ) {

    if ( strpos( $class, 'fa' )
         || strpos( $class, 'fas' )
         || strpos( $class, 'fal' )
         || strpos( $class, 'fab' )
         || strpos( $class, 'far' )
    ) {
        $class = str_replace( 'dashicons-', '', $class );

        return $class;

    }

    return $sanitized;

}, 0, 3 );

and add font awsome in your admin document:

function fontawesome_dashboard() {
    wp_enqueue_style('custom-style', get_template_directory_uri().'/assets/styles/all.min.css');
    wp_add_inline_style( 'custom-style', '.fa:before,.fas:before,.fal:before,.fab:before,.far:before{font-family:inherit!important;}' );

}
add_action('admin_init', 'fontawesome_dashboard');