Adding custom scripts / css to WordPress

Basic

– wp_enqueue_script
– wp_enqueue_style

wp_enqueue_script($jsref, $pathToJSFile, $dep, $ver, $in_footer);
wp_enqueue_style($jsref, $pathToCSSFile );

# example from the theme directory
wp_enqueue_script('home', get_stylesheet_directory_uri() . '/js/home.js', array('jquery'), '', true);

# example from a plugin directory
wp_enqueue_style( 'plugin_style', plugins_url('myplugin.css', __FILE__) );

Admin/Frontend

– admin_enqueue_scripts – admin backend
– wp_enqueue_scripts – frontend

add_action( 'admin_enqueue_scripts', function(){
    wp_enqueue_script(...);
    wp_enqueue_style(...);
});

Enqueuing Scripts from CDN

wp_enqueue_style('font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/5.4.0/css/font-awesome.min.css');
wp_enqueue_script( 'Slick', 'https://cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min.js', null, null, true );