Remove specific CSS and JS from the head

Question

I'm trying to remove some specific lines from the WP_HEAD. Now my header looks following way:

<link rel='stylesheet' id='bootstrap-css'  href='/themes/wp-e/css/bootstrap.css?ver=4.2.2' type='text/css' media='all' />
<link rel='stylesheet' id='bootstrap-responsive-css'  href='/themes/wp-e/css/bootstrap-responsive.css?ver=4.2.2' type='text/css' media='all' />
<link rel='stylesheet' id='style-css'  href='/themes/wp-e/style.css?ver=4.2.2' type='text/css' media='all' />
<link rel='stylesheet' id='prettyPhoto-css-css'  href='/themes/wp-e/css/prettyphoto.css?ver=4.2.2' type='text/css' media='all' />
<link rel='stylesheet' id='custom-options-css'  href='/themes/wp-e/css/options.css?ver=4.2.2' type='text/css' media='all' />
<link rel='stylesheet' id='oswald_google-fonts-css'  href='http://fonts.googleapis.com/css?family=Oswald%3A400%2C300%2C700&#038;subset=latin%2Clatin-ext&#038;ver=4.2.2' type='text/css' media='screen' />
<link rel='stylesheet' id='thumbs_rating_styles-css'  href='/plugins/rating/css/style.css?ver=1.0.0' type='text/css' media='all' />

<script type='text/javascript' src='/js/jquery/jquery.js?ver=1.11.2'></script>
<script type='text/javascript' src='/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<script type='text/javascript' src='/plugins/q2w3-fixed-widget/js/q2w3-fixed-widget.min.js?ver=4.0.6'></script>
<script type='text/javascript' src='/plugins/rating/js/general.js?ver=4.0.1'></script>

I need to delete all of this, but I am not good at coding and all I know is that I have to put the

remove_action( 'wp_head', '???' );

But I have no idea what to put instead of ???.

Answer 1

When you look at the <style|script> tags in your head, you will notice the id attribute there. Example:

id='bootstrap-css'

This – in most cases – was added by a function hooked to wp_enqueue_scripts, wp_enqueue_styles or wp_register_scripts or wp_register_styles hook. In the worst case it was hooked to either the wp_head or the wp_print_scripts hook.

In the process of backtracing those calls that add the <script|style> tags, you should be able to see what is attached by using something like the following from within a small plugin or your functions.php in a theme or child theme:

// See if those scripts/styles were added using the Dependency API
// Search the output for the `id` you can see rendered in the DOM
printf( 
    '<pre>%s</pre>', 
    var_export( $GLOBALS['wp_scripts']->registered, TRUE )
);

If you can find the script/style in above output, then you know that the asset was properly registered (and therefore is available for optimization or other handling with plugins using the WordPress API).

In case that was true, you can then search the assets up:

foreach( [
    'wp_enqueue_scripts',
    'wp_print_scripts',
    'wp_head',
] as $action )
    printf( 
        '<h1><code>%1$s</code></h1><pre>%1$s</pre>', 
        var_export( $GLOBALS['wp_filters'][ $action ], TRUE )
    );

You will get printed three "blocks" of information. Each will contain an array of callbacks that are attached to the specific hook in the array. You can then search those up using a cross file search over your themes and plugins to find the origin of your assets. Then unregister the actions you want to get rid of.