Skip to:
Content
Pages
Categories
Search
Top
Bottom

[Resolved] How to disable bp-legacy css


  • micasuh
    Participant

    @micasuh

    I realize that I can overwrite the default CSS file using this structure in any theme:
    /buddypress/css/buddypress.min.css

    However, what if I want to completely disable it from loading? I’m using Roots theme and they already support Bootstrap’s preprocessors LESS and Sass out of the box. So, I think it makes way more sense to use this system to save a request than to force the theme to load the BP legacy CSS file.

    Do I deregister this css file and if so, how?

Viewing 14 replies - 1 through 14 (of 14 total)

  • danbp
    Participant

    @danbp

    i’m afraid that BuddyPress need this css file.

    BuddyPress Theme Development


    micasuh
    Participant

    @micasuh

    @danbp I understand that it might need some of those styles. However, I shouldn’t be forced to use them if I can style BP in my own way using LESS or Sass and save on that extra HTTP request.

    The styles provided in this file are also conflicting with theme styles that are very apparent such as font sizes. I’d rather everything be consistent with the theme’s core theme styles and not to have to fight specificity issues by overwriting a bunch of IDs set by this legacy CSS file.


    danbp
    Participant

    @danbp

    Yes i understand (i’m also using a bootstrap theme), you can do like you want. But don’t claim after that that BP doesn’t work correctly.

    BuddyPress css file contain only styles he need for itself. If your theme doesn’t obey to BP, you have to adapt the theme throught a child theme. This will also preserve BP’s compatibility with other themes.

    Imagine you have to debug something while using a modified BP or what will happen if you decide to use another theme…

    Keep also in mind that BP evolves more rapidly as most of themes. So IMHO it’s better you keep BP intact and alter the theme (if absolutely necessary because of a conflict – and unknow so far). And i don’t think that BP can’t be used with a bootspraped theme.


    r-a-y
    Keymaster

    @r-a-y

    I realize that I can overwrite the default CSS file using this structure in any theme:
    /buddypress/css/buddypress.min.css

    Note that buddypress.min.css is a bug and temporary. When v2.1.1 is released, the CSS file should be renamed back to buddypress.css.

    Check out the fourth point in the “Known Issues” thread:
    https://buddypress.org/support/topic/buddypress-2-1-known-issues/


    micasuh
    Participant

    @micasuh

    @danbp I guess there’s a misunderstanding so let me try to clear myself up. 🙂

    I understand that buddypress.min.css has baseline styles for BP and I do plan to reuse some of the code. However, it is not necessary for this code to be loaded in an external file when I can incorporate it into my compressed CSS file generated by the preprocessor.

    Secondly, disabling buddypress.min.css, I remove one HTTP request that doesn’t need to be there. In order to optimize the site’s load time, I need to get rid of any extra HTTP requests that are not necessary.

    Third, buddypress.min.css is a stylesheet that contains styles. There should not be anything within that affects the functionality or interactivity of BP, right? I can’t see how getting rid of this file will cause BP not to work correctly, as you first stated. What do I not understand?


    micasuh
    Participant

    @micasuh

    @r-a-y Does this mean that BP will ship with an unminified version of buddypress.css? I like that it’s minified by default, this is less file size to load. Is there not an option within BP to load the minified version if specified?


    r-a-y
    Keymaster

    @r-a-y

    Does this mean that BP will ship with an unminified version of buddypress.css?

    Sorry, I should clarify! BP already ships with an unminified version of buddypress.css. See /wp-content/plugins/buddypress/bp-templates/bp-legacy/css/buddypress.css.

    buddypress.min.css is loaded unless the SCRIPT_DEBUG is set to true.

    Most installs will not have SCRIPT_DEBUG set so the minified version is loaded.

    However, when you override the CSS in your child theme, in BP 2.1, this meant that we looked only for /wp-content/themes/YOUR-THEME/buddypress/css/buddypress.min.css, this broke customizations for sites relying on the CSS file to be named /wp-content/themes/YOUR-THEME/buddypress/css/buddypress.css.

    See https://buddypress.trac.wordpress.org/ticket/5888.

    To fix this, we are currently proposing that BP looks for CSS files on a production site in this order:

    1. /wp-content/themes/CHILD-THEME/buddypress/css/buddypress.css (this can be minified or not, your call)
    2. /wp-content/themes/PARENT-THEME/buddypress/css/buddypress.css (this can be minified or not, your call)
    3. /wp-content/plugins/buddypress/bp-templates/bp-legacy/css/buddypress.min.css

    If your child or parent theme does not have a buddypress.css file, it will fallback on the bp-legacy’s minified CSS.

    Does this clarify things? Or does this further add to the confusion 🙂


    micasuh
    Participant

    @micasuh

    @r-a-y thank you for the explanation, that does make it more clear what you’re talking about. And while it’s nice that this is included by default for convenience, I’m hoping there’s a way to deregister this file from loading at all so that I can include all of these styles in my preprocesser files instead.


    r-a-y
    Keymaster

    @r-a-y

    Like I said, as long as your custom BP CSS file exists in your theme – /wp-content/themes/YOUR-THEME/buddypress/css/buddypress.css, the one bundled with BuddyPress will not load – /wp-content/plugins/buddypress/bp-templates/bp-legacy/css/buddypress.min.css.

    If you don’t even want to include a custom BP CSS file in your theme, you could try using wp_dequeue_style( 'bp-legacy-css' ).


    micasuh
    Participant

    @micasuh

    @r-a-y Sure I understand what you’re saying.

    According to the end of your previous post, I am forced to load one of three files: buddypress.css in either child or parent, or buddypress.min.css in BP plugin directory.

    What I’m saying is I don’t want any extra file loading. I will use my theme’s built in stylesheet to load these styles, not an external file like buddypress.css or buddypress.min.css.

    It would be nice if there is a way to deregister or dequeue the stylesheet from loading, something like this:
    wp_dequeue_style( 'bp-legacy-css' );
    or
    wp_deregister_style( 'bp-legacy-css' );


    r-a-y
    Keymaster

    @r-a-y

    You have to probably run the function after everything else is enqueued.

    Something like:

    function my_dequeue_bp_styles() {
    	wp_dequeue_style( 'bp-legacy-css' );
    }
    add_action( 'wp_enqueue_scripts', 'my_dequeue_bp_styles', 20 );

    micasuh
    Participant

    @micasuh

    i don’t know what’s wrong but this didn’t work for me either. I put it right into my functions.php file.


    r-a-y
    Keymaster

    @r-a-y

    Just updated the code snippet. Try again with the latest code and let me know if it works or not.


    micasuh
    Participant

    @micasuh

    Perfect! That solved it!

    It’s funny how close I was but just didn’t write out the function or add_action.

    Thank you so much for your support.

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘[Resolved] How to disable bp-legacy css’ is closed to new replies.
Skip to toolbar