css out of order?

  • Resolved reggieofarrell

    (@ofarrellaudio)


    6 years ago

    Most everything seems to be working well, but our custom.css file seems to be either not being loaded or being loaded out of order. The theme we are using is Buddy Boss and the custom.css file is loaded in functions.php like so…

    /**
 * Enqueues scripts and styles for child theme front-end.
 *
 * @since Boss Child Theme  1.0.0
 */
function boss_child_theme_scripts_styles()
{
    /*
     * Styles
     */
    wp_enqueue_style('boss-child-custom', get_stylesheet_directory_uri().'/css/custom.css', null, filemtime(get_stylesheet_directory() . '/css/custom.css'));

}
add_action('wp_enqueue_scripts', 'boss_child_theme_scripts_styles', 9999);

    I’m also curious if it is possible to async load external scripts that are added by plugins (PureChat in our case is one such plugin). Any help/ideas would be most appreciated. Thanks!

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    AO tries to honor the order of stylesheets, but this can be broken by;
    * excluded stylesheets (as they are not aggregated and thus generally loaded later then the autoptimized CSS)
    * inline CSS if “also aggregate inline CSS” is not ticked
    * stylesheets with different media attributes (see HTML source of autoptimimed page; “all”, “screen” and then a number of stylesheets for specific media features, e.g. screen and (max-width: 480px)

    re. asyncing; purechat seems to be loaded purely by inline JS, but I do see script.async = true; in there so the purechat script _should_ be loaded async already?

    hope this helps,
    frank

    Thread Starter reggieofarrell

    (@ofarrellaudio)

    Thanks Frank. That helped me out a bit. I was able to add our custom.css file to the comma separated list of ignore file in the advanced options. It looks like it’s still being processed, but I guess maybe it’s just being minified now? For some reason, this fixes the problem in Chrome, but not Firefox. The issue is only affecting the header for logged in users, but this is a subscription site so most of our visitors are logged in. Any idea why this would be happening in Firefox and not Chrome? So strange!

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    It looks like it’s still being processed, but I guess maybe it’s just being minified now?

    AO indeed minifies excluded files if their name does not indicate they’re minified (e.g. custom.min.css or custom-min.css). you can turn this behavior off with a filter, more in in the AO FAQ

    Any idea why this would be happening in Firefox and not Chrome?

    no, would have to see this happening and inspect in the developer tools I’m afraid.

    but are the missing styles those in custom.css? if not, try excluding other CSS with simple-stupid trial and error?

    Thread Starter reggieofarrell

    (@ofarrellaudio)

    I ended up taking care of this by changing a CSS rule. Still doesn’t really make sense to me what was different. The rules wasn’t being overridden by something being out of order or anything like that. Anyhow, thanks for your help!

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    I ended up taking care of this by changing a CSS rule. Still doesn’t really make sense to me what was different. The rules wasn’t being overridden by something being out of order or anything like that

    good you found a workaround!

    Anyhow, thanks for your help!

    you’re welcome, feel free to leave a review of the plugin and support here! ??

    frank

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘css out of order?’ is closed to new replies.