0

I have installed a Wordpress plugin that is using !important on a max-width value that is breaking my layouts. I have tried various ways of overriding it, with my own CSS, however I am unable to use a high specificity of selector, as the plugin is already using it. I spoke to the development team about this, and they said it's because the plugin's stylesheet is loading before mine. Is there a way in which I can get mine to load first?

This is how I am enqueuing my stylesheets in the functions folder –

As you can see I have divided it up into the custom page template in the first section (if), and the main stylesheet in the second section (else).

Is there a way of making the main stylesheet take priority over those of the plugins I have installed?

if (is_page_template('page-templates/full-page.php')) {

    wp_enqueue_style( 'mytheme', get_stylesheet_uri() );
    wp_enqueue_style( 'mytheme-full-page', get_stylesheet_directory_uri() . '/css/full-page.css', array( 'mytheme_style' ) );

}

else { wp_enqueue_style( 'mytheme_style', get_stylesheet_uri() );

}

}

add_action( 'wp_enqueue_scripts', 'enqueue_my_styles_and_scripts' );
Jack Averill
  • 821
  • 1
  • 10
  • 27
  • 1
    I don't think the order of stylesheets matters for precedence. It might. You could try this by downloading the webpage and going into the `.html` file to swap the css files. – Halcyon Jun 08 '17 at 14:53
  • Hi, I tried this and it works! I swapped the text in the files around and now my code is coming up on top. Any thoughts on how I could implement this permanently through my functions folder? I've seen people adding numbers after it with an array, but they had written their enqueueing method differently and my PHP coding skills are so basic I can't work out how to apply it to mine. – Jack Averill Jun 08 '17 at 15:07
  • I don't understand wp enough to give you a concrete answer based on the code you posted. Basically find which statement inserts your css file and make sure it occurs before the template one. – Halcyon Jun 08 '17 at 15:14
  • @Jack1991 Seeing your above comment *"I've seen people adding numbers after it with an array"*; you're probably looking for something like this then `` as per an answer in [Preventing Caching of CSS Files](https://stackoverflow.com/q/9560447/1415724) – Funk Forty Niner Jun 08 '17 at 15:20
  • Hi, thanks for your reply – I'm not too sure about that as I've configured my stylesheets and scripts in the functions.php file with the code above. Apparently this is standard practice on Wordpress themes rather than doing it in the head with html as done on other websites. – Jack Averill Jun 08 '17 at 15:24

1 Answers1

1

You can give priority to the add_action( 'wp_enqueue_scripts', 'enqueue_my_styles_and_scripts' ); function adding the value at the end try:

add_action( 'wp_enqueue_scripts', 'enqueue_my_styles_and_scripts', 99 );
  • Thanks, this worked perfectly :) Just out of curiosity, does this priority go up to 100 or does it stop at 99? I ask because 99 was the number used in the other similar question I saw. – Jack Averill Jun 08 '17 at 15:47