JavaScript added as link/stylesheet

Question

I am just trying to create a plugin that will add some JS to the header and custom CSs. I have this below but it adds the css wrong and shows as JS. This is first plugin i have attempted.

<?php
/**
 * Plugin Name: mmoore5553 Simple Range Slider
 * Plugin URI: mailto:[email protected]
 * Description: Simple Range Slider
 * Version:  1.0
 * Author: [email protected]
 * Author URI: 
 * License:GPL2
 */


function SimpleRangeSlider() {
wp_register_script('SimpleRangeSlider', plugins_url('/js/simple-slider.js', __FILE__), array('jquery'),'1.1', true);
wp_enqueue_script('SimpleRangeSlider');
}

add_action( 'wp_enqueue_scripts', 'SimpleRangeSlider' ); 



function SimpleRangeSlider1() {
wp_register_script('stylesheet1', plugins_url('/css/simple-slider.css', __FILE__));
wp_enqueue_script('stylesheet1');
}

add_action( 'wp_enqueue_scripts', 'SimpleRangeSlider1' );  

function SimpleRangeSlider2() {
wp_register_script('stylesheet2', plugins_url('/css/simple-slider-volume.css', __FILE__));
wp_enqueue_script('stylesheet2');
}

add_action( 'wp_enqueue_scripts', 'SimpleRangeSlider2' );  
?>

Answer 1

wp_enqueue_script is for… scripts. You want wp_enqueue_style (and wp_register_style) for stylesheets.

Also note that you can enqueue as many things as you'd like in a single function, no need to create a separate function for each. You can also pass all the same arguments to enqueue as you do to register, no need to register them first if you're just enqueueing in one place.

Answer 2

As Milo already told you, you need to use wp_enqueue_script for scripts and use wp_enqueue_style for Stylesheet files.

http://codex.wordpress.org/Function_Reference/wp_enqueue_script

https://codex.wordpress.org/Function_Reference/wp_enqueue_style

Read these pages, they will give all the info you need.

Also, you can actually enqueue multiple scripts / styles in single function, no need to create function for each style file or script file enqueue.