JQuery CSS Scoping

Question

I am in a situation where I have two WordPress plugins that include jquery-ui.css and the last downloadable plugin overwrites the first css plugin. I would like both themes to load. I know that the jQuery theme creator supports CSS detection, but none of these plugins use this feature, and editing the plugin is not a smart option (since the changes will be overwritten the next time I update the plugin). Is there any way to programmatically implement the scope by adding JavaScript to my theme?

Answer 1

First, you should be able to cover at least one of the output of the plugins by marking its container (or using additional packaging) with some class . For this class to take effect, you need to load the new package assembly by filling out CSS Scope class selector, which will be .class . Theme Folder Name is your new scoped css. See this page for more details.

.

Wordpress

To make everything good and clear in WordPress, register a new CSS. In your functions.php topic:

 wp_register_style( 'myScopedjQueryUICss', get_stylesheet_directory_uri() . '/scopedjQueryUICssDirectory/ui.all.css' ); 

Finish highlighting these styles where you need them. A common way to do this is by binding the next line to the wp_print_styles action.

 function hookScopedCss() { if ( wp_style_is( 'myScopedjQueryUICss' ) || wp_style_is( 'myScopedjQueryUICss', 'done' ) ) { return; } wp_enqueue_style( 'myScopedjQueryUICss' ); } add_action('wp_print_styles', 'hookScopedCss' );