Wordpress Stylesheet Issue: Resource interpreted as Stylesheet but transferred with MIME type

57
May 31, 2018, at 07:20 AM

I'm trying to properly setup my functions.php file in Wordpress. The theme I've been using has been pulling in the stylesheets and JS files in header.php, so I couldn't make a child theme that overwrote these. I'm trying to enqueue the stylesheets and JS files in functions.php instead of header.php. However, none of the styling is showing up, and i'm getting this error:

Resource interpreted as Stylesheet but transferred with MIME type

Here's the original header.php:

<!-- WP Linked Resources -->
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" 
type="text/css" media="screen" />
<link rel="shortcut icon" href="<?php echo 
get_stylesheet_directory_uri(); ?>/favicon.ico" />
<!-- Bootstrap -->
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ? 
>/assets/bootstrap.min.css">
<!-- MegaMenu stylesheet -->
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ? 
>/assets/megamenu.css">
<!-- Webfont Kit -->
<link rel="stylesheet" type="text/css" href="<?php 
bloginfo('template_directory'); ?>/assets/MyFontsWebfontsKit.css">
<!-- less -->
<link rel="stylesheet/less" type="text/css" href="<?php 
bloginfo('template_directory'); ?>/assets/stylesheet.less">
<script src="<?php bloginfo('template_directory'); ?>/assets/less.js" 
type="text/javascript"></script>
<!-- print CSS -->
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ? 
>/assets/print.css" type="text/css" media="print" />
<!-- google translate -->
<meta name="google-translate-customization" content="d4ae87e62341359b- 
83f2b047a4c8818c-g4cbb26cb8a5f11dd-11"></meta>
<!-- Android scroll bug fix -->
<script type="text/javascript" src="<?php 
bloginfo('template_directory'); ?>/assets/touchscroll.js"></script>
<?php wp_head(); ?>

Here's functions.php, where I'm trying to enqueue all the files that were in the original header.php

function add_theme_scripts() {
wp_enqueue_style( 
    'generic-style',
get_stylesheet_directory_uri() );
wp_enqueue_style( 
  'favicon',
  get_stylesheet_directory_uri().'favicon.ico');
wp_enqueue_style( 
    'bootstrap',
    get_stylesheet_directory_uri(). '/assets/bootstrap.min.css');
wp_enqueue_style( 
    'megamenu-stylesheet',
    get_stylesheet_directory_uri(). '/assets/megamenu.css');  
wp_enqueue_style( 
    'webfont-kit',
    get_stylesheet_directory_uri().'/assets/MyFontsWebfontsKit.css'); 
wp_enqueue_style( 
    'less',
    get_stylesheet_directory_uri().'/assets/stylesheet.less');
wp_enqueue_script( 
    'less-js',
    get_stylesheet_directory_uri().'/assets/less.js');
wp_enqueue_style( 
  'print-css',
  get_stylesheet_directory_uri().'/assets/print.css');
}
add_action( 'wp_enqueue_scripts', '/add_theme_scripts' );

Any suggestions on how to enqueue my css and JS properly?

Answer 1

You should try using the get_template_directory_uri() if the css and js is located in your theme folder.

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'generic-style', get_stylesheet_directory_uri() );
wp_enqueue_style( 'favicon', get_template_directory_uri() . '/favicon.ico');
wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/assets/bootstrap.min.css');
wp_enqueue_style( 'megamenu-stylesheet', get_template_directory_uri() . '/assets/megamenu.css');
wp_enqueue_style( 'webfont-kit', get_template_directory_uri() .'/assets/MyFontsWebfontsKit.css'); 
wp_enqueue_style( 'less', get_template_directory_uri() .'/assets/stylesheet.less');
wp_enqueue_script( 'less-js', get_template_directory_uri() .'/assets/less.js');
wp_enqueue_style( 'print-css', get_template_directory_uri() .'/assets/print.css');
}
READ ALSO
Display total customers reviews and ratings average in WooCommerce

Display total customers reviews and ratings average in WooCommerce

I want to display a total number of customer reviews on the homepage, I have tried this method:

59
PHP : buffer size issue

PHP : buffer size issue

I am facing an issue, I am trying to print content using PHP object bufferif the content is more than 4MB then it is giving the timeout

99
Get and find html from url

Get and find html from url

I read many topics out there, but non of those solved my problem, I am trying to get html content from url (googlecom) and find an element, but stock in first level

87
How to auto generate or copy already found php page using php script

How to auto generate or copy already found php page using php script

Hello everyone I have a question about PHPI am making a website and I did a page for posting articles and pics so I already made one to post but when I post I can not generate for every post a new php page what I have done is only show all posts on one page

56