For some plugins you may need CSS styling to be changed, but if you change the plugin files, either you won’t update it, or you will lose your changes. I will show you a simple trick to overcome this problem using seperate stylesheets.
Problem is generally caused by loading of plugins stylesheets is later then theme stylesheet:
... <!-- Theme Stylesheet --> <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri() ?>/style.css" /> <?php wp_head(); // <- This is where your plugin stylesheets and scripts are generated ?> ...
Simple Fix using seperate CSS files
You can easily overwrite plugin styles using a seperate stylesheet file, for example overwrites.css
. Then in your header.php file, insert it using:
... <!-- Theme Stylesheet --> <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri() ?>/style.css" /> <?php wp_head(); // <- This is where your plugin stylesheets and scripts are generated ?> <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri() ?>/overwrites.css" /> ...
This fix is aimed for basic users. For advanced users, I recommend using wp_dequeue_style
function to remove plugin stylesheets. After you dequeue stylesheets, you need to include/write required CSS rules yourself.
I hope this trick helps you with your styling issues.
Search Queries: wordpress fix plugin css, wordpress css issues, wordpress theme css issue