0

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();

?>
0
  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.

0

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.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.