Adding Modernizr properly to WordPress?

This is my first time posting so any advice for how I post is much appreciated.

LINK TO SITE: http://rightbraingroup.com/services-new-css-style/

Read More

I am running into a problem trying to get this amazing css function to work – modernizr and the css to load in WordPress. I tried many things like adding scripts to the header, registering and enqueing the modernizr.custom.js file. I also added . And none of these options worked. I am just learning about modernizr and am truly stuck. Any help is appreciated.

Below are the ways to include js and css into WordPress without using Enqueing (which is the proper way).

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/modernizr.custom.js"></script>

<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/component.css" media="screen" />

This is how I registered and Enqued the js file

// script manager template to register and enqueue files
function childtheme_script_manager() {

    // wp_register_script template ( $handle, $src, $deps, $ver, $in_footer );

    // registers modernizr script, stylesheet local path, no dependency, no version, loads in header
    wp_register_script('new_service', get_stylesheet_directory_uri() . '/js/modernizr.custom.js', array('jquery'), false, false);

    // enqueue the scripts for use in theme
    wp_enqueue_script ('new_service');

}
add_action('wp_enqueue_scripts', 'childtheme_script_manager');

I keep getting a 404 error or “Resource interpreted as Script but transferred with MIME type text/plain” (used plugin to fix but did not help). If anyone can give a little guidance or direction it would be much appreciated. This is also my first time posting so if you need any more info from me please let me know. Thank you for your time.

Related posts

Leave a Reply

1 comment

  1. Your wp_enqueue_scripts code is correct and Modernizr appears to be loading fine on your site. You need to do a similar invocation for adding stylesheets.

    function childtheme_script_manager() {
        wp_register_script('new_service', get_stylesheet_directory_uri() . '/js/modernizr.custom.js', array('jquery'), false, false);
        wp_enqueue_script('new_service');
    
        wp_register_style('my_style', get_template_directory_uri() . '/css/component.css', array(), false, 'screen');
        wp_enqueue_style('my_style');
    }
    

    Note, I’ve left the $deps array empty, if the css has dependencies, you may need to specify those names in the array.