Glyphicons Dont Show in WordPress Plugin Only

Question

I have a very simple WordPress plugin that shows a menu/admin page. The page contains Glyphicons - Font Awesome.

These glyphicons are never showing. I cannot figure out why because I know the font-awesome css file is being loaded correctly and I know that the admin pages HTML works fine outside of a wordpress plugin and shows the Glyphs.

What could possibly be going wrong?

<?php
/**
*  Plugin Name: TEST Use FA Icons
*  Plugin URI: 
*  Description: Test Development Plugin
*  Version: 1.0.0
*  Author: 
*  Author URI: 
*  License: GPL2
*/ 

class TEST_Use_FA_Icons_Admin
{

    public function __construct() {
        add_action('admin_menu', array($this, 'admin_menu'));
    }

    public function admin_menu() {

        wp_enqueue_style( "font-awesome", plugin_dir_url( __FILE__ ) . 'css/font-awesome.min.css', array(), false, 'all' );

        add_menu_page('TEST_DEV', 'TEST_DEV', 'administrator', 'TEST_DEV_SLUG', 
                    array($this, 'show_TEST_page'), 
                    plugins_url('images/help.png', __FILE__));
    }

    public function show_TEST_page() {
        ?>
        <div class="wrap">
            <div class="container">
                <div class="col-md-12">
                        <h1>Test</h1>

                        <i class="fa fa-camera-retro fa-lg"></i> fa-lg
                        <i class="fa fa-camera-retro fa-2x"></i> fa-2x
                        <i class="fa fa-camera-retro fa-3x"></i> fa-3x
                        <i class="fa fa-camera-retro fa-4x"></i> fa-4x
                        <i class="fa fa-camera-retro fa-5x"></i> fa-5x
                </div>
            </div>
        </div>
        <?php
    }
}

$test_TEST_Use_FA_Icons_Admin_admin = new TEST_Use_FA_Icons_Admin();

?>

Answer 1

1. 1st alternative is to use the CDN. When using it the icons are visible:

   https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css

2. 2nd alternative is to include all resources necessary. When you are using only the min CSS, the console is marking the following resources as not found but required :

   GET wp-content/plugins/new/fonts/fontawesome-webfont.woff2?v=4.4.0  
   GET wp-content/plugins/new/fonts/fontawesome-webfont.woff?v=4.4.0  
   GET wp-content/plugins/new/fonts/fontawesome-webfont.ttf?v=4.4.0 404 (Not Found)
   

Here are the resources that you need (the fonts).

p.s. I've installed the plugin and then troubleshoot it.

Answer 2

I've got the issue too. Then I've used the CDN for my plugin and included it with this line of code:

wp_enqueue_style( 'fontAwesome', 'https://use.fontawesome.com/releases/v5.0.13/css/all.css', array(), null);

Most important part was to set the version number to null cause it didn't work by auto versioning from wordpress.