skip to Main Content

I have some spreadsheets that load at the bottom of the page for a couple of plugins (e.g. Ultimate Member and Open User Map).

I have a child theme stylesheet, but some of the styles in the plugins are already set to important, so I am trying to over-ride them but since they are marked important, my changes in my stylesheet do not work for those elements.

How can I load an additional stylesheet below them?

Thanks

2

Answers


  1. You can use a higher priority like below code when you enqueue your stylesheets

    add_action( 'wp_enqueue_scripts', array(&$this, 'theme_styles'), 99 
    

    Note : Use higher number in priority to load at last

    Login or Signup to reply.
  2. You can do this in multiple ways with wp_enqueue_script:

    1. When you enqueue your css file, set the dependency array to rely on the plugins stylesheet. Look through the plugin code and see where and how they enqueue their stylesheet, use that handle/name in your enqueue for the dependency. Keep in mind that if the dependency is not correct, or does not exist, your stylesheet will not be enqueued, WP doesn’t output a warning for this.

      wp_enqueue_script(
          $handle,
          $src,
          [
              'handle-of-plugin-stylesheet'
          ],
          $ver,
          $args
      );
      
    2. In addition, you can set the $args parameter to defer and place in footer like so:

      wp_enqueue_script( $handle, $src, $deps, $ver, [
          'strategy' => 'defer',
          'in_footer' => true,
      ]);
      
    3. Less pretty solution; Use the wp_footer hook to insert the stylesheet there:

      add_action( 'wp_footer', 'custom_styles_footer', 99 );
      function custom_styles_footer () {
          echo '<link rel="stylesheet" type="text/css" href="' . get_stylesheet_directory_uri() . '/footer-styles.css" media="all" />';
      }
      
      

    Hope that helps.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search