0

For some reason js and css files are not loading in my plugin. Here's what I have: (ostensibly unrelated code replaced with '...')

class Location_Specific_Menu_Items {
    private static $instance = null;
    public static function get_instance() {
        return null == self::$instance ? self::$instance = new self : self::$instance;
    }

function __construct() {
    if( is_admin() ) {
        ...
        add_action( 'admin_enqueue_scripts', array( &$this, 'xsmi_load_admin_script' ) );
    } else {
        ...
}

function xsmi_load_admin_script() {
    wp_enqueue_style('chosen.min', 'https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.css');       
    wp_enqueue_script('jquery', 'http://code.jquery.com/jquery-1.8.3.js');
    wp_enqueue_script('chosen.jquery.min', 'https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.jquery.js', array(), '1.0.0', true);
} // I tried locally hosted files as well.
...
function option( $fields, $item_id ) {
    ob_start(); ?>
        <p class="field-visibility description description-wide">
            <label for="edit-menu-item-visibility-<?php echo $item_id; ?>">
            <?php echo 'LSMI Visibility Control' ?>
            <script type="text/javascript">
            jQuery(document).ready(function($){ 
                $(".chzn-select").chosen();
            });
            </script>
            <br/><br/>
            <select name="chzn-select" class="chzn-select" multiple="true" width="200px">
            <option value="AT">Austria</option>
            <option value="AU">Australia</option>
            </select>
            <br/><br/>
...

Yet it just looks like this: enter image description here

If I comment out

jQuery(document).ready(function($){ 
    $(".chzn-select").chosen();
    });

it looks like this:

enter image description here

Any ideas what I'm doing wrong?

EDIT:

Ok, css and js are now loading from the CDN. However, the width of the field is still 0px!

  • Does your console prints out any errors? – denis.stoyanov Feb 15 '16 at 12:25
  • @denis.stoyanov Could you elaborate? This is my first attempt to build a plugin so I'm still learning some of the basics as I go along. – j8d Feb 15 '16 at 12:39
  • Ah-ha. [Mon Feb 15 17:56:48.254480 2016] [core:error] [pid 4404:tid 1348] (20024)The given path is misformatted or contained invalid characters: [client 127.0.0.1:60342] AH00127: Cannot map GET /wpC:Amppswwwwpwp-contentpluginslocation-specific-menu-items/assets/chosen.jquery.min.js?ver=4.4.2 HTTP/1.1 to file, referer: http://127.0.0.1/wp/wp-admin/nav-menus.php But no errors after I switched to externally hosted files. – j8d Feb 15 '16 at 12:45
0

This fixed it...

function xsmi_load_admin_script() {
    wp_register_style( 'chosencss', plugins_url( 'assets/chosen.css', __FILE__ ), true, '', 'all' );
    wp_register_script( 'chosenjs', plugins_url( 'assets/chosen.jquery.js', __FILE__ ), array( 'jquery' ), '', true );
    wp_enqueue_style( 'chosencss' );
    wp_enqueue_script( 'chosenjs' );

}

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.