Not able to override plugin's default css rules

Question

I'm not able to override the "Total Control HTML5 Audio Player Basic" plugin default css file.

I've copied the plugin css default content inside style.css file in my child theme, and then I've tried to change some stuff, but the new css rule are not displayed.

I've checked with Firebug that the custom css file is loaded after the default file, so I don't understand why the new rules are not applied.

I've also tried with this suggestion: Override CSS settings of plugins

add_filter( 'style_loader_src', 'wpse106104_replace_stylesheet' );
function wpse106104_replace_stylesheet( $stylesheet_src, $handle ){

    if( 'plugin-script-handle' == $handle ){
         $stylesheet_src = get_template_directory_uri() . '/css/themes-copy-of-plugin.css';
    }
    return stylesheet_src;
}

but this only throws these errors:

Warning: Missing argument 2 for wpse106104_replace_stylesheet() in /home/me/MyServer/myproject/wp-content/themes/twentyfourteen-child/functions.php on line 451

Notice: Undefined variable: handle in /home/me/MyServer/myproject/wp-content/themes/twentyfourteen-child/functions.php on line 453

Notice: Use of undefined constant stylesheet_src - assumed 'stylesheet_src' in /home/me/MyServer/myproject/wp-content/themes/twentyfourteen-child/functions.php on line 456

Warning: Missing argument 2 for wpse106104_replace_stylesheet() in /home/me/MyServer/myproject/wp-content/themes/twentyfourteen-child/functions.php on line 451

Any suggestion?

tfrommen · Accepted Answer · 2013-12-22 14:52:20Z

1

If you want to do it this way, it has to look like the following:

add_filter('style_loader_src', 'wpse127340_replace_stylesheet', 10, 2);
function wpse127340_replace_stylesheet($src, $handle){

    if ('your-plugin-script-handle' == $handle)
         return get_template_directory_uri().'/css/themes-copy-of-plugin.css';

    return $src;
}

Replace your-plugin-script-handle and themes-copy-of-plugin.css with what you want it to be.

edited Dec 22, 2013 at 14:52

answered Dec 22, 2013 at 14:39

tfrommen

9,2317 gold badges40 silver badges59 bronze badges

It does not work, but now I know why. I can see that the default plugin css file is loaded after <div id="content-sidebar"...>. So how can I override it?

Manolo
– Manolo

2013-12-22 15:11:41 +00:00
Commented Dec 22, 2013 at 15:11
This means, the stylesheet is not enqueued. Depending on how much you want to alter the style, you could enqueue a new stylesheet with CSS rules that are !important. Or you could have a look at the plugin in question, and search for any action/filter hook you could use.

tfrommen
– tfrommen

2013-12-22 15:19:13 +00:00
Commented Dec 22, 2013 at 15:19
Ok. Thank you. I've finally decided to use !important as it is the easiest way. But I can understand much better now.

Manolo
– Manolo

2013-12-22 16:34:11 +00:00
Commented Dec 22, 2013 at 16:34

Add a comment |

Stack Exchange Network

Not able to override plugin's default css rules

1 Answer 1

Your Answer

Linked

Hot Network Questions

Not able to override plugin's default css rules

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Linked

Related

Hot Network Questions